第1章 Hello Purr

この章では、アプリの構築を始まる。 App Inventorのコンポーネント デザイナー、ブロック エディターの主要な要素を紹介し、最初のアプリHelloPurr を作成する基本的な手順を案内する。これら完了したら、独自のアプリを構築する準備が整った。

新しいコンピューター システムに典型的な最初のプログラムは、すべてが正しく接続されていることを示すメッセージ”Hello World”を出力する。この伝統は 1970 年代、ブライアン ・ カーニハンはベル研究所のCプログラミング言語の仕事のころにさかのぼる。App Inventorでは、最も単純なアプリは、メッセージを表示以上のことを行う:サウンドを再生し、デバイスにタッチすると反応する。だから、我々はよりワクワクするものをすぐに始めるつもりだ:最初のアプリが(図1-1に示すように)「HelloPurr」、猫の絵をタッチするとにゃあとに鳴り、見えている状態でデバイスを振るとぶうぶうと震える。

図1―1 HelloPurrアプリ

学習要点

この章では、次のトピックについて説明する:

コンポーネントを選んで、アプリの動作を指定する; コンポーネントデザイナーからコンポーネントを選んで、一部のコンポーネントはデバイスの画面に表示され、そうでないものがある; コンピュータからメディアファイル(音あるいは画像)をアップロードして、アプリの中に追加する; ブロックエディターを使ってブロックを組み立て、コンポーネントの動作を定義する; App Inventor のライブテスティングでアプリをテスト。アプリを作りながらでも、デバイス上で外観と動作状況を見ながら、ステップバイステップで進める; アプリをビルドしてパッケージ化し、デバイスにダウンロード。

App Inventorの開発環境

Ai2.appinventor.mit.eduをブラウザーで開いて、 App Inventor を使ってプログラミングを始められる。これは 2013 年 12 月にリリースされたApp Inventorの最新バージョンを開く。それをApp Inventor 2 と呼ぶ者もある、正式にApp Inventorと命名され、以前のバージョンは、App Inventorクラシックと呼ばれている。本書では新しいバージョンを使用する。

コンポーネントデザイナー(図1-2)。アプリのコンポーネントを選択し、そのプロパティを指定する; ブロック エディター (図 1-3)。コンポーネントの動作を指定するときに使用 (例えば、ユーザーがボタンをクリックしたとき何が起こるか); Android 端末を実際に実行してそれを開発するようにアプリをテストする。手元にAndroidデバイスを持っていない場合は、システムに付属のAndroidエミュレータを使用してビルドしたアプリケーションをテストすることができる。

図1―2 コンポーネントデザイナー

図1―3 ブロックエディター 初めてAppInventorを使うので、プロジェクト(Projects)のページが見ると、おそらく空いていて、まだプロジェクトを作たことがないためである。ページの左上の“Projectをクリックして、Start newproject…”でプロジェクトを作て、プロジェクトの名前として“HelloPurr”を入力し(一つ単語として、スペースなし)て、それからOKをクリックする。

最初に開くウィンドウはコンポーネントデザイナー(Designer)で、ウィンドウの右上のBlocksボタンをクリックしてブロックエディターに切り替えることができる。

App Inventor はクラウド コンピューティング ツールである、つまり作業中アプリがオンラインでサーバーに保存されていること。だから App Inventor を終了する場合、作業に戻ると、アプリがまたそこにある。Microsoft Word のファイルの様に、コンピューターに何かを保存する必要はない。

デザインコンポーネント

私達の使った最初の道具はコンポーネントデザイナー(あるいは単にデザイナー)。コンポーネントは、レシピの食材のように、アプリケーションを作成するために組み合わせる要素です。一部のコンポーネントはとても簡単で、“Label”(ラベル)のコンポーネントは、画面上で文字を表示する;“Button”(押しボタン)のコンポーネントは、ボタンをタップするとアクションを開始する。その他のコンポーネントが更に複雑である:“Canvas”(キャンパス)コンポーネントは静止画像あるいはアニメーションを入れることができる;“accelerometerSensor”(加速度のセンサー)コンポーネントはデバイスを移るまたは振るときを検出するモーション センサーである;他にショートメッセージを送信、音楽とビデオを再生、およびウェブサイトから情報を得るなどのコンポーネントはある。

