Google App Inventor を使ってみた


何週間前かもう覚えてませんが、とりあえず申請していたのがやっと通ったようで。
ってことで、AppInventor触ってみました。

http://appinventor.googlelabs.com/learn/

初めに

とりあえず動画は見ていたのでブラウザでいじれるんだろうって思ったら、
どうもアプリもインスコしないといけないらしい。
(別にアクセス許可が下りる前からインスコまではできるらしい)

I downloaded the App Inventor Extras Installer and ran it. Can I start using App Inventor right now?

No, App Inventor is a Web application that runs in a browser. 
You'll need to have access to the system before you can run it. 
Installing the App Inventor Extras software and setting up the phone is necessary preparation for using the system,
but this doesn't in itself provide access to App Inventor.

設定して立ち上げてみる

インスコ完了したら、今度はAndroid側の設定っておもったけど、
ざっとみると1.6のXperiaちゃんの名前はない(当たり前か。。w)
とりあえずUSBつなぐ以外特にandroid側でやることはないようなので
XperiaをUSB接続させた状態で立ち上げてみることに。
Appinventor自体はブラウザから立ち上げるので、
ページにアクセスするだけです。
(インストールしたのはたぶん実機テスト関係のアプリっぽいです)

アプリを作ってみる

プロジェクト作成
とりあえずappinventorのページにアクセスすると
シンプルにメニューバーだけが表示されてるので、プロジェクトを作成してみる。

適当にアプリのビューを作る
作るとこんなかんじの画面になるので、適当に直感で左のメニューから
ドラッグ&ドロップで動かしてみるとなんか入った!

入れたボタンのテキストとかのプロパティは全部右側で操作できます。
なおブラウザなので、ここでは日本語がちゃんと入りますので、
ボタンに日本語で名前を付けれます。
(後述のBlockEditorでは日本語が化けます)

Block Editorでロジックの操作
ただ、これだとクリックしたときの動作とかを設定する画面がないなー
とチュートリアルを見たら、上部にあるBlock Editorをクリックせよ
と書いてあるので押してみる。
(またアプリダウンロード)

ちょっとするとこんな画面が別ウィンドウで立ちあがる。

おーこれこれ。動画で出てたやつが立ち上がりました。
どうもすみ分け的に、ブラウザ側でViewのレイヤーを操作して、
ロジック的なことはBlockEditorでやる模様。

とりあえず適当にアプリのイニシャライズ時の設定とかしてみました。

が、titleに日本語ぶち込もうとしたら入らない。。設定がおかしいのかな?
とりあえず文字化けしちゃうので、今回はローマ字でw

実機テスト
ここまで出来たら、あとはエミュレータでもなんでも確認してみたいわけですが、
チュートリアルには上のバーにある 「restart phone app」をクリックするように書いてあるので、
とりあえずポチっとすると。。

10秒くらいでUSB接続したXperiaちゃんから画面が!!

しかもこれ、リアルタイムなかんじで、ブラウザ側でアイテムを追加すると
そのままXperiaの画面でも反映されます。なにこれすごい。

パブリッシュ
最後パブリッシュですが、これはブラウザ側でやるっぽいです。
ブラウザ側の右上にパッケージ化みたいなボタンがあるので
押してみたらapkファイルにまとめてダウンロードしてくれました。

まとめ

Eclipseより早い。。。
はっきりいってほぼマウス操作でできるので、
プログラムを少しでも組んだことがあれば(if とかあそこらへんの概念がわかれば)
アプリ作ることができちゃいます。これ。
ただ、blockEditorのほうが日本語対応してくれないと、色々ときついかなーとは思います。


Leave a Reply