アンケートご協力のお願いgihyo.jpでは,2010年度に向けて豪華プレゼントが当たる読者属性アンケートを実施しております。ご協力ください。

gihyo.jp » DEVELOPER STAGE » 特集 » プログラマのためのFlash遊び方 » 第7回 Flashでジェネレータを作ってみよう

プログラマのためのFlash遊び方

第7回 Flashでジェネレータを作ってみよう

さて,今回はいままでの集大成として,少し凝った Flash を作成します。いきなりですが,完成品をご覧いただきましょう。Web 2.0風ロゴジェネレータです。

テキスト欄の文字を編集してみてください。リアルタイムにロゴが更新されます。

ジェネレータといえば,ボタンを押して少し待ってから結果が表示されるものがほとんどですが,Flashの表現力を持ってすれば,リアルタイムに反映されるものが作れるのです。

コンパイルしよう

今回のソースコードは全体で200行近くあります。2つのファイルを同じフォルダにダウンロードしてください。

mxmlcを実行してコンパイルします。

mxmlc -default-background-color=0xffffff LogoGenerator.as

コンパイルオプションに-default-background-color=0xffffffをつけています。これはデフォルトの背景色を白色に設定するものです。今回のサンプルは,背景が白色であることを前提にしているため,このように指定しています。

コンパイルオプションでWeb2Badge.asを指定していませんが,LogoGenerator.asの中でWeb2Badgeクラスを参照しているため,Web2Badge.asも一緒にコンパイルされます。

ソースコードの全体を把握する

個別の部分を見てく前に、LogoGenerator.asの全体を把握しておきましょう。LogoGeneratorクラスが定義されています。

package {
    import ...

    // LogoGenerator クラス
    public class LogoGenerator extends Sprite {
        // インスタンス変数の宣言
        private var inputText:TextField;   // テキスト入力欄
        private var reflection:Bitmap;     // 反射効果
        private var preview:Sprite;        // プレビュー表示
        private var previewText:TextField; // プレビュー文字
        private var hilight:Sprite;        // 明るくするハイライト
        private var badge:Web2Badge;       // BETA のバッジ

        // コンストラクタ
        public function LogoGenerator():void {...}

        // 表示オブジェクトの初期化
        private function initComponents():void {...}

        // 表示を更新する
        private function update():void {...}

        // 反射を更新する
        private function updateReflection():void {...}
    }
}

このクラスは6個のインスタンス変数とコンストラクタ,3つのメソッドから成り立っています。

コンストラクタ

最初にコンストラクタの処理をざっと見ていきます。

// コンストラクタ
public function LogoGenerator():void {
    // 左上に固定して拡大縮小されないよう指定
    stage.scaleMode = "noScale";
    stage.align = "TL";

    // 各コンポーネントを初期化する
    initComponents();

    // 初回の描画を行う
    update();

    // イベント登録を行う
    inputText.addEventListener("change", function(event:Event):void {
        update();
    });
}

Flashは表示する中身が埋め込まれたときのサイズに収まるように,自動的に拡大縮小されます。これを防ぐために,最初にstageのscaleModeプロパティを"noScale"(拡大縮小しない),alignプロパティを"TL"(左上に配置)と設定しています。

次に,自分で定義したinitComponents()メソッドとupdate()メソッドを呼んで,表示の初期化を行っています。最後に,テキスト入力欄の内容が変更されたときにupdate()メソッドが呼ばれるようにイベント登録しています。

それでは,それぞれのメソッドの処理を見ていきましょう。

著者プロフィール

最田健一(さいたけんいち)

有限会社 CO-CONV勤務のプログラマ。京都在住の京都好き。趣味で ActionScript 3.0やFlex 2を触っていたら,いつの間にか仕事でも使うことになっていた。個人ブログは「てっく煮ブログ」。

URLhttp://tech.nitoyon.com/

コメント

コメントの記入

パスサポ

多数の情報処理技術者試験対策書籍の発行実績を誇る技術評論社がお届けする,資格試験合格サイト「めざせ! 情報処理試験 パスサポ」が開設されました。

ピックアップ

サクセスストーリーに続く,快適サーバー運用管理のヒント!

データの増大,煩雑な管理,システムダウン,セキュリティなど,迫りくる課題からシステム管理者の負担を軽くするポイントを解説します。

gihyo.jp インフラエンジニア情報局

ネットワークやITにかかわるあらゆる業種で必要とされるインフラエンジニアに向けた技術情報や心構え,その魅力について多角的に紹介。

テストエンジニア ステーション

いま,ITに関わるあらゆる開発業務で注目されつつあるテスト系エンジニアをターゲットにしたコンテンツサイトを展開します。

一行クイックアンケート

gihyo.jpで取り上げてほしいネタは?

※検索はページ右上の検索ボックスをご利用ください。

その他の連載

キーパーソンが見るWeb業界

本連載はWeb Site Expert/gihyo.jpとの連動企画です。阿部淳也, 長谷川敦士, 森田雄のお三方による,Web業界をテーマにした座談会です。

きたみりゅうじの聞かせて珍プレー

ソフトウェア開発の現場で体験したトホホな失敗,思わずうなる珍プレーをきたみりゅうじ氏が四コママンガで紹介。みなさんからの投稿もお待ちしてます!

ActionScript 3.0で始めるオブジェクト指向スクリプティング

野中文雄氏が,簡単なスクリプトは書いたことがあるという初級者を対象に,ActionScript 3.0の基本からクラス定義までを解説します。

まだ間に合う「ITパスポート」受験対策 原山先生の短期合格塾

この連載では,4月18日のITパスポート試験の受験に向けて,短い期間で効率良く受験対策を行う方法や,確実に得点するための裏ワザなどを伝授していきます。

Ubuntu Weekly Recipe

Ubuntuの強力なデスクトップ機能を活用するための,いろいろなレシピをお届けします。

C/C++プログラマのためのDTrace入門

よくカーネルのチューニングや解析で活用されるDTraceですが,実はユーザプログラムの開発においても非常に有用です。連載ではC/C++プログラマやテストに関わる方向けにDTraceの使い方を解説します。

Blogopolisから学ぶ計算幾何

計算幾何学は,図形に関するアルゴリズムを研究するコンピュータサイエンスの一分野です。本連載では,ビジュアルブログ検索エンジン「Blogopolis」で採用されている計算幾何のアプローチを例に取り上げながら,計算幾何の初歩を実践的に学習します。

検索エンジンはいかにして動くのか?

本連載では, 今や誰もが利用している検索エンジンの中身を,全体の仕組みやデータ構造,アルゴリズムから分散インデックスまで,最近の研究事例も交えて紹介します。

連載一覧

gihyo.jp

  • DEVELOPER STAGE
  • ADMINISTRATOR STAGE
  • WEB+DESIGN STAGE
  • LIFESTYLE STAGE
  • SCIENCE STAGE
  • NEWS & REPORT

書籍案内

  • 新刊書籍
  • 書籍ジャンル一覧
  • 書籍シリーズ一覧
  • 新刊ピックアップ
  • ロングセラー
  • 電脳会議

定期刊行物一覧

  • Software Design
  • WEB+DB PRESS
  • Web Site Expert
  • 組込みプレス