【解決済】画像変形を行いたい(奥行、自由変形)

アバター
osakana
記事: 9
登録日時: 2020年11月16日(月) 01:33

【解決済】画像変形を行いたい(奥行、自由変形)

投稿記事by osakana » 2023年10月15日(日) 23:02

質問させていただきます。
画像の①や②のような画像変形を使いたいと考えています。
(やりたい事:キャラの立ち絵のパーツ(髪など)を動かす際に、自由変形を行いたい)
新規キャンバス1.jpg
新規キャンバス1.jpg (22.81 KiB) 閲覧数: 513 回


また、こちらの記事にて
疑似3Dの仕組み グラフィック編|ペンギンの寝床
https://woodpenguin.blog.fc2.com/blog-entry-562.html
>MZで画像を斜めに傾ける方法ですが、実はすごく簡単で Sprite 系クラスには skew という値があり、これを変更するだけで傾きます。
と紹介されていました。

そこで、
質問A:skewはMZ限定かどうか
質問B:①や②のような変形を実装しているプラグインはあるか
ということをお聞きしたいです。
画像変形に限らず、①や②の表示を実装しているプラグインがあれば参考にしたいと考えています。
どちらかだけでも教えていただけるとありがたいです!

よろしくお願いします。
最後に編集したユーザー osakana on 2023年10月20日(金) 21:55 [ 編集 1 回目 ]

キャラメイク系着せ替えゲームを作っています。
javascriptとかはほとんどわからない絵メインツクラ—です。
ツクール2000でミニゲーム作ったり素材提供したりしてました
ecf5DTTzl6h6lJj02
記事: 459
登録日時: 2018年12月23日(日) 13:55

Re: 画像変形を行いたい(奥行、自由変形)

投稿記事by ecf5DTTzl6h6lJj02 » 2023年10月18日(水) 22:56

こんばんは。
osakana さんが書きました:質問させていただきます。
画像の①や②のような画像変形を使いたいと考えています。
(やりたい事:キャラの立ち絵のパーツ(髪など)を動かす際に、自由変形を行いたい)
新規キャンバス1.jpg

また、こちらの記事にて
疑似3Dの仕組み グラフィック編|ペンギンの寝床
https://woodpenguin.blog.fc2.com/blog-entry-562.html
>MZで画像を斜めに傾ける方法ですが、実はすごく簡単で Sprite 系クラスには skew という値があり、これを変更するだけで傾きます。
と紹介されていました。

そこで、
質問A:skewはMZ限定かどうか
質問B:①や②のような変形を実装しているプラグインはあるか
ということをお聞きしたいです。
画像変形に限らず、①や②の表示を実装しているプラグインがあれば参考にしたいと考えています。
どちらかだけでも教えていただけるhttps://tm.lucky-duet.com/download/file.php?id=21532とありがたいです!

よろしくお願いします。

一応 ツクールMV のスプライトにも skew という値は存在します。
ですが、skew は シアー(剪断)変形における傾きの値を設定するものなので、
画像の①の変形は skew で行えますが、画像の②のような変形を行うことができません。
MVで採用されているPIXI .js のバージョンで定義されているスプライトには、
奥行をつけるような変形の機能はないので、
これを行うためには、変形用のメソッドを定義したプラグインをご自分で書くか、
ここら辺の知識のある人に、プラグインを書いてもらう必要があります。
そういったことができる既存のプラグインもちょっと思い当たりませんでした。

また、①に関しても、(MVの)ピクチャ用のスプライトでは、画面の更新時に skew の値がリセットされてしまうので、
リセットされないように処理を変更するようなプラグインを書く必要があります。

①に関しては、angle(ピクチャの角度) や skew (傾き) を設定して、
ピクチャの表示・移動を行えるプラグインコマンドを提供するプラグインを、
試作してみましたので、お試しください。
PictureExtend.js
(14.16 KiB) ダウンロード数: 14 回

あまり、きちんとしたチェックをしてないので、変な動きをする可能性があります。
また、競合対策は取ってないので、他のプラグインとの競合の可能性があります。

以上、ご確認ください。

追記 (2023/10/19 20:51)
以下の2点に関して修正しました。
  • ピクチャの移動用コマンドに完了までウェイトするかどうかのフラグをつけ忘れていた
  • ピクチャの移動用コマンドの 完了時間が正しく操作されておらず、設定した時間以上かかってしまっていた
この追記以前にダウンロードされている場合は再ダウンロードをお願いします。
アバター
osakana
記事: 9
登録日時: 2020年11月16日(月) 01:33

Re: 画像変形を行いたい(奥行、自由変形)

投稿記事by osakana » 2023年10月20日(金) 21:55

返信遅れてしまい申し訳ありません……!
書き込みありがとうございます!

一応 ツクールMV のスプライトにも skew という値は存在します。
ですが、skew は シアー(剪断)変形における傾きの値を設定するものなので、
画像の①の変形は skew で行えますが、画像の②のような変形を行うことができません。


なるほど……なんとなく一緒に捉えていましたが別物なんですね!

そして早速プラグインを使わせていただいたところ、まさに理想のものそのものでした……!
修正についてもありがとうございます!

プラグインコマンドの指定方法もとてもわかりやすく、回転や拡大率もセットで設定できてとても便利です……!
(②が不可能、skewの値がリセットという点については
今回①の変形を一部立ち絵をアニメーション的に動かすという用途の為、特に問題ありませんでした!)

本当にありがとうございます!
キャラメイク系着せ替えゲームを作っています。
javascriptとかはほとんどわからない絵メインツクラ—です。
ツクール2000でミニゲーム作ったり素材提供したりしてました
ecf5DTTzl6h6lJj02
記事: 459
登録日時: 2018年12月23日(日) 13:55

Re: 画像変形を行いたい(奥行、自由変形)

投稿記事by ecf5DTTzl6h6lJj02 » 2023年10月20日(金) 23:13

こんにちは。
osakana さんが書きました:返信遅れてしまい申し訳ありません……!
書き込みありがとうございます!

一応 ツクールMV のスプライトにも skew という値は存在します。
ですが、skew は シアー(剪断)変形における傾きの値を設定するものなので、
画像の①の変形は skew で行えますが、画像の②のような変形を行うことができません。


なるほど……なんとなく一緒に捉えていましたが別物なんですね!

そして早速プラグインを使わせていただいたところ、まさに理想のものそのものでした……!
修正についてもありがとうございます!

プラグインコマンドの指定方法もとてもわかりやすく、回転や拡大率もセットで設定できてとても便利です……!
(②が不可能、skewの値がリセットという点については
今回①の変形を一部立ち絵をアニメーション的に動かすという用途の為、特に問題ありませんでした!)

本当にありがとうございます!

修正版のダウンロードがされていないようです。
上の追記に書いた通り、プラグインに関してバグがあり、修正したものを上げなおしております。
ダウンロードをしなおしていただけるようお願いします。

“MV:質問” へ戻る