デザイナーを開ける時、画面は図1―4に示したのようである。

図1―4 App Inventor コンポーネントデザイナー

デザイナーはいくつかの領域に分られる:

中部の白色地区はプレビューウィンドウ(Viewer)といい、アプリの中で必要なコンポーネントを配置する、自分の好みでコンポーネントを配置することができる。プレビューのウィンドウはおおざっぱに外観を表示することしかできなくて、例えば、デバイスの中のアプリをテストすると、プレビューのウィンドウの中でのが比較すると、一行の文字は恐らく異なる場所に改行する。もし実際に使う時の外見を見たい場合、アプリを自分のデバイス、あるいはApp Inventorに内蔵するエミュレータでテストする(少しの後に詳しい紹介)。 プレビューの窓口の左側はコンポーネントのパレット(Palette)で、その中は選ぶことができる各類のコンポーネントを含み。このパレットはいくつかに分類され、デフォルトではにユーザー・インターフェース(UserInterface)のコンポーネントしかなくて、その他の分類の見出しをクリックすると、例えばMedia(メディア)など、その分類のコンポーネントも見れる。 プレビューのウィンドウの右側はコンポーネントのリスト(Components)で、プロジェクト中のすべてのコンポーネントを表示した、いかなるコンポーネントをプレビューのウィンドウの中のドラッグすると表示する。現在、このプロジェクトの中で1つのコンポーネントしかありません:Screen1,それはデバイスのスクリーンを代表する。 コンポーネントのリストの下はメディアのリスト(Media)で、プロジェクトの中のすべてのメディアのリソース(画像と音)を表示する。このプロジェクトの中でまだメディアのリソースを追加していないのて、でももすぐ添加する。 最もの右の部分はコンポーネントの属性(Properties)を表示する、プレビューのウィンドウの中であるコンポーネントをクリックすると、このコンポーネントの一連の属性に見れる。属性はコンポーネントの詳しい情報を記述する(例えば、Labelコンポーネントをクリックしてその色、文字の内容、フォントの属性を見ることができる)、属性値を修正することができる。今表示しているのはスクリーン(Screen1という)の属性で、背景の色、背景の画像と見出しなどが含まれる。 HelloPurrアプリの中で可視コンポーネント2つが必要(アプリの中で確か見えるコンポーネントと理解する):Labelコンポーネントは文字の“ペットの小猫”を表示して、Buttonコンポーネントの中に猫の画像がある;さらに1つの非可視コンポーネントSound(音)がまだ必要で、猫の叫び声のようだ音、再生するのに用いる;そして1つのAccelerometerSensor(加速度のセンサー)のコンポーネントがまだあって、デバイスの移動すると揺れるのを測定してに用いる。心配ご無用、1歩ずつこれらのコンポーネント教える。

ラベルを作る

最初のコンポーネントはLabel:

コンポーネントのパレット(Palette)に切り替え、Label(リストの中の5つ目)をクリックして、それをプレビューの窓口(Viewer)の中でドラッグする。プレビューの窓口の中で、1つの長方形の枠が現れる、枠中でTextforLabel1を書いている。 コンポーネントデザイナーの右側Properties(属性)の枠にはLabelの属性を一覧表示した。一覧中間のところが1つのText属性がある、隣にLabelの中で表示する文字である。文字を“ペットの小猫”に変えて、そしてリターン・キーを押す。プレビューのウィンドウの中で、文字も変えたのを見える。 BackgroundColor(背景色)の下の四角の枠をクリックしてLabelの背景色を変え、現在の属性値None(背景色がない)のため、表示する色のリストの中から青いを選んで、そしてLabelのTextColor(文字の色)の属性を黄色に変える。最後にFontSize(フォントサイズ)の属性を20に変える。 デザイナーの外観は図1―5に示す:

図1―5 アプリの中でLabel(ラベル)

Button(ボタン)コンポーネントを追加

