AI2でHello World

 18th October 2021 at 11:06pm

App Inventor 2において入門のチュートリアルは「Hello Codi!」になりますが、そこそこ複雑な設定を行います。

ということで、さらに簡単な「Hello World」をやってみます。具体的な内容としては、ボタンを押したらダイアログが表示されるというプログラムです。

画面の説明

まず画面の説明。以下の2画面を切り替えながらプログラミングします。

デザイナー(Designer)
・GUI用コンポーネントを配置したり(Visible components)、カメラ・ファイル入出力などのGUIに関連しないコンポーネント(Non-visible components)を追加する画面です。
・一番右のプロパティーで詳細なパラメータを設定します。
ブロック エディター(Blocks)
・デザイナーで配置したコンポーネントの振舞いを設定する画面です。

プログラムを作ってみます

ポイントは、メッセージを表示するために Notifierコンポーネントを使うことです。Notifierコンポーネントは、メッセージダイアログを表示したり、Androidログエントリを作成したりできます。

大まかな手順としては、

  1. デザイナーで、ボタンの配置をします。
  2. デザイナーで、Notifierを追加します。
  3. ブロックス エディターで、ボタンが押された時にダイアログが表示されるようにします。

詳細は動画でご覧ください。凡ミスで「Hello World」を表示するつもりが「OK」を表示してしまっています。。。

こちらにプロジェクトやapkファイルをおいておきます。参考にしてください。

終わったら、「Hello Codi!」や「Hello Purr」も試してみると良いと思います。


HomeへApp Inventorの記事Topへ