【第二弾】【アプリ作成編】AppInventorでAndroid携帯向け手品アプリを作ってみた


 前回のエントリで、第2弾の手品アプリ作成のための素材画像をアップロードしました。

【第二弾】【アプリ素材編】AppInventorでAndroid携帯向け手品アプリ - 工作blog

今回はこの素材を使ってアプリを作る方法を紹介したいと思います。

ただ以前、動画での解説もしましたので今回は画像だけにしたいと思います。

以前のエントリ:AppInventorでAndroid携帯向け手品アプリを作ってみた【アプリ作成編 - 工作blog

*ちなみにこちらの手品で使うトリックカードはまだあまっていますのでほしい方はコメントください。

インタフェースの作成

*画像が見難い場合は画像をクリックしてください。HatenaFotolifeが開くと思いますので、そこで『オリジナルサイズを表示』をクリックしてください。画像が大きくなります。


このような感じにCanvasを設置します。

ちなみに僕は画像をBoneCard1.png、BoneCard2.png・・・BoneCard12.pngというシリーズと、CardBone1.png、CardBone2.png・・・CardBone12.pngというシリーズでアップロードしています。(そのためブロックエディタの画面でもこの名前が出てきます)


その上にImageSpriteを2つ設置します。 



Canvasの下にHorizontalArrangementを設置します。そしてその中にButtonを3つ配置します(下の画像参照)


スキャンボタンの左側と右側は『80ピクセル×70ピクセル』のサイズに設定し、カメラボタンだけは『160ピクセル×70ピクセル』に設定します。


最後にClock2つととCamera1つを配置します。

以上でインタフェイス設定は終了です。

ブロックエディタ設定

これがブロックエディタの全体像です。

こちらはアニメーションの部分を拡大したものです。
タイマーを使ってアニメーションを表現しています。
make textでアップロードした画像ファイルを指定します。


最後のカメラコンポーネントも忘れずに配置します。


以上を設定して、アンドロイド携帯向けにパッケージ化すれば使えると思います。