HelloPurrアプリの中の猫はButtonコンポーネントを使って実現する:まず普通のButtonを作て、それからButtonの画像を猫に変更する。コンポーネントデザイナー(Designer)のコンポーネントのパネル(Patatte)の中でButton(リストの先頭)をクリックして、それをプレビューのウィンドウ(Viewer)の中で引っ張って、Label下に置きます。1つの長方形の押しボタンがプレビューのウィンドウの中で現れる。数秒後、ボタンはAndroidデバイス上で現れる。試しにデバイス上ボタンを軽くタッチすると、なにか反応があるか?何もない、Buttonに動作を出されてないためである。これはApp Inventorを理解の一つ目の要点:デザイナーの中のコンポーネントを添加して、ブロックエディターの中で必ず相応する処理を作り、コンポーネントようやくある種類の動作が発生する(デザイナーの中で1つのコンポーネントを添加してその後これをする)。 Buttonをクリックする時、猫の叫び声を出すことが望むが、buttonが小猫の形を望んでいる、普通な四角なものではない、そのためbuttonに画像を設置する:

まず、小猫の画像をダウンロードし、コンピュータ上で保存する。kitty.pngからkitty.pngの画像ファイルをダウンロードする(pngはjpg、gifと似ている標準の画像のフォーマットで、AppInventorの中で、これらはすべて有効なファイルタイプ、よく使われる標準の音声ファイル.mpgあるいは.mp3と同じ)、それからmeow.mp3から音声ファイルをダウンロードする(“名前を付けて保存”を選んで音声ファイルを保存する)。 プレビューのウィンドウの中でこのボタンをクリックして、属性の枠の中でその属性を表示する。中間部Image属性(今の表示がNone)をクリックして、“UploadFile…”ボタンがを表示される。 “UploadFile…”ボタンをクリックします、そしてウインドウの中“ファイルの選択”のボタンをクリックして、一覧から前にダウンロードしたkitty.pngファイルを選び,それからクリックして確定する。 数秒後、kitty.pngはButtonのImage属性のオプションと表示され、“OK”をクリックする。それと同時に、ketty.pngもデザイナーウィンドウのコンポーネントリストの下のMediaエリアの中に現れ。デバイスの中でも同じく猫の画像を表示する、この時ボタンも小猫に見える。 猫の画像の上で文字の“TextforButton1”を表示するのが気づいて、アプリ中でこれらを見れるは望まないので、Button1のText属性を“ペットの小猫”などの文字に変えて、あるいはすべての文字を削除する。 今のデザイナーは図1―6のように見える。

図1-6 アプリにLabelと画像として表示するButtonがある

鳴き声のサウンドの追加

アプリでは、ボタンをタップするとキティはニャーさせたい。このために、鳴き声のサウンドを追加し、ボタンがクリックされたときにサウンドを再生するようにボタンの動作をプログラムする必要がある:

お使いのコンピュータのデスクトップにmeow.mp3ファイルをダウンロードしていない場合は、このリンクを使用してください:http://appinventor.org/bookFiles/HelloPurr/meow.mp3; デザイナウィンドウの左側にあるパレットに移動して、メディアセクションを展開するためにメディアにマークヘッダーをクリックする。サウンドコンポーネントをドラッグし、ビューアに配置する。どこにドロップに関係なく、ビューアの下にある領域に表示され、「非可視コンポーネント」にマークされた。「非可視コンポーネント」がアプリのために働くが、ビジュアルユーザーインターフェイスには表示されないオブジェクトである; プロパティを表示には Sound1 をクリックする。Source プロパティをクリックし、以前手順と同じように、ダウンロードした meow.mp3 ファイルを選択してアップロードする。完了すると、kitty.png と meow.mp3 はデザイナーの [メディア] セクションにリストに表示される。 表1-1 HelloPurr中のコンポーネント コンポーネントタイプ パレットグループ コンポーネント名 目的 Button User Interface Button1 押すと子猫の鳴き声を作る Label User Interface Label1 「Pet the Kitty.」のテキストを表示 Sound Media Sound1 ニャーのサウンドを再生

ライブテスト

App Inventorを使うと、アプリ作成時 Android デバイスでアプリを表示しながらテストできる。インクリメンタルな方法でアプリをテストすることは、効果的なソフトウェア開発者が実践方法で、仕事の時間を節約する。

