Androidアプリを見よう見まねで作ってみるブログ
Amebaでブログを始めよう!

Google Map API

思い出したようにメモ。

Google Map APIを使用できるようになるまでの手順です。

■1. キーストアのフィンガープリントを生成する
APIキーを発行するためには、キーストアのフィンガープリントが必要。keytoolコマンドを使って、デバッグ用キーストアのフィンガープリントを生成します。
下記は自分の環境におけるコマンド例。
cd D:\Program Files\Java\jdk1.6.0_21\bin

keytool -list -keystore "C:\Documents and
Settings\{ユーザ名}\.android\debug.keystore"

上記コマンドを実行すると、「キーストアのパスワードを入力してください:」と表示されます。何も入力せずそのままEnter!
「完全性を検証するには~~」うんぬんの警告が出てくるけど、ここでは必要ないので無視。表示されたフィンガープリント(16進数とコロンで表記)が求めるもの。これで準備はOK。

■2. APIキーを発行する

フィンガープリントが生成できたら、APIキーの登録ページへ。
http://code.google.com/intl/ja/android/add-ons/google-apis/maps-api-signup.html

規約を読んで、同意のチェックボックスを入れて、先ほどのフィンガープリントを入力して「Generate API Key」ボタンを押せば完了。
キーストアに対応するAPIキーと、それを使ったXMLレイアウトの例が表示されます。


ひとつ、Eclipseでの開発時の注意点を。

Google APIを使ったアプリを起動する際には、AVDのビルドターゲットとして "Google APIs" を選択する必要があります。
当然起動する際に指定するAVDも、ターゲットが "Google APIs" であるものを選択します。

詳しくは地図APIの解説ページを参照。
http://code.google.com/intl/ja/android/add-ons/google-apis/maps-overview.html

サンプルアプリを動かしてみる

今日のTIPS


本題に入る前に、今日のTIPSを2つ。

■エミュレータを立ち上げておく
エミュレータを立ち上げていない状態でプロジェクトを起動しようとすると、勝手にデフォルトの設定でエミュレータを立ち上げてしまう。
勝手に立ち上げられるとウィンドウサイズとかが指定できないので不便。

先にエミュレータを立ち上げておくには、「ウィンドウ」→「Android SDK および AVD マネージャー」から起動したいエミュレータを指定して「開始」ボタンをクリックする。もちろん起動したいプロジェクトに対応したエミュレータを指定すること。

■エミュレータのボタンをキーボードで操作
BACKボタンとかはエミュレータ画面上をクリックすることで実行できるけど、いちいちクリックするのは面倒。でもちゃんとキーボードショートカットが用意してあるので問題なし。

主要なショートカットはこちら。
Emulated Device KeyKeyboard Key
HomeHOME
Menu (left softkey)F2 or Page-up button
BackESC
Power buttonF7

詳しくはAndroid Developersのこちらを参照。
http://developer.android.com/intl/ja/guide/developing/tools/emulator.html#controlling


名刺管理アプリを作る


というわけで今日の本題。こちら↓のページのサンプルアプリを作ります。
http://codezine.jp/article/detail/4670

画面を一つ作るごとに、以下のファイルを作成・修正する。
○アクティビティ(画面ごとに作成)
 ・場所:src
 メインのJavaファイル。処理とかは原則ここに書く。MVCのModelのイメージでよいのかな?
 
○レイアウト設定用XML(画面ごとに作成)
 ・場所:res/layout
 レイアウトをXMLで記述する。まさにMVCのView。
 今回作っただけでも「LinearLayout」「TableLayout」「FrameLayout」の3種類でデザインを設定できて、自由度のあるデザインができそう。

○strings.xml(全体で一つ)
 ・場所:res/values
 項目名の外出し用XML。多言語対応とかするためには外出しのほうが便利。同じ名称を複数箇所で使い分けるとかにも使えそうです。

