ガレージ暮らしのトライタム

プログラムやツールの解説や技術を公開する場所

apricotモデル作成(その1)

デスクトップマスコット、apricotのモデルを自作しましょうというものです。
進捗具合も兼ねての記事です。

Apricotとは何かという方は前回の記事をご一読ください
traitam.hatenablog.com

今回はとりあえず、1枚絵を表示、開始時、終了時に喋る処理を書いて終わりです。
こんな感じになります。f:id:traitam:20170102222909p:plain

最初に、素材を用意します(大変なところ)。透過処理済みの素材です。
素材は五月雨ちゃんです。サイズは175*250です。大きくし過ぎてもデスクトップマスコットだとデスクトップを占領してしまうので…。
モデルを動かすには.xml拡張子のファイルが必要です。これを何かしらのテキストエディタで作成します。場合によっては既存のモデルのデータをコピーして持ってくるのも手ですね。
内部の記述を全部消して、ファイル名を変えてもOKです。

次にフォルダの作成ですが、
[キャラ名]
-[Images]-[image.png]
-[キャラ名.xml]

という感じにします。
そしてこのフォルダを[Apricot]->[Character]フォルダに挿入します。

では、ちょっと大変ですが.xmlデータ内に書いていきましょう。
まずは、一覧を表示して、各種説明という形にしていきます。

<?xml version="1.0" encoding="utf-8" ?>
<script>
  <character name="さみだれちゃん" origin-x="45" origin-y="20" x="0" y="0" width="219" height="313">
    <sequence name="samidare.Neutralize">
      <motion fps="30" z-index="0">
        <image x="0" y="0" width="175" height="250">Images\samidare-base-all.png</image>
      </motion>
    </sequence>
    
    <sequence name="Idle">
      <sequence name="samidare.Neutralize" />
    </sequence>
    <sequence name="Start">
      <sequence name="samidare.Neutralize" />
      <message>五月雨って言います<break/>護衛任務はお任せください</message>
    </sequence>
    <sequence name="Stop">
      <sequence name="samidare.Neutralize" />
      <message>それでは、また</message>
    </sequence>
  </character>
</script>

これで、モデルが表示されたときに一言喋って、ソフトを終了したときに一言喋るようになります。

 <character name="さみだれちゃん" origin-x="45" origin-y="20" x="0" y="0" width="219" height="313">

これで、モデルの定義を行います。originは表示時の場所です。全体の左上が(0,0)になってます。
ちょっと空けておかないと画像が切れて表示されちゃうんですよね。あと飛び跳ねた処理を行った時に画像が切れちゃったり…。

<sequence name="samidare.Neutralize">
  <motion fps="30" z-index="0">
   <image x="0" y="0" width="175" height="250">Images\samidare-base-all.png</image>
  </motion>
</sequence>

これはモデルの基本状態を定義する処理です。
シーケンスで囲ってますね。
motionタグがあります。これでfpsや画像を複数使う時に前後関係を定義します。
画像のパスは.xmlがあるパスからの相対パスになっています。
motionタグで、そのキャラの動きを定義します。これを活用して、起動したときにどんな動きをさせるか決定できます。

<sequence name="Idle">
  <sequence name="samidare.Neutralize" />
</sequence>

これはアイドリング状態に何のモーションを再生するか、という記述です。
今回は基本状態のモーションしかないのでこのように基本状態のモーションを入れておきます。

<sequence name="Start">
 <sequence name="samidare.Neutralize" />
 <message>五月雨って言います<break/>護衛任務はお任せください</message>
</sequence>

Startネームタグ。
これはモデルが表示されたとき(モデル変更、ソフト起動)に呼ばれるタグです。
messageでモデルの上に吹き出しを作り、その中に言葉を入れて喋らせます。
breakで改行ができます。

Stopネームタグはソフトが終了したときに呼ばれるタグです。
やっていることはStartと同一なので説明を割愛します。

起動時はこんな感じになります。
f:id:traitam:20170102225720g:plain

メモQ&A
Q.origin-x,yの数値はどこから持ってくるの?
A.PhotoShopにある座標検出機能を用いてそこから持ってきます。

Q.PhotoShopが無い人は確認できない?
A.みたいです。仕方ないので、「記述->起動・確認->記述修正」を繰り返してください。
 あ、でもキャンパスからの座標を検出できるものがあれば大丈夫なのかも。


それではみなさん、楽しい創作ライフを!

次回
traitam.hatenablog.com