AndroidデバイスはWiFi通してインターネットに接続している場合は、数分でライブテストを設定することができ、コンピュータにソフトウェアをダウンロードする必要はない(携帯電話に一個アプリを入れるだけ)。Androidデバイスをお持ちでない場合は、エミュレータを使用するためにいくつかの追加のセットアップが必要、詳細はhttp://appinventor.mit.edu/explore/ai2/setup.htmlでカバーする。

あなたはAndroidデバイスを持っている場合は、次の手順を実行する:

お使いのデバイスは、Google Playストアから「MIT AI2コンパニオン」アプリをダウンロードしてインストールする。それからアプリを起動する。 コンピュータとデバイス両方を同じWiFiに接続する。 App Inventorのトップメニューから、図1-7に示すように、AI Companion を選択して接続する。 図1-8に示すように、デバイスでインストールしたアプリ、MIT AI2 Companionを起動する。 「スキャンQRコード」を選択し、デバイスを持って、コンピュータ画面上のQRコードをスキャンする。

図1-7 Connectをクリックして、Companion を選択する

図1-8 デバイスでMIT AI2 Companionを起動し、「Scan QR Code」をクリック

すべてがうまくいけば、お使いのデバイスで実行されている HelloPurr アプリが表示され、全て追加されたコンポーネントを含める。App Inventor デザイナーまたはブロック エディターで変更を行うと、それらの変更はデバイスにも同様に表示される。

ライブテストセットアップ:ライブ テストのセットアップに問題がある場合は、http://appinventor.mit.edu/explore/ai2/setup.html をご覧ください。 アプリがデバイスに表示する場合、とりあえずボタンをタップする。何かが起こると思うか?何もない。まだボタンに実行するこどを何も指示していないから。これは、App Inventor について理解する 最初の重要なポイント: デザイナーで追加するすべてのコンポーネントに、必ずブロック エディターに移動し、そのコンポーネントに何でもやってみたいことのコードを作成する必要がある。

コンポーネントに動作を追加

ボタン、ラベル、およびサウンド コンポーネントを最初アプリのビルディング ブロックとして追加しただけ。今、ボタンをタップすると子猫ニャーを 。ブロック エディターでこれを行います。トップに「ブロック」をクリックしてコンポーネント デザイナーの右ブロック エディター ウィンドウを見てください。これは、コンポーネントを指示する、何をしてそれを行う場合。ハローキティ] ボタンをクリックすると、ユーザーは、それをタップすると、サウンドを再生を指示するよ。コンポーネントは、レシピの食材、調理の指示としてブロックの考えることができます。

子猫ニャーさせる

ウィンドウの左上、ブロックヘッダーの下に、組み込みの引き出しやデザイナで作成した各コンポーネントの引き出しを含んで列が表示され、Button1、Label1、Screen1、およびSound1。引き出しをクリックすると、そのコンポーネントのオプション(ブロック)の束を見れる。 Button1の引き出しをクリックする。引き出しは開き、図1-9に示すように、上にButton1.Clickで始まる、ボタンの動作を構築するために使用できるブロックを示す。

図1-9 Button1をクリックしてコンポーネントのブロックを表示

ラベルにButton1.Clickと書いてるブロックをクリックし、ワークスペースにドラッグします。単語が「when」がButton1.Clickブロックに含まれていることに気づくでしょう。「when」が含むブロックはイベントハンドラと呼ぶ。いくつかの特定のイベントが発生したときにどれらのコンポーネントが何をすべきかを指定する。このケースでは、我々が興味を持っているのは、図1-10に示すように、アプリのユーザーは、キティの画像(実際にはボタン)をタップしたときに発生するイベント。次に、そのイベントに応答するために何が起こるかのプログラムするために、いくつかのブロックを追加する。

图1-10 Button.Clickブロックの中にユーザがクリックへの応答を指定

Sound1をクリックして、Soundコンポーネントの引き出しを開き、Sound1.Playというブロックをドラッグしてください。 (以前コンピュータにダウンロードした猫のなき声ファイルは、Sound1のプロパティに設定したことを覚えておいてください)この時点で、Sound1.Play ブロックの呼び出しはある形に作られ、Button1.Click ブロックで”do”とマークされて隙間に合うことができることに気づいたかもしれない。App Inventorは、特定のブロックのみが一緒に収まるように設定されている。この方法では、常に接続しようとするブロックが本当にうまくいくと分かっている。この場合、単語「call」ついてるブロックによりコンポーネントで物事を行う。図1-11に示すように、2つのブロックは、一つユニットの形になるようにピッタリ合わせ、繋ぐと同時にスナップ音が聞こえる。

