はじめに
今回はサンプルアプリケーションの画面レイアウトを作成していきます。本稿の作業を行った状態のプロジェクトをサンプルソースとして用意したので、迷った場合は参考にしてください。
対象読者
本連載はJavaおよびEclipseの基本を理解している方を対象としています。
前回の記事
事前準備
まずは、今回使用するイメージファイルを準備しましょう。イメージファイルは、「drawable-***」フォルダに置くことで解像度ごとに別のファイルを使用することもできますが、今回は同じイメージファイルを使用します。イメージファイルをダウンロードしたら、解凍し、中にある「drawable」フォルダを「res」フォルダの直下に配置してください。
一覧画面のレイアウト作成
それでは、一覧画面のレイアウトから作成していきましょう。
一覧表示には、ListViewという部品を利用します。「res/layout/main.xml」を開き、次のようにTextViewをListViewに変更します。
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent"> <!-- 一覧表示用リスト --> <ListView android:id="@+id/list" android:layout_width="fill_parent" android:layout_height="fill_parent" /> </LinearLayout>
ListViewで指定している属性は下記の意味を持ちます。
属性 | 意味 |
---|---|
android:id | プログラムからビューを参照するためのID |
layout_width | ビューの幅。fill_parentで親いっぱいに広がる |
layout_height | ビューの高さ。fill_parentで親いっぱいに広がる |
ここで使用した以外にも、ビューはさまざまな属性を指定することが可能です。属性の詳細については下記を参照ください。
- Class Indexリファレンス:Android Developers
- Android Wiki
この状態で実行すると、タイトルだけの空の画面が表示されます。なお、「Virtual Device」の設定していない場合は、第1回を参考にして、設定してください。
もしも、うまく実行できないようであればEclipseの「Console」ビューおよび、「LogCat」ビュー([Window]-[Show View]-[Other]-[Android]-[LogCat]で表示)で原因を特定してください。
この状態ではレイアウトが正しくできているのか確認できないので、ListViewにアイテムを設定してみましょう。ListActivityを開いて次のように書き換えてください。
/** * 一覧表示アクティビティ */ public class ListActivity extends Activity { // 一覧表示用ListView private ListView listView = null; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // 自動生成されたR.javaの定数を指定してXMLからレイアウトを生成 setContentView(R.layout.main); // XMLで定義したandroid:idの値を指定してListViewを取得します。 listView = (ListView) findViewById(R.id.list); // ListViewに表示する要素を保持するアダプタを生成します。 ArrayAdapter<String> arrayAdapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1); // 要素を追加 arrayAdapter.add("新規追加"); // アダプタを設定 listView.setAdapter(arrayAdapter); } }
この状態で再度実行すると、ListViewに「新規追加」という要素が表示され、レイアウトが正しくできていることが確認できます。