PR

FlexでFlashコンテンツを作ろう

2008年7月16日(水)
高橋 義博

簡単に現在の時刻を表示する

 では、現在の時刻を表示するActionScriptを説明していきます。

 図3の「toLocaleTimeString()による時刻表示」に書かれている「var now:Date = new Date();」ですが、Dateクラスを利用して現在の日時・時刻を取得している個所になります。「toLocaleTimeString()」を利用すると「00:00:00 AM」という形式で現在の時刻を取得することができますので、この値をラベルに表示しています。この時刻表示全体は、「nowTime()」という名前で設定されていて、タイマー機能「startTimer()」で1秒ごとに表示が更新されます。「実行ボタン」からブラウザでデジタル時計の動作を確認することができます。

 しかし、「toLocaleTimeString()」を利用すると表示形式「00:00:00 AM」を変更することができないため、「時」「分」「秒」を別々に取得して、「00時00分00秒」と表示も試してみたいと思います。

時刻の表示形式をカスタマイズ

 「時」「分」「秒」を別々に取得する方法ですが、図3の「時刻の表示形式をカスタマイズ」のActionScriptの記述にありますように、「.getHours()」「.getMinutes()」「.getSeconds()」と指定することにより、「時」「分」「秒」を取得することができます。記述も分かりやすい英語ですので、意味も理解しやすいと思います。

 取得した「時」「分」「秒」の値は、ぞれぞれ「hour」「min」「sec」という変数(値を格納する入れ物)に入っています。その値をラベルに表示するのですが、「+」を利用して変数と文字を連結して表示させています。この方法を利用すると、ご自身で好きな時刻の表示形式を作成することができます。

 このように、コンポーネントとActionScriptを組み合わせて、Flex Builder 3ではFlashコンテンツを作成していきます。図3に書かれているMXMLファイル(simpleDigitalClock.mxml)は、こちらからダウンロード(http://www.thinkit.co.jp/images/article/102/3/10232.zip)することができます(10232.zip/0.719 KB)。

 次回は、いよいよAIRコンテンツ作成の説明をしていきます。お楽しみに!

制御機器メーカーでソフト開発やWebマスターの業務を経て、2007年からフリーランスとして、Webサイト制作、Flashコンテンツ制作を行っている。また、WebスクールでWebデザイン、Flash制作の講師などを担当し、経験を生かして幅広い指導を行っている。

Think IT会員サービス無料登録受付中

Think ITでは、より付加価値の高いコンテンツを会員サービスとして提供しています。会員登録を済ませてThink ITのWebサイトにログインすることでさまざまな限定特典を入手できるようになります。

Think IT会員サービスの概要とメリットをチェック

他にもこの記事が読まれています