図1-11 ボタンをクリックする、ニャー音が再生される

伝統的なプログラミング コード(これはしばしば無意味な言葉のごちゃ混ぜのように見える)と異なり、App Inventor のイベント応答ブロックは平易で理解しやすい方法で行動を綴る 。この場合、我々 はたた単に「ねえ、App Inventor、 誰かキティ ボタンをタップすると、ニャー音を出す」言っている。

テスト:すべてが正しく動作していることを確認しましょう—何か新しいものを追加するたびに、アプリをテストすることが重要である。デバイスのボタンをタップ (またはエミュレーターを使用している場合はそれをクリック) する。子猫ニャーを聞こえるはず。おめでとう、あなたの最初のアプリケーションを動いてる!。

ゴロゴロ声を出す

今度ボタンをタップするとキティがゴロゴロと鳴き声をするつもり。デバイスを振動させることによりゴロゴロをシミュレートする。それは難しいに聞こえるかもしれないが、ニャー音を再生するために使用されるサウンドコンポーネントは、同様に、デバイスを振動させることができるので、それを行うのは簡単。 App Inventorのはコアデバイスのこの種の機能を活用するのに役立ち、ご自分でデバイスが実際に振動する方法に対処する必要はない。デザイナーに何も異なることする必要はない。ブロックエディタでボタンのクリックに2つ目の関数呼び出しブロックを追加するだけ。

  1. ブロックエディタに移動し、SOUND1をクリックし、引き出しを開く。
  2. call Sound1.Vibrateを選び、Button1.Clickスロットにcall Sound1.Playブロックの下にドラッグする。図1-12に示すように、ブロックは、所定の場所にかチャットはめ込む必要があり、そうでない場合は、call Sound1.Vibrateの上端に小さなノッチがcall Sound1.Playの底に小さなバンプに接触するように、ドラッグしてみてください。

    図 1-12 Click イベントでサウンドの再生と振動
  3. Sound1.Vibrate ブロックが含まれているテキストの右下に「millisecs」、それとブロックエッジに内側へのオープンソケットに気づくかもしれない。ブロックで開かれたソケットは、動作について詳細を指定するために、何かをプラグインする必要があることを意味する。この場合、ブロックにどのくらいの時間の振動を伝える必要がある。今回は、1/1000 秒 (ミリ秒)で設定する必要があり、これは多くのプログラミング言語にかなり共通である。だから、デバイスを0.5 秒の振動するためには、500 ミリ秒の値を入力する必要がある。これを行うには、Mathブロックを取り入れる必要がある。Math引き出しをクリックし、図 1-13 に示すように、青ブロックのリストが表示される。

    図 1-13 Mathの引き出しを開く
  4. リストの上部には、「0」ブロックが表示され。このブロックをドラッグし、0 を任意の番号に変更できる。ひとまず、図 1-14 に示すように数字ブロックをドラッグする。

    図 1-14 数字のブロックを選択 (0 は既定値)
  5. [0] をクリックし、図 1-15 に示すように新しい値500を入力する。

    図 1-15 値を 500 に変更
  6. 図 1-16 に示すように、call Sound1.Vibrate の右側にあるソケットに 500 数ブロックを差し込み。

    図 1-16 millisecsソケットに値500を差し込み

アプリテスト:試してみてください!デバイス上のボタンをタップすると、あなたは0.5秒ゴロゴロを感じるでしょう。

デバイスを揺する