○AndroidManifest.xml(全体で一つ)
 ・場所:プロジェクト直下
 作った画面はすべて、この中でインテント等を指定しておく。
 その他にユーザパーミッション指定、ライブラリ使用宣言などプロジェクト全体に関する設定をする感じ。

 ここで「LAUNCHER」に指定したアクティビティがアプリケーション起動時に実行される。
 あと「MAIN」に指定しておくと、Eclipseの「実行」→「実行構成」内の「Launch Action」で、アクティビティを指定して起動させることもできる。


今回は4画面作成した。作成・修正したのは以下のファイル。
○アクティビティ
 ・ListActivity.java(一覧画面)
 ・RegistActivity.java(登録画面)
 ・ShowActivity.java(参照画面)
 ・MapActivity.java(マップ画面)
○レイアウトXML
 ・main.xml(一覧画面)
 ・regist.xml(登録画面)
 ・show.xml(参照画面)
 ・map.xml(マップ画面)
○strings.xml
○AndroidManifest.xml


そんなこんなでサンプル通りに作ってみたのが下のスクリーンショット。
アクションを指定していないので当然何も動きませんが、文字入力とかボタンクリックとかは普通にできるので「それっぽい」見栄えになりました。いい感じ。

一覧(メニュー)画面。
一覧(メニュー)画面

登録画面。
登録画面

参照画面。
参照画面

マップ画面。
マップ画面


ちゃんと動くようになるにはまだまだ道のりは遠い。

tableタグをなんとかしたい

アメブロでのtableタグのデザインをなんとかしたい。

tableの上の文章。

Emulated Device KeyKeyboard Key
HomeHOME
Menu (left softkey)F2 or Page-up button
BackESC
Power buttonF7

tableの下の文章。

わかった、tableタグを整形するための改行がBRに変換されちゃってるんだ。全部1行に書かないとダメなのか。これはめんどい。

開発環境の日本語化&スキンのXperia化

なんだかんだで間が空いてしまったけど、続きます。気の向く限り。

引き続き、こちらの記事を参考に。
http://itpro.nikkeibp.co.jp/article/COLUMN/20091008/338599/


▼開発環境の日本語化
とってもカンタン。「Pleiades」というプラグインを入れればOK。
http://mergedoc.sourceforge.jp/

最新版の1.3.3をダウンロード、あとはReadmeを読みつつインストール完了。インストール後はEclipseのクリーン起動を忘れずに。(起動オプションに「-clean」追加)


▼AVDスキンのXperia化
ITProの記事中では「初めてAndroid SDKを利用する場合は,上述のプロジェクトを作成した後にAVDの作成画面が表示される」とあったけど、自分の環境ではアプリケーションを実行させるまで作成画面が出てこなかった。
アプリケーションの実行は、メニューバーの「実行」→「実行」、開いたウィンドウ内で「Androidアプリケーション」を選択。

※以下、メニュー名とかは日本語化後の名称で表示。

XperiaのAVDスキンは以下のブログ記事を参考にインストールしました。ありがとうございます。
http://www.techmaru.net/wordpress/20100508/x10skin/

Android 2.1に対応させたいので、前もってXperiaスキンフォルダ内「manifest.ini」の「api=4」を「api=7」を変更しておきます。
エミュレータのサイズは、「Screen Size」→6、「Monitor dpi」→96、がうちの環境だとぴったりでした。


で、とりあえず動かしてみたHelloWorldがこちら。
$Androidアプリを見よう見まねで作ってみるブログ-HelloWorld

今日のところはこれで時間切れ。また次回。

Android開発環境を作る

さっそく開発環境の構築開始。参考にしたのはココ↓。
http://itpro.nikkeibp.co.jp/article/COLUMN/20091008/338599/

とはいえ、公式ページ見たほうが早いかもね。英語だけど。
http://developer.android.com/intl/ja/sdk/index.html
パッケージも入れられるものは一通り入れてみた。

Java SDKはココから。
http://www.oracle.com/technetwork/java/javase/downloads/index.html

ついに自分のPCにEclipseを入れる時が来たか…。「Eclipse IDE for Java EE Developers」をダウンロード。で、でかい。
http://www.eclipse.org/downloads/

