「んとねー、たとえば、ある画像が表示されていて、主人公が顔を横に向けると、その風景がずるずるーって横に移動して、今までは見えなかった部分が見えてくるやつなんだなー」

「ほー。何だか凝ったことばっかり要求するんだな、お前」

「んでも、ゲームとかやってて、そーゆー効果が使われてんと、すきゃんてぃ、んきゃーかっこいー、とか思っちゃうんだなーこれが」

「安心しろ。吉里吉里／ＫＡＧではすごく簡単にできるから」

「ほんとー！？」

「それじゃ、どうやったらそれができるかを説明しよう」

「楽しみだなー」

「吉里吉里／ＫＡＧにはレイヤーを滑らせる機能もあるけど、残念ながらこれは背景レイヤーには使えない。それに、ただ単にレイヤーを滑らせて移動するだけなら、お前が言っていた効果は期待できない」

「それじゃ、どーすんのよもー」

「そこで、トランジションを使うんだ。今まで勉強してきたユニバーサルトランジションじゃなくて、スクロールトランジションを」

「そんなの知らない」

「スクロールトランジションを行うには、[trans] タグの method 属性を scroll にしてやればいい。必要な属性は、ユニバーサルトランジションで使った timeと、スクロールトランジション用の from と stay の二つだ。基本書式は、こんな感じになる」

「 from の部分の方向で、ずるずるずるーって滑っていく方向を指定すんの？」

「違う。逆だ。滑って行く方向は to になるだろうが。from で指定するのは、二枚目の画像が画面のどちらから入って来るか、だ。移動する方向じゃない」

「んー？」

「上から入ってくるなら from=top、下から入ってくるなら from=bottom、右から入ってくるなら from=right、左から入ってくるなら from=left になる」

「んぢゃー早速やってみんもん」

「その前に、スクロールトランジションでお前が言うようなパノラミックな効果を使いたければ、画面の二倍のサイズに該当する横長、もしくは縦長の画像を用意し、それを半分に切って二枚に分けて準備しておく必要があるぞ」

「それはもー準備したもん！」

　（左側：test01.jpg）

　（右側：test02.jpg）

「練習用に、あんたの『とるこ珍道中』から借りちゃったもんねー」

「ま、いいか。彼らの肖像権はクリアされているし、『インターネットに出るぞ』って言ったら喜んでいたし」

「だと思ったもん」

「上のパノラマ画像を使ってチュートリアルを試してみたい人はここからダウンロードして下さい。サイズは１１５ＫＢです」

「んでもって、この二枚はつながってんだもんねー。それをずるずるずるーって動かしたいんだもん。最初は１のほーから、２のほーへ」

「それじゃ、スクリプトを書いてごらん。間違っていたら教えるから」

「んー」

「これでどーかなー？」

「おいおい、前々回にやったことをすっかり忘れてるぞ。それじゃ文字レイヤーの黒い枠が消えていないじゃんか」

「あ、そーかー。それぢゃー、復習の意味で、文字レイヤーを『うにばーさる』トランジションで消しちゃおう」

「『うにばーさる』じゃなくて『ユニバーサル』だってば……」

「どっちでもいーぢゃんよもー！」

「消えた文字レイヤーは、ちゃんと表示させたもん」

「……」

「それぢゃー、実行ー！」

「……」

（一枚目の画像と文字が表示されて……）

↓

（トランジションで……あれれ？）

↓

（黒くなった所に二枚目の画像が右側からずるずると……）

「んきゃー！　何よこれもー！」

「やると思った」

「あんでこんなになっちゃうのよもー！」

「スクリプトのミスだ。もう一度よくチェックしてみよう」

「問題は、黄色で示した部分のトランジションにある」

「んー、わかんない」

「トランジションはどういう概念で行われる？」

「バックグラウンドの画像をフォアグラウンドに持ってくる」

「じゃあ聞くが、問題の黄色い部分のトランジションを行った時、画像レイヤーのバックグラウンドはどうなってる？」

「……！　からっぽだ！」

「その通り。文字レイヤーを消す意味で [trans] タグを使うのは構わないが、背景レイヤーのことを何も考えていないとああなる」

「んーんーんー（思考中）」

「背景レイヤーをトランジションから除外するために [trans] タグに layer=message0 を指定する方法もあるが、これは演算量の関係からあまり勧められていない」

「……ごそごそ……」

「ん？　何してんだ？」

「こーかなー、とか思って、スクリプトを書いてみたんだもん。んでも、あんまし自信ないんだなーこれが」

「どれどれ？」

「……」

「やっぱし違うね−」

「いや、合ってる。お前、熱でもあるのか？」

「んー？」

「それで正解だ。つまり、背景レイヤーに画像を読み込んだ直後に、[backlay] タグでフォアグラウンドからバックグラウンドへ画像をコピーしておけば、その後、文字レイヤーのトランジションが行われた時も、空の内容ではなく、フォアからバックへコピーされている同一の画像が、トランジションされてくることになるからだ」

「んでも、自信ないなー」

「実行してごらん」

（一枚目の画像と文字が表示されて……）

↓

（文字レイヤーがトランジションで消えると同時に
　コピーした同じ背景画像がバックからフォアに読み込まれてきて……）

↓

（二枚目の画像が右から入ってきて……）

↓

（文字レイヤーの黒枠がトランジションで表示されて……）

↓

（文章が表示されて完成！）

「できたー！」

「うん、えらいえらい。自分でちゃんと気がついたとは意外だった」

「んきゃー、かっこいーぢゃんよもー！」

（↑一人で何度も実行しては悦に入っている）

「それと、ここで新しいことを教えておくと、[trans] タグの method=universal は省略できるんだ。省略するとユニバーサルトランジションが自動的に設定されたことになる。だから、スクロールトランジションを使いたいときだけ method=scroll を指定してやればいい」

「んぢゃ、ちょっと直すもん」

「な。これで随分すっきりしただろ？」

「そーだねー」

「ユニバーサルトランジションを指定する場合は、属性は time、rule、vague の三つだけでいい。スクロールトランジションの方は、method=scroll、time、from、stay の四つだけでいいことになる」

「すきゃんてぃ自信ついたもん！　だんだんわかってきたもん！」

「それじゃ、今日はここまでにしておこう」

練習日記　２日目　まとめへ