さて、Android のもう一つのクールな機能に触れる最後の要素を追加してみましょう: デバイスを振るときに子猫ニャーにする。これを行うには、デバイスを振るまたは動すときに感じることができる AccelerometerSensor と呼ばれるコンポーネントを使用する。

  1. デザイナーのパレットのコンポーネントの一覧で、センサー領域を拡張し、AccelerometerSensor をドラッグします。ドラッグ先は心配ご無用。何れ非可視コンポーネントと同様、ビューアーのどこでも置くことができる、ビューアーの下に「非表示のコンポーネント」セクションに移動される。
  2. ボタンのクリックとは別に、独立したイベントとしてデバイスを振動を扱いたいと思う。これは、新しいイベント ハンドラーを必要があることを意味する。ブロック エディターに切り替え。AccelerometerSensor1 の新しい引き出しがあるはず。それを開き、リストの 2 番目のブロック、AccelerometerSensor1.Shaking ブロックをドラッグする。
  3. 音とボタンのクリックでやったのと同じように、call Sound1.Playブロックをドラッグし、AccelerometerSensor1.Shakingのギャップにそれにくっ付ける。デバイスを振てみてください。 図 1-17 は、完成した HelloPurr アプリのブロックを示す。

図 1-17 HelloPurr のブロック

Android デバイスにアプリをダウンロード

App Inventorのライブテスト機能は、お使いのデバイスに接続しているときに簡単にアプリをテストすることができる。唯一の問題は、App Inventorからデバイスを切り離した場合は、デバイス上で実行中のアプリが停止され、それが本当にインストールされていないので、デバイス上のどこでもアプリを見つからない。App Inventor Companionアプリ内で実行されていました。

コンピュータに接続されていない場合でも、任意のデバイス上で動作するように、完成したアプリをダウンロードして、インストールすることができる。この準備するにはまずアプリのアイコンを設定し、後にデバイスにインストールするとき、アプリの一覧で区別ある画像で表示される。これを行うには、デザイナで画面コンポーネントを選択し、アイコンのプロパティをクリックすることで、アイコン(例えば、キティの絵)として画像をアップロードすることができる。

次に、Android マーケット以外のところからダウンロードするアプリをお使いのデバイスに許可を確認。ほとんどのAndroidデバイスでは、[設定]→[アプリケーション]に行くと「提供元不明」の横のボックスをチェック。

App Inventor に戻って、デザイナーでのビルドをクリックして、”Build App(provide QR code for .apk).”を選択、ウィンドウで「プログレスバー」が見え、このプロセスだいたい1分程度の時間が必要。完成したアプリの QR コードが表示されるときは、バーコード スキャナー アプリを使ってQR コードをスキャンし(たくさんのAndroid用QRコードスキャナアプリがあり、デバイスには入ってない場合、Playストアにからインストールする)、デバイスに読み取る。デバイスからGoogle アカウントのパスワードを入力するプロンプトが表示可能性があり 。パスワードを入力したら、デバイスへアプリのダウンロードを開始され、デバイスの通知エリアにダウンロード アイコンが表示される。通知画面へ切り替え、ダウンロードが完了するまでを待って、アプリをインストールすると選択する。

インストール終わったら、お使いのデバイスで使用できるアプリを見てみましょう、ただいた作ったアプリ、HelloPurr が表示される。他のアプリと同じように実行可能 (App Inventor Companion アプリではなく、新しいアプリ実行することを確かめてください)。今Companionを停止したり、コンピューターからデバイスを取り外すしでも、新しいパッケージ アプリはまだそこに残される。

パッケージ化されたアプリが App Inventor のプロジェクトから切り離されたことの意味を理解することが重要。前のように、AI Companionとデバイスを接続して、 App Inventor でプロジェクトをされに作業を進めることができる。しかし、今お使いのデバイスにインストールされているパッケージのアプリも変わらない。App Inventor でアプリにさらに変更を加えた場合は、結果をパッケージ化し、デバイスで新しいバージョンをダウンロードし、古いものを置き換える必要がある。

アプリを共有

アプリを共有する方法は二つある。実行可能なアプリ (.apk ファイル) を共有するには、[Build] をクリックして「App(save .apk to my computer)」を選択、これてコンピューターに .apk の拡張子を持つファイルが作成される。他のユーザーとこのファイルを共有するために、電子メールの添付ファイルとして送信する、彼らは自分のデバイス上のメール アプリで開ける。また Web上 のどこかに .apk ファイルをアップロードすることができる(例えば、Dropbox) 。ただAndroid マーケットからアプリをインストールするではないので、アプリをインストールする人々に、携帯電話のアプリケーションの設定では「提供元不明」を許可する必要があると、確かに伝えておくこと。