で、Eclipse上から「Help」→「Install New Software」を選択、「Work with」に「https://dl-ssl.google.com/android/eclipse/」を指定してやればあとは流れに身を任せるだけ。

さあ、準備は整った。

Androidアプリ始めました

なんでPython続けないのかって? だってXperia買っちゃったんだもんよ!

というわけで、Androidアプリを作りたいなーと思ったので作ります。
参考リンクをメモメモ。

Androidで広がる、携帯アプリ開発の世界 (ITPro)
http://itpro.nikkeibp.co.jp/article/COLUMN/20090708/333496/?ST=android-dev

Androidで動く携帯Javaアプリ作成入門 (@IT)
http://www.atmarkit.co.jp/fjava/index/index_android.html

世界を目指せ!Androidアプリ開発入門 (gihyo.jp)
http://gihyo.jp/dev/serial/01/androidapp/0001

インタラクティブシェルでちょっとしたコードを動かす

今さらながら、Pythonのインタラクティブシェル。

Windowsで標準インストールしていれば、スタートメニュー中のPythonフォルダに「IDLE (Python GUI)」とか「Python (command line)」っていうショートカットがあるはずなので、そこから起動。
いろいろ補助してくれるIDLEがオススメだけど、IDLEが重すぎる環境だったりとか「俺は余分なものはいらねえ!」な人とかは標準でやればいいと思います。

こちらがIDLE。
App EngineでPythonを覚えるブログ-cap_IDLE

こちらが標準のシェル。コマンドプロンプト風。
App EngineでPythonを覚えるブログ-cap_CMD

ローカルの管理コンソール

http://code.google.com/intl/ja/appengine/docs/theadminconsole.html
アップロードしたアプリケーションには上記のように管理コンソールが使えるけど、デモアプリとかのローカルアプリケーションには管理コンソールは使えるのか?

結論から言うと、あった。アプリケーションを起動させて以下のURLへ。

http://localhost:8080/_ah/admin/datastore

DBの中身を表示したり、コンソールから直接プログラムを起動させたり。GQLのテストとかもできそうな予感。

初回実行時に真っ白になる件

なぜか初回実行時に画面が真っ白になる件。Content-lengthが0になってるぽい。
で、どうやら一番下に「if __name__ == "__main__":」って条件でメイン処理を呼び出してあげるのがお作法らしい。

helloworld.py
import wsgiref.handlers
from google.appengine.ext import webapp

class MainPage(webapp.RequestHandler):
def get(self):
self.response.headers['Content-Type'] = 'text/plain'
self.response.out.write('Hello, World!')

def main():
application = webapp.WSGIApplication(
[('/', MainPage)],
debug=True)
wsgiref.handlers.CGIHandler().run(application)

if __name__ == "__main__":
main()

上記のようにしたら、初回実行時でもちゃんと表示されるようになった。

簡単なアプリケーションを作ってみる

↓を参考に、簡単なアプリケーション(Hello World)を作ってみる。
http://gihyo.jp/dev/serial/01/gae/0001

インストールディレクトリ直下に「myapp」ディレクトリを作成し、そこに2つのファイルを作成する。
・helloworld.py
・app.yaml

helloworld.py
import wsgiref.handlers
from google.appengine.ext import webapp

class MainPage(webapp.RequestHandler):
def get(self):
self.response.headers['Content-Type'] = 'text/plain'
self.response.out.write('Hello, World!')

def main():
application = webapp.WSGIApplication(
[('/', MainPage)],
debug=True)
wsgiref.handlers.CGIHandler().run(application)

app.yaml
application: myapp
version: 1
runtime: python
api_version: 1

handlers:
- url: /.*
script: helloworld.py

で、コマンドプロンプトから「dev_appserver.py myapp」を実行して、「http://localhost:8080/」をブラウザで表示。
$App EngineでPythonを覚えるブログ-myapp

最初は画面真っ白…だったけど、何回かリロードしてたらいつの間にかちゃんと表示されるようになった。謎。
どうやら編集して最初の表示時はコンパイルか何かが走っているっぽい?