Flash®

画像/文字を表示してみよう

画面に文字を表示する
前回までで、基本的なFlash®を作成するための準備が整いました。いよいよ、実際にFlash®のコンテンツを制作してみましょう。

Flash®の画面上に文字を表示する方法について説明します。240x240のFlash Lite™2.0を作成できる状態にして下さい。(作成手順は、前回までのコラムを参照して下さい。)

ツールの画面全体を見てみましょう。


画面の左側に縦にアイコンが並んでいる部分が「ツール」と呼ばれる分です。ここでFlash®の上に文字を書いたり、絵を描いたりという作業の選択をします。画面の中断の、ほぼ中央にある白い四角が、Flash®のプレビューと呼ばれる部分です。この部分に文字や絵を書きます。画面の右側に縦にある部分が、「ライブラリ」と呼ばれる部分です。この部分は、次の章でFlash®に画像を取り込む場合に使用します。

以下の説明では、それぞれ必要な部分をズームアップした画像を紹介しますが、画面全体の中で、どの位置にどんなものが配置されていたかを思い出しながら進めると作成作業がスムーズだと思います。

それでは、さっそくFlash®の上に文字を書いてみましょう。まず、画面左側のツールのところから、「A」(左から2列目の上から4番目)の記号をマウスでクリックして下さい。


上の絵のように「A」の文字がへこんだようになります。この状態で、Flash®のプレビュー(白い四角のところです)の中の文字を記入したい場所を、下図のように選択して下さい。


上記の状態で、画面の下方にある「プロパティ」で、記載したいフォントの種類とサイズを選択します。


そして、先ほど作ったFlash®のプレビュー上の四角い枠の中に文字を記述すると、次のようになります。


プロパティを工夫することで、色をつけたりボールド/イタリックなどの装飾をつけたり、文字をセンタリングしたりすることが可能です。

これで、Flash®の上に文字を書くことが出来ました。次は、Flash®の中に絵を描いてみましょう。
画像の表示
基本的な手順は、文字をFlash®のプレビューの上に書く方法と同じです。


画面左側の「ツール」の上から5番目と6番目の4つのメニューが絵を書くためのものです。1列目の5番目の丸い記号は円を描くツールです。2列目の5番目の四角い記号は四角を描くためのツールです。1列目の6番目は、細い線を描くツール(鉛筆ツール)で、2列目の6番目は太い線を描くツール(ブラシツール)です。

試しにブラシツールで、描いてみたものが、以下のものです。


どのツールを使っても、付属の機能で上手に画面上に絵を描くのは、非常に難しいことがわかると思います。これらのツールは、あくまでも「おまけ」として付いているものだと思った方が良いと思います。

では、多くのFlash®作者の方々は、どのようにしてFlash®上に絵を描いているのでしょうか?それは、Adobe® Photoshop®のような専門の画像作成ツールを使用して作成した画像をFlash®の中に取り込んで使用しています。

※画像作成専用の各種ツールについては、本コラムの趣旨と離れるため記載しません。。

外部から画像を読み込む
Flash®に直接、絵を描くことは非常に難しい作業でした。では、既に完成したグラフィックをFlash®に取り込んでみましょう。取り込む手順は非常に単純です。

メニューから「ファイル→読み込み→ステージに読み込み」を選んで下さい。読み込みたい画像を選択するダイアログが表示されますので、画像ファイルを選択して「開く」を押して下さい。


上記のように、Flash®のプレビューの右側に読み込んだ画像が表示されたと思います。これをFlash®のプレビューの上に移動します。

まず、ツールの1列目の1番目の「選択ツール」を押して下さい。この状態で取り込んだ画像をFlash®のプレビューの上にマウスでドラッグ&ドロップして移動します。

移動した状態が次のようになります。


同じ画像をもう1度、Flash®のプレビューの上に表示したい場合があると思います。画面の右側の「ライブラリ」を見て下さい。


ここに、今、移動した画像がリストとして表示されていると思います。この名前の部分(絵ではcat.jpg)を選択して、マウスでFlash®のプレビューの上にドラッグ&ドロップすることで、何個でも画像をFlash®のプレビューの上に表示することが出来ます。


これは、ライブラリから4つの猫の画像をFlash®のプレビューの上にドラッグ&ドロップしてみたものです。

このようにして、外部のツールできれいに作成された画像を簡単にFlash®に取り込むことが出来ます。

さて、次回は、いよいよ、このように取り込んだ画像にFlash®の醍醐味である「動き」を付けていきます。

記事執筆:庄司 高士(元気モバイル株式会社 常務取締役)

略歴:1970年 神奈川県出身
1998年より某ゲームメーカ-勤務。モバイルコンテンツ事業の立ち上げと、オンラインゲーム事業の立ち上げをしたあと、2006年に現職に就任。現在、コンテンツプロバイダとして、ソフトバンク向けサービスを提供している。