また、アプリのQRコードを作成することができます。人々はウェブ、あるいは実在のポスターからそれを自分のデバイスにスキャンできる。URLからQRコードを生成する多数のツールがある(例えば、qrcode.kaywa.comをチェックしてください)。QRコードをカットし、Webページやドキュメントにペーストして、印刷や投稿などができる。

また、別のApp Inventorの開発者とアプリのソースコード(ブロック)を共有することができる。これを行うには、[Project]→[My Projects]をクリックして、共有したいアプリ(このケースはHelloPurr)をチェックし、[project]→[Export selected project]を選択します。お使いのコンピュータ上で.aia拡張子を持つファイルは作成しされることになる。誰かにこのファイルを電子メールで送信することができ、そして、彼らは、App Inventorを開き、[Project]→[Import Project]を選択し、.aiaファイルを選択することができる。これにより、ユーザにアプリの完全なコピーを提供し、あなたのバージョンに影響を与えずに編集してカスタマイズすることができる。

App Inventor はもすぐ独自のアプリのギャラリー(gallery.appinventor.mit.edu) を所有し、アプリを共有のみならず、、世界中の開発者からアプリをリミックスすることもできる。

バリエーション

この本でアプリを作成した後は、もしかしてそれらを改善する方法の考えるでしょう。各章の終わりには、お試しためのカスタマイズのアイデアを提案する。アプリをカスタマイズすることにより、利用可能なコンポーネントと、ブロックを探索して、チュートリアルで提供される詳細な指示なしに、進て自分でプログラムすることを学ぶ。

次はいくつかHelloPurrで試す事:

  • デバイスを振ること、猫の鳴き声があたかも響いて、奇妙な音する。加速度センサーは、個々の上下移動に応じて揺れイベントを何度もトリガされるので、meowsが重複しているためである。デザイナーでSound componentを見ると、Minimum Intervalと呼ばれるプロパティがあり。このプロパティは、一連開始する音が、最小の間隔決定する。今現在半秒より少なめ (400 ミリ秒) 、単一のニャーの期間よりも短く設定されている。Minimum Intervalを調整することによって、猫の鳴き声が重なる具合を変更できる。
  • パッケージ化されたアプリを実行し、ポケットにデバイス入れて歩く場合は、デバイスは急に移動するたびにニャーするから、恥ずかしい目にあうかもしれない。 Androidアプリは、通常見ていなくても実行し続けるように設計されている。アプリは加速度計と通信し鳴き声続けいく。本当にアプリを終了するなら、HelloPurr画面を開いた状態で、デバイスのメニューボタンを押して。アプリを停止するオプションが提供され。これを選択して、アプリを完全に閉じる。

サマリー

この章で説明した概念は次のとおり:

  • アプリをビルドするには、デザイナーでコンポーネントを選択して、ブロック エディターでコンポーネントに何をするか、いつするかを設定する。
  • いくつかのコンポーネントが有形、いくつか無形である。有形コンポーネントは、アプリのユーザー インターフェイスに表示され、無形コンポーネントはサウンドを再生するようなことを行うもの。
  • コンポーネントの動作を定義するには、ブロック エディターでブロックを組み立てする。Button1.Click などのイベント ハンドラーを最初にドラッグして、その中で Sound.Play のようなコマンド ブロックを配置する。Button1.Click 内のすべてのブロックは、ユーザーはボタンをタップしたときに実行される。
  • いくつかのコマンドでは、動作させるために余分な情報を必要がある。例としては、バイブレーションの振動する時間をミリ秒単位を知る必要がある。これらの値は、引数またはパラメーターと呼ばれる。
  • 数字はnumber blocksとして表され、これらの数値を引数としてコマンドにくっつけられる。
  • App Inventor にはセンサー コンポーネントがあり、AccelerometerSensor は、デバイスを移動または揺れを検出できる。
  • アプリをビルドとパッケージして、携帯電話にダウンロードできる。そうするとApp Inventor なくでも単独実行できる。

Leave a Reply

Your email address will not be published. Required fields are marked *

Skip to toolbar