Vol de Nuit ~夜間飛行~

App Inventor2でアプリを作る中年オヤジの無謀な挑戦日記

App Inventor2 でAndroidのアプリを作ってみる 6. とりあえず動かそう(2)

前回でアプリの画面ができましたので、今回から動作を実行させるための手順を。

 

1. AI2でアプリのボタン配置などを行っていたデザイン画面の右上に、"Blocks"ボタンがあるので、クリックします。これにより、動作の記述を行う画面に移動します。f:id:spice_jp:20160514082606j:plain

2.下図画面が動作記述をするブロック画面です。デザイン画面と同じようにドラッグ&ドロップでブロックを配置して動作を組み立てていきます。

f:id:spice_jp:20160514084124j:plain

3.さっそくやってみましょう。

まず最初に左側のメニューから先ほど配置したボタンをクリックします。すると新たにいくつかのブロックが表示されるので、”when ボタン名 Click"をドラッグして、中央の画面にドロップします。

f:id:spice_jp:20160514084705j:plain

4.ドラッグすると下図のようになります。

f:id:spice_jp:20160514085058j:plain

5. 同じように、先ほど配置したラベルを選択して、

"set ラベル名.Text to "をドラッグ&ドロップします。

f:id:spice_jp:20160514085733j:plain

6. すると下図のようになるので、緑色のset ブロックをドラッグしてwhenブロックにはめ込みます。

f:id:spice_jp:20160514090027j:plain

はめ込むとき"カチッ"と音がします。

 f:id:spice_jp:20160514091157j:plain    

7. 次に左メニューで”TEXT"をクリックして一番上にある、"  "ブロックをドラッグして配置します。

f:id:spice_jp:20160514090849j:plain

8. 配置したTEXTブロックの” ”部分をクリックすると文字列が入力できるので、Helloと入力します。

f:id:spice_jp:20160514091617j:plain

9.入力後、TEXTボックスを先ほどのsetボックスに接続します。

f:id:spice_jp:20160514091816j:plain

これで、ブロックは組みあがりました!

このブロックの意味は、

f:id:spice_jp:20160514092710j:plain

という動作を表しています。

10. エミュレータで動作を確認してみましょう。

aistaterを起動して、上部メニューのConnectからEmulatorを選択します。”Push!”ボタンをクリックすると”Hello"が表示されればOKです。

f:id:spice_jp:20160514093645j:plain

どうですか?正常に動作が確認できましたか?

もし動作がおかしければ、もう一度ボタンなどの配置や動作ブロックの内容を確認しましょう。

 

基本的にこれらの操作の繰り返しを行うことで、さらに複雑なアプリを作成することができます。