ユーザーID パスワード

技術情報

  • FAQ よくある質問
  • 個人ユーザー向けサービスのお手続きについて
  • M2Mソリューション
  • (PR)FAQを利用してお問い合わせコスト削減

コード&コラム

第4回
通信するアプリを作ってみよう(後編)


前へ 1 |2 |3 |4 次へ

Step2 ListViewによる記事の表示

これまではプログラムのインターフェースにTextViewを使用してきました。

今回のプログラムでは複数の要素を扱うのに適したListViewを使用します。ListViewは多くのアプリケーションで用いられるインターフェースでGmailクライアントなどにも使われます。

プログラムの流れはレイアウトを作成し、ListViewとデータを関連付けるといった物になります。
それでは始めにレイアウトの作成を行いましょう。res/layout/main.xmlの内容を以下のように変更してください。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <ListView android:id="@+id/ListView01" android:layout_width="wrap_content"
                android:layout_height="wrap_content"></ListView>
</LinearLayout>

次にListViewの各行のレイアウトを作成します。res/layout/rowitem.xmlとして以下のファイルを作成してください。

<?xml version="1.0" encoding="utf-8"?>
<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_width="wrap_content" android:layout_height="32dip" android:gravity="center_vertical"/>

今回からは表示内容に直接メンバ変数を使います。
今までhttpGetで行っていた処理を戻り値のないgetArticleで行うようにしましょう。
getArticleが正しく実行されればメンバ変数であるmArticleTitleに記事のタイトルが格納されます。

        public static voidgetArticle(String strURL) {
                try {
                        URL url = new URL(strURL);
                        URLConnection connection = url.openConnection();
                        connection.setDoInput(true);
                        InputStream stream = connection.getInputStream();

                        readXML(stream);

                        stream.close();
                } catch (Exception e) {
                        e.printStackTrace();
                }
        }

最後に、onCreateにListViewオブジェクトの取得と ArrayAdapterによるデータの関連付けを行う処理を記述します。

        protected void onCreate(Bundle savedInstanceState){
                super.onCreate(savedInstanceState);
                setContentView(R.layout.main);
                // (1) 記事のタイトルの取得
                getArticle(createURL());

                // (2) ListViewのオブジェクトの取得
                ListView list = (ListView) findViewById(R.id.ListView01);
                // (3) アダプタの割り当て
                list.setAdapter( new ArrayAdapter<String>(this, R.layout.rowitem,
                                mArticleTitle));
        }

(1) 記事のタイトルの取得
    作成したメソッドを実行してmArticleTitleに記事のタイトルを格納します

(2) ListViewのオブジェクトの取得
    TextViewと同様にmain.xmlで設定したListViewのオブジェクトを取得します

(3) アダプタの割り当て
     ArrayAdapterクラスの第2引数には作成したレイアウトを,第3引数には表示内容となるStrnig配列をそれぞれ指定します

プログラムの実行結果は以下のようになります。 取得したタイトルの一覧が綺麗に表示できたと思います。だいぶアプリケーションらしくなってきたでしょうか。

次のステップでは、XML解析で得られる他の要素を使ってさらに発展させて行きましょう。


img

第4回 通信するアプリを作ってみよう(後編)
 Step1 XML解析
 Step2 ListViewによる記事の表示
 Step3 ボタンの配置とブラウザ呼び出し

サンプルコード

第1回 リファレンスコード(文字列編)

第2回 リファレンスコード2(グラフィックス編)

第3回 リファレンスコード3(タッチイベント編)

第4回 リファレンスコード4(チェックボックス/ラジオグループ編)

第5回 リファレンスコード5(スピナー編)

第6回 リファレンスコード6(サウンド/ムービー編)

第7回 リファレンスコード7(トースト編)

第8回 リファレンスコード8(Google Maps API利用編)

第9回 リファレンスコード9(SQLite編)

第10回 リファレンスコード10(音声認識編)

第11回 リファレンスコード11(日付/時刻ダイアログ編)

第12回 リファレンスコード12(Bluetooth編)