3月4日 Flash

photoshopで同じサイズの画像(5枚)をレイヤー別々に分け、psdでweb用保存したものをスライド形式で→で切り替えられるものを作ります。

 

flashの基本の操作と考え方

d.hatena.ne.jp

d.hatena.ne.jp

 

①新規作成

②ファイル→読み込み→ステージに読み込む  を選択し、キーフレームにチェックを入れて→OK

f:id:paris1204:20160304222633p:plain

 

 

③レイヤー1のメモリを1〜5までドラッグし、フレームを挿入する。

f:id:paris1204:20160304223943p:plain

f:id:paris1204:20160305124341p:plain

④レイヤー1のコマの1を選択した状態で、ウインドウ→アクションで入力画面を開いてthis.stop();と入力する。(これを入力しないとctrl + enterを押した時に5枚の画像が無限に動いて表示されてしまう。)

f:id:paris1204:20160305124718p:plain

⑤ボタン用の新規レイヤーを作る。(配置は一番上でないと押せない)

f:id:paris1204:20160305125057p:plain

⑥ボタンの背景画像を描く。ボタンレイヤーを選択した状態でする。

まず、下の画像のように長方形を右寄りに作る。

f:id:paris1204:20160305125556p:plain

 

⑦緑色長方形を選択した状態で修正→シンボルに変換で下の画像と同じ選択→OK

ctrl +enterを押すと長方形部分のカーソルが変わります。

 

 

 

⑧新規レイヤーを追加する。

2つのレイヤーを選択した状態で右クリックしフレームを挿入する。(ヒットまで。1回でできなければ3回にわけてする)

新規レイヤーに矢印を描きます。

 

まず線を引きます。

f:id:paris1204:20160304230531p:plain

この線を選択し、修正→変形→回転と傾斜をクリックします。

右側にある変形をクリックし下記の様に好きな角度を入力します。(X軸の右側を0°とし、反時計周りで度数が増えていきます。)

f:id:paris1204:20160304230834p:plain

斜めになった線を選択し、コピー→同じ位置にペーストする。

修正→変形→縦反転をして反転した線を↓キーでずらして位置を合わせる。

矢印にできたら二つの線を同時選択し、ctrl + Gでグループ化する。

f:id:paris1204:20160304235109p:plain

10:シーン1(ステージ)の画面に戻り、ボタン全体をコピーし、修正→変形→横反転で反転させ左端に寄せる。

ctrl + enterを押すと左右の長方形にボタン機能があるのがわかる。

ライブラリに保存されているのはシンボル化されたオブジェクトでこれはオリジナルの部品です。これをステージの画面上でコピー&ペーストし、反対側の矢印となる。だがペーストされた画像はオリジナル画像を元にした分身であり、これをインスタンスと呼びます。

 

11:ライブラリの長方形のレイヤーを選択、アップの位置からヒットの位置までキーフレームをずらして、display機能だけを持たせた透明の背景画像として機能させる。

f:id:paris1204:20160305132933p:plain

f:id:paris1204:20160305132940p:plain

アップ=リンク状態

オー=ホバー状態

ダウン=アクティブ状態

ヒット=display状態

 

12:ステージに戻り、左右それぞれの矢印をクリックした状態で下記の様にスクリプトを入力する。

on (release) {
if(_currentframe !=5){
nextFrame();
}else{gotoAndStop(1);
}
}

 

f:id:paris1204:20160304221443j:plain

 

 

on (release) {
if(_currentframe !=1){
nextFrame();
}else{gotoAndStop(5);
}
}

f:id:paris1204:20160304221432j:plain