Mobile：NEWS

2003年8月29日　06:30 PM 更新

エンタメiアプリを作ろう
第3回　飾りをつけてみよう

iアプリ版カメラにエンタメらしい機能を考え実装してみる。

　前回まででiアプリ版カメラの写真保存機能を実装完了し、カメラらしくなってきましたが、エンタメアプリにはほど遠い状態です。第3回となる今回はエンタメらしいアプリにしていこうと思います。

　ただ写真が表示されるアプリでは面白くありません。まずは機能をいろいろ考えてみましょう。写真を使っていろいろできそうです。そこで思いついたのがアニメーションフレームの機能です。

▼▼完成イメージ

アニメーションするフレームの実装

　撮影した画像の上に一定間隔で2パターンのフレーム画像表示を行い、動くフレームを実装します。フレームは、スクラッチパッドなどに保存すると拡張性があり、便利ですが、今回はアプリ内のリソースとして2種類のフレームを準備します。

写真を見るネコ	照りつける太陽

　このフレーム画像を見てピンときた方もいると思いますがアニメーションフレーム機能の実装はそう難しくはありません。撮影画像を表示し、その上にタイマーを使用して2パターンのフレーム画像の表示を行います。

　方法はさまざまですが、ここではアニメーション用にカウンター（nFrameAnimation）を設け、shortTimerを使用し、タイマーイベント時に0、1の値に交互に変更して2パターンのアニメーションを行います。

（1）フレーム画像取得（初期処理）

　リソースに準備したフレーム画像の読込を行う。

//フレーム画像取得
for (nLoop1=0;nLoop1<4;nLoop1++) {
media=MediaManager.getImage("resource:///frame"+nLoop1+".gif");
media.use();
imgFrame[nLoop1]=media.getImage();
}

（2）タイマー開始（起動時）

　フレームがアニメーションを行えるようタイマーイベントの設定を行う。

//フレーム用アニメーションタイマー設定
timer=ShortTimer.getShortTimer(this,0,300,true);
timer.start();

（3）画像表示（paint処理）

　撮影画像表示後、撮影画像の上にフレーム画像の表示を行う。

//フレーム画像表示
g.drawImage(imgFrame[nFrameNo*2+nFrameAnimation],
nFrameDrawLeft,nFrameDrawTop);

※「nFrameNo」は2種類のフレームを管理する為に使用しています

（4）タイマーイベント（processEvent処理）

　2パターンのフレーム画像の入れ替えを行い、再表示を行う。

//タイマーイベント
if (Type==Display.TIMER_EXPIRED_EVENT) {
nFrameAnimation=Math.abs(nFrameAnimation-1);
repaint();
}

（5）左右キーでのフレーム種類の変更

　リソースに準備した2種類のフレームの切替を行う。

//フレーム切替ボタン(左右キー)
if ((Param==Display.KEY_LEFT)||(Param==Display.KEY_RIGHT)) {
nFrameNo=Math.abs(nFrameNo-1);
repaint();
}

　（1）〜（5）のような処理でアニメーションフレームの処理を実装してみました。ちょっとした機能実装で前回までのiアプリカメラのイメージががらっと変わります。動くフレームに合う写真を撮ることで面白い画像を知り合いに見せたりできますね。

　今回のアプリでは「撮る」という部分ではなく「見せる」という部分を強化して、少々エンタメらしくなってきました。次回はこれを使って更に拡張してみようと思います。

　今回のアニメーションフレーム対応カメラのソースはこちらです。

　

著者紹介 寺田雄一：携帯電話向けアプリの開発を行うRapl（らっぷる）の代表。ゲームなどエンタメ系アプリが主体だがビジネス系アプリの開発も行っており、現在は公式サイトのアプリ開発に携わっている。

---

関連記事
第1回 カメラを使ってみよう！
504iSから505iまで、ドコモの携帯電話で動作するiアプリの開発方法を全6回の連載でお届けする。第1回は、iアプリからカメラを操作する方法を学ぶ。

第2回　写真を保存してみよう
前回作成したiアプリ版カメラソフトに保存機能を実装する方法を説明する。

ドコモ四国、第2回iアプリコンテスト
ドコモ四国はiアプリおよび、505iで動作するFlashコンテンツのコンテストを開催する。


関連リンク
第2回ドコモ四国iアプリコンテスト
NTTドコモ四国
アプリ★ゲット

[Rapl 寺田雄一, ITmedia]

Copyright © ITmedia, Inc. All Rights Reserved.

---