スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

    ウェブプログラミング講座

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

HomeFlash講座 > パスワードプロテクト

パスワードプロテクト

投稿日:2006年6月16日   レベル:初級    ソフトウェア:Flash


このチュートリアルは、ユーザーがパスワードを入力するボックスの作成を紹介します。
パスワードが正しければ、新しいページ、フレームに移動することになり、より安全なプロテクトがかけれます。

重要!:このFlashパスワードは絶対的なプロテクトではありません。非常に重要なケースでは使わないでください。ネット上にいるほとんどの人々はできませんが、Flashファイルはハッキングすることが可能で、そうなった場合、簡単に情報が引き出されてしまいます。

フラッシュファイルに関する、より高度なプロテクトがありますが、それには50$程度の費用が必要になります。


ステップ1:ドキュメントの立ち上げ

1.修正>ドキュメントへいってください。
2.小さなムービーを立ち上げます、私は323×45ピクセルとしています。
3.もし背景の色を変えたければ、好きにしてください。
4.OKとします。
5.テキストツールでPasswordと入力してください。
6.選択ツールを使って、ページの適当なところをクリックして、先程入力したテキストから選択を解除します。


ステップ2:入力ボックスを作成する

1.テキストツールを選択します。
2.テキストボックスをドラッグにより作成します。
テキストツールでドラッグして、ボックスを作成すれば、右上に四角があるボックスができるはずです。

500_501_016_2.jpg

3.プロパティパネルが開いていなければ、開きます。ウィンドウ>プロパティ(Ctrl F3)
4.テキストボックスが選択された状態で、テキストの入力を選択します。

500_501_016_3.jpg

5.フォント、サイズ、色を選択します。

500_501_016_4.jpg

6.左端揃えを選択します。
7.プロパティパネルがたたんだ状態なら、右下にある↓をクリックして広げます。もし、↑なら、すでに広がった状態です。
8.ラインタイプからパスワードを選択します。

500_501_016_5.jpg

9.テキストボックスの周りの線を表示させます。
10.変数名をpasswordとします。

500_501_016_6.jpg

メモ:小文字で変数名を入力します。
インスタンス名と混同しないように!

500_501_016_7.jpg


ステップ3:ボタンを作成する

1.ボタンを2つ作ってください。1つはEnterと上に重ねてください。もう1つはRetryにしてください。
参照:ボタンの作り方はこちらを参照してください。
2.フレーム1にEnterボタンを配置します。


ステップ4:プライベートフレーム

1.フレーム10で右クリック(MacではCtrlクリック)して、キーフレームを挿入してください。
2.テキストボックスを削除します。
3.テキストツールでステージに、ここはプライベートな場所です、お帰りください!とでも書いてください。
4.選択ツールでフレーム10を選択してください。
5.プロパティボックスで、フレームラベルにprivateと入力します。

500_501_016_8.jpg

タイムラインにこのようなフラグが立ちます
これからフレームを追加すれば、次のようなフラグに変わります。
6.Enterボタンをクリックしてください。
7.プロパティボックスのX,Yの位置座標に次のように入力します。

500_501_016_9.jpg

8.Enterボタンを消去してください。
9.ライブラリを開きます:ウィンドウ>ライブラリ(F11)
10.Retryボタンをドラッグします
11.Enterボタンと同じポジションに持ってきます。

メモ:プロパティボックスでX,Yに同じ値を入力します。


ステップ5:間違いフレーム

1.フレーム20を右クリックして、キーフレームを挿入します。
ここでタイムラインに’private’フラグが出てきたはずです。
2.ここはプライベートな場所です、お帰りください!というテキストを消去してください。
3.テキストツールで間違い!とステージに書いてください。
4.フレーム20を選択してください。
5.プロパティボックスでフレームラベルにwrongと入力します。
メモ:ここでも小文字で入力してください。後で、アクションスクリプトの記述もしていくので、スクリプト中の記述と一致させる必要があります。
6.フレーム30を右クリックして、フレームの挿入を行ってください。

メモ:これによってラベルwrongが現れるはずです。
これで、オブジェクトとレベルのレイアウトは終了です。後は、アクションスクリプトを残すのみ!


ステップ6:フレームアクションーフレーム1

1.フレーム1を選択してください。
2.アクションパネルが閉じていたら、開きます:ウィンドウ>開発パネル>アクション(F9)
3.次のアクションスクリプトを書いてください。


ステップ7:ボタンアクションーEnterフレーム1

1.フレーム1を選択します。
2.Enterボタンを選択します。
3.アクションパネルを開きます:ウィンドウ>開発パネル>アクション(F9)
注意:これはテストモードでは動作しません、ウェブページとしてパブリッシュされたときに動作します。
4.次のアクションスクリプトを記述してください。


ステップ8:ボタンアクションーRetryフレーム10

1.フレーム10へ移動します。
2.Retryボタンを選択してください。
3.アクションパネルを開きます。
4.ボタンに対して次のアクションスクリプトを記述します。


ステップ9:ボタンアクションーRetryフレーム20

フレーム20のRetryボタンに対して、フレーム10のボタンと同じアクションスクリプトを記述してください。これでムービーの作成は終了です。

注意!

重要:次のようにムービーのパブリッシュをおこなってください:ファイル>パブリッシュ設定>フラッシュ>ムービーの圧縮(Flash MXのみ)。これによって、パスワードを破るハッカーに対して、少しですが強くなります。

メモ:パスワードを使ったこのムービーでは、移動するさきのページはセキュリティ下にあるわけではなく、ただ隠されているだけです。厳重なセキュリティが必要な状況下での使用は避けてください。


引用:Web Design Library著者:Phil翻訳:atuk



スポンサードリンク

コメント

ランダム記事5件

2016年5月の人気記事ランキング