Download
1 / 37
370 likes | 535 Views
アンドロイドの GUI 作成なんて怖くない！. In 第 5 回勉強会＠徳島 / オープンフォース Android 勉強会 201007 at 2010/07/15(sut) 夜子まま. 自己紹介. ハンドルネーム 夜子まま Android 暦 4 ヶ月 マーケット登録 5 個 Java 暦 10 年ちょい 主にオープン系 JWS を３年ほど. 目次. 前説 レイアウトの説明 よく使うレイアウトを三つほど 配置で使えるテクニックの紹介 クラスの作成 Activity の説明 ライフサイクル ListView の説明 あと何か. 前置き.
E N D
アンドロイドのGUI作成なんて怖くない！ In 第5回勉強会＠徳島/オープンフォースAndroid勉強会 201007 at 2010/07/15(sut) 夜子まま
自己紹介 ハンドルネーム 夜子まま Android暦 4ヶ月 マーケット登録 5個 Java暦10年ちょい 主にオープン系 JWSを３年ほど
目次 • 前説 • レイアウトの説明よく使うレイアウトを三つほど配置で使えるテクニックの紹介 • クラスの作成Activityの説明ライフサイクル • ListViewの説明 • あと何か
前置き 癖のあるGUI作成 Swing Eclipse HTML
説明開始 では早速 いってみましょう
画面を作る流れ １ レイアウトファイルを作成する ２ Activityを継承したクラスを作成する ３ 作ったクラスをAndroidManifest.xmlに定義する
アプリを構成するファイルたち assets layout values src R drawable マニフェスト apk gen
まずは画面デザインから • Button ・・・ ボタン • CheckBox ・・・ チェックボックス • EditText ・・・ 編集ボックス • RadioButton ・・・ ラジオボタン • ImageButton ・・・ イメージボタン • Spinner ・・・ すぴなー • Seekbar ・・・ シークバー • ZoomControls ・・・ ズームコントロール
レイアウトをマスターしなきゃ始まらない • LinerLayout ・・・ 連続して並べる配置 • TableLayout ・・・ 行・列揃えした配置 • FrameLayout ・・・ 重ねた配置 • RelativeLayout ・・・ 相関した配置 • AbsoluteLayout ・・・ 絶対座標の配置 dip (デバイスに依存しないピクセル) sp (拡大縮小されたピクセル、テキストサイズに最適)
よく使うレイアウト（LinerLayout) <LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="hello" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="hello" /> </LinearLayout>
よく使うレイアウト（ TableLayout) <TableLayout android:layout_width="wrap_content" android:layout_height="wrap_content"> <TableRow> <TableRow> <EditText android:text="test" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </TableRow> </TableLayout>
よく使うレイアウト（ FrameLayout) <FrameLayout android:id="@+id/FrameLayout01" android:layout_width="wrap_content" android:layout_height="wrap_content"> <ImageView android:src="@drawable/penguins" android:scaleType="fitStart" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:text="あいうえお" android:layout_marginTop="10dip" android:textSize="40sp" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </FrameLayout>
レイアウト配置テクニック１ Top Left Right gravityをつかって位置合わせ center_horizontal <LinearLayout android:orientation="horizontal" android:gravity="center_horizontal" android:layout_width="fill_parent " android:layout_height=“fill_parent”> <Button android:text="ボタン" android:layout_gravity="right" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> center_vertical fill Bottom android:layout_gravity と android:gravity の使い分け
レイアウト配置テクニック２ Weightをつかって均等貼り付け <Button android:text="test1" android:layout_weight="1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <Button android:text="test2" android:layout_weight="1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <Button android:text="test3" android:layout_weight="1" android:layout_width="wrap_content" android:layout_height="wrap_content" />
レイアウト配置テクニック３ スペーサーを使う <LinearLayout android:layout_weight="1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <Button android:text="test1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <LinearLayout android:layout_weight="1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <Button android:text="test3" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <LinearLayout android:layout_weight="1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> 次はListView
レイアウトを作ったら？ • Activity ・・・ 画面の基本 • PreferenceActivity ・・・ 設定画面 • TabActivity ・・・ タブ画面 • ListActivity ・・・ リスト画面 • Etc ・・・
Activityのライフサイクル onSaveInstanceState 開始 実行中 Backボタンや他のActivityが表示される onCreate onPause 長時間表示されない onStart onStop onResume onRestoreInstanceState onDestory 回転すると一旦Destoryされる onRestart Homeはstopまで 終了
処理を実装しよう • OnCreateで初期化処理 • OnResumeで設定処理 • Buttonイベントで処理を実装 @Override publicvoid onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.people_list); srchText = (EditText) this.findViewById(R.id.srchText); srchText.setOnLongClickListener(newOnLongClickListener() { @Override publicboolean onLongClick(View v) { srchText.setText(""); returnfalse; }}); }
ListViewを制するものAndoridを制す ListViewはほとんどのアプリで利用します、 だけど難しいんだよね。
ListViewを構成するクラス • ListView • AdapterBaseAdapter ・・・ アダプターの抽象クラスCursorAdapter ・・・ CursorをもつアダプターArrayAdapter ・・・ 任意のリストのアダプターSimpleAdapter ・・・ 基本的なアダプター • BinderSimpleAdapter等の拡張
ListViewのカスタマイズ AdapterのgetViewで表示するViewを生成する。 LayoutInflater layoutInflater = (LayoutInflater) context .getSystemService(Context.LAYOUT_INFLATER_SERVICE); からの public View getView(int position, View view, ViewGroup parent) { Peopleinfo inf = this.getItem(position); if (view == null) { view = layoutInflater.inflate(R.layout.fortune_row, null); ｝ CursorViewの場合はこっち @Override public View newView(Context context, Cursor cursor, ViewGroup parent) { returnnull; }
ListViewの動作 Adapter getView
ListViewでコレを使いこなせ public voidsetTag(Objecttag) public voidsetTag(int key,Objecttag) publicObjectgetTag() publicObjectgetTag(int key) ListView Event処理
ListViewの前後につけるもの • HeaderViewとFooterView 使い道？ もっと読む や、 読み込み中 等 LayoutInflater layoutInflater = (LayoutInflater) context .getSystemService(Context.LAYOUT_INFLATER_SERVICE); からの view = layoutInflater.inflate(R.layout.fortune_row, null);
時間確認 時間は？
時間確認 まだある
総合演習 最後にまとめとしてアプリを作りたいと思います
総合演習 今日のためにとっておきのアプリを準備しました
総合演習 その名も！
総合演習 告白スイッチ！！
アプリをつくっちゃお １ 誰でも告白できる ２ まさかのときでも ３ だから安心 ４ とにかく迷わない
アプリをつくっちゃお それでは作りましょう まずは画面デザインから
アプリをつくっちゃお main.xml
アプリをつくっちゃお KokuhakuAct.java
アプリをつくっちゃお AndroidManifest.xml
質問があれば 質問受付中
