Adobe Falshの「分解」というコマンドがありますが、文字の分解、つまり一文字に分解することにしか使ってなかったけど、対象によっていろいろな使い方があるのでその覚書。
- グループ → グループを解除
- インスタンス → シンボルとの関係を解除
- テキスト(1回目) → 1文字に分解
- テキスト(2回目) → アウトライン化
ショートカットは「Ctrl」+「B」
文字を分解するのにしか使っていなかったけど、こんなに使い道があるとは知らなかった。
Webに関わる全般的なことの自分用の覚書サイト
Adobe Falshの「分解」というコマンドがありますが、文字の分解、つまり一文字に分解することにしか使ってなかったけど、対象によっていろいろな使い方があるのでその覚書。
ショートカットは「Ctrl」+「B」
文字を分解するのにしか使っていなかったけど、こんなに使い道があるとは知らなかった。
環境
OS : Windows7
使用ソフト : Adobe Flash CS6
ランダムに表示させる画像を用意します。
今回は以下のような6枚の画像を用意しました。それをflashでランダムに表示させます。
flashを起動して、ファイル→新規→一般タブとクリック。
「ActionScript 2.0」を選択して、幅と高さを今回は画像に合わせ
幅を320px、高さを240pxに設定して「OK」をクリック。
ランダム表示させるためのシンボルを作成します。
挿入→新規シンボルとクリック。
「新規シンボル作成ウインドウ」が開くので「名前」に任意の名前を入力。今回は「random01」とします。「種類」に「ムービークリップ」を選択して「OK」をクリック。
左下のタイムラインにデフォルトで生成された「レイヤー1」をダブルクリックして「photo」に名称変更。
一番左下の「新規レイヤー」ボタンをクリックして、先ほど同様レイヤー名を「action」に変更する。
もしくは「挿入」→「タイムライン」→「レイヤー」としてもレイヤーを追加できます。
「photo」レイヤーの2フレームをクリックして、「ファイル」→「タイムライン」→「キーフレーム」、
もしくは「photo」レイヤーの2フレームを右クリックして、「キーフレームの挿入」をクリックして2フレームをキーフレームにします。
「ファイル」→「読み込み」→「ステージに読み込み」をクリック。
「読み込み」ウインドウが開くので読み込みする画像を選択して「開く」をクリックします。
ファイル名が連番になっていると下記のような表示が出ます。今回は「いいえ」をクリックします。すると画像が読み込まれます。
読み込まれた画像をクリックして、画像が選択されていることを確認してから、「修正」→「シンボルに変換」をクリック。
「シンボルに変換」ウインドウが開くので、任意の名前を入力します。今回は「p01」とします。種類に「ムービークリップ」を選択して「OK」をクリック。
3フレーム以降も2フレームと同じ手順で進めるのですが、キーフレームを挿入すると、2フレームのインスタンス(読み込ませた画像)がコピーされた形となるので、必ず削除してから新しい画像を読み込みします。このあたりで間違うと後述する不具合に関係してくるかもしれませんので要注意です。
シンボルに変換をランダムに表示させたい画像の数だけくりかえします。今回は6枚の画像を用意したので6回繰り返します。
2から7フレームに一個ずつ違う画像を配置しました。
「action」レイヤーの1フレームをクリックして選択し、「ウインドウ」→「アクション」をクリック。
ActionScriptを記述するための「アクションパネル」が開きます。右の空欄部分に今回の肝であるActionScript記述します。うへぇっ!やっぱりそうなのかよ!?と思われた方もいるかもしれませんが、自分もHTMLを扱っているくせにプログラム系の言語となると動悸、息切れ、めまい、吐き気が襲ってくるタイプなので、面倒なことはごめんです。簡単に済ませてしまうのでご心配には及びません。
下記をまずコピペします。
ransuu=Math.floor(Math.random()*7)+2;
gotoAndStop(ransuu);
だけです。
説明します。「ransuu」は乱数を入れるための入れ物です。変数ですね。変数を使うための宣言がなかったり、前に記号がつかなかったり見分けづらいところもありますが、プログラムが苦手な自分としては逆にあれこれ縛られずに使いやすかったりします。
「=」の右側はおまじないです。一つだけ修正しなければならないところが、今回の場合でいうと「7」のところです。察しのいい方はお気付きでしょうが、これがランダムに表示させたい画像の枚数と同じにします。上記は「7」となっていますが、今回は6枚の画像を用意して、それをランダムに表示させるので「6」とします。
もう少し説明すると、「rannsuu」に2から7までのランダムに発生させた数字を入れなさいという命令です。
次の行はカッコ内のフレームに行って止まれという命令です。カッコ内は「ransuu」となっているので、ランダムに発生する2から7までのフレームに行って止まりなさいという命令です。面倒なところはここだけです。でも、コピペして数字の「7」を「6」にするだけなので簡単ですよね。
これで画像をランダムに表示させるカラクリは完成です。「表示」→「移動」→「最初」でステージに戻ります。ちなみに同じように「表示」→「移動」→「random01」とクリックすると「random01」の編集画面に移動することができます。
「photo」レイヤーの1フレームを右クリック→「キーフレームの挿入」
「ライブラリ」タブをクリックして、ライブラリを表示させ、先ほど作った「radom01」をステージのドラッグします。
「ウインドウ」→「整列」をクリックして「整列」パネルを表示させます。
「ステージを基準」にチェックを入れて縦、横、それぞれ中央寄せをクリックします。
とりあえず、画像をランダムに表示させるだけならこれで完成です。「ファイル」→「パブリッシュプレビュー」→「デフォルト」、もしくはショートカットキーの「F12」を押すとブラウザでプレビューができます。起動するたび、もしくは更新ボタンを押す度にランダムに画像が切り替わります。
2~30フレームをドラッグして選択し、右クリックで「フレームの挿入」をクリック。
1フレームをクリックして「モーショントゥイーンを作成」をクリック。
30フレームを右クリックして「キーフレームの挿入」→「全て」をクリック。
このとき選択しようとしているフレームに再生ヘッドがクリックしようとしているフレームにあると思うようにクリックできなくてモニターに滅昇竜拳を食らわしたくなります。そういうときは再生ヘッドを他のフレームへ移動するとクリックしやすくなります。
1フレームをクリックして、ステージ上の「random01」をクリックして、「プロパティ」をクリックします。プロパティタブの「カラー効果」→「スタイル」の「なし」を「アルファ」に設定します。
アルファの調整スライダーが表示されるので「0%」に設定します。ちなみに、透明度0ということで表示されないということです。
同じ手順で30フレームをクリックして、ステージ上の「random01」をクリックして、「プロパティ」をクリックします。プロパティタブの「カラー効果」→「アルファ」を「100%」設定します。に設定します。
「action」レイヤーの30フレームを右クリックして、「キーフレームの挿入」とクリック。
「action」レイヤーの30フレームをクリックして、「ウインドウ」→「アクション」とクリック。
「アクションパネル」が開くので「stop();」と入力して、ウインドウを閉じます。
これで完成です。「ファイル」→「パブリッシュプレビュー」→「デフォルト」、もしくはショートカットキーの「F12」を押すとブラウザでプレビューができます。ブラウザの更新ボタンをクリックする度にふわーっと画像がランダムに表示されます。
※不具合
原因不明で検証していないのですが、おそらく、フレームを追加する際に、前のフレームのインスタンスを削除しないでその上に画像を読み込むと透明度が低いときに画像が重なって表示されるようです。また、画像だからとシンボルに変換する際に「ムービークリップ」ではなく、無意識に「グラフィック」を選択していたりすると表示されなかったり、思っている動作をしなかったりするようです。
また、そのような状況に陥った場合は手順に気を付けながら再度作り直した方が早いということを自分用覚書として書き留めておきます。きっとまた同じところではまると思うので・・。
動作確認済みの完成ファイル、素材一式を自分用に置いておきます。こんなものでよければ参考にしてみてください。ダウンロード、改変はご自由にどうぞ。
ダウンロード用ファイル「flashRandom.zip」