ぱんぶろ

パンジーの「いいね!」ブログ

[Androidアプリ開発]2chまとめアプリ作成への道④~ITproのソースをちょっとイジる(レイアウト編)~

      2016/03/30  

2chmatome

前回は、自作のRSSフィードをITproのアプリ上で流せるようにしました。
(⇒ITproのアプリに自作RSSフィードを流す

これでもいいんですけど、若干見栄えが悪いんですね。
なので今回は、その見栄えを整えていきます。
(他の2chまとめアプリのような見栄えにします。)

スポンサード リンク

ITproのソースをちょっとイジる(レイアウト編)

レイアウトを変更します。

今現在のレイアウトは、こんな感じです。
記事タイトルと記事概要が縦に並べ、それぞれ左寄せになっています。
2chmatome18

今回は、これを次のように変更します。

記事タイトルとサイト名、更新日付を縦に並べ、
記事タイトルは左寄せ、サイト名と更新日付は右寄せにします。
2chmatome19

「item_row.xml」をイジる

第一回目(⇒ITproのRSSリーダーを真似る)で作成した「item_row.xml」を修正します。

このファイルは、リストで表示される一つ一つの項目のレイアウトを設計しているものです。
下記を参考に、現状のレイアウトから変更してください。

【現状】

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

    <TextView
        android:id="@+id/item_title"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:lines="1"
        android:textColor="#ffffff"
        android:textSize="18sp" />

    <TextView
        android:id="@+id/item_descr"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:ellipsize="end"
        android:lines="2" />

</LinearLayout>

 

【変更後】

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

    <TextView
        android:id="@+id/item_title"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textColor="#ffffff"
        android:textSize="18sp" />

    <TextView
        android:id="@+id/item_site"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="right" />

    <TextView
        android:id="@+id/item_date"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="right" />

</LinearLayout>

 

修正後「item_row.xml」ファイルの簡単な解説

6行目の
android:orientation="vertical"
は、「中の要素を縦に並べますよ」という意味です。
ちなみに、
android:orientation="horizon"
だと、横に並びます。

15行目~25行目は追加した要素で、
サイト名と更新日を格納する所になります。
android:gravity="right"
で右寄せにしています。

まとめ

今回はレイアウトの修正だけを行いました。
修正後のレイアウトでビルドするとエラーになると思います。

・・・が、一旦ここで区切ります。
中途半端ですいません。

今回紹介したレイアウトは一例ですので、
わたしが紹介したレイアウトでなくても、自分の好きなレイアウトに直してもいいですよ。

分からないことがあれば遠慮なく聞いてください。

では次回は、ロジックの中身をレイアウトに合わせて少し修正していきます!
[NEXT]
[Androidアプリ開発]2chまとめアプリ作成への道⑤~ITproのソースをちょっとイジる(ロジック編)~