分支欄樣式的圓角矩形的TextView

首先我們看layout文件

main.xml


<?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"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/first_level_payout_category_ly"
        style="@style/common_row_layout_top" >

        <TextView
            style="@style/common_row_label_new"
            android:text="@string/spending_category" />

        <TextView
            android:id="@+id/default_payout_category_name_tv"
            style="@style/common_row_default_item_name_new" />

        <ImageView
            style="@style/go_detail_new"
            android:layout_gravity="center_vertical"
            android:contentDescription="@string/app_name" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/first_level_income_category_ly"
        style="@style/common_row_layout_middle" >

        <TextView
            style="@style/common_row_label_new"
            android:text="@string/income_categories" />

        <TextView
            android:id="@+id/default_income_category_name_tv"
            style="@style/common_row_default_item_name_new" />

        <ImageView
            style="@style/go_detail_new"
            android:layout_gravity="center_vertical"
            android:contentDescription="@string/app_name" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/first_level_project_category_ly"
        style="@style/common_row_layout_middle" >

        <TextView
            style="@style/common_row_label_new"
            android:text="@string/items" />

        <TextView
            android:id="@+id/default_project_category_name_tv"
            style="@style/common_row_default_item_name_new" />

        <ImageView
            style="@style/go_detail_new"
            android:layout_gravity="center_vertical"
            android:contentDescription="@string/app_name" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/account_ly"
        style="@style/common_row_layout_middle" >

        <TextView
            style="@style/common_row_label_new"
            android:text="@string/account" />

        <TextView
            android:id="@+id/default_account_name_tv"
            style="@style/common_row_default_item_name_new" />

        <ImageView
            style="@style/go_detail_new"
            android:layout_gravity="center_vertical"
            android:contentDescription="@string/app_name" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/corporation_ly"
        style="@style/common_row_layout_bottom" >

        <TextView
            style="@style/common_row_label_new"
            android:text="@string/businiss" />

        <TextView
            android:id="@+id/default_corporation_name_tv"
            style="@style/common_row_default_item_name_new" />

        <ImageView
            style="@style/go_detail_new"
            android:layout_gravity="center_vertical"
            android:contentDescription="@string/app_name" />
    </LinearLayout>

</LinearLayout>

然後我們看string.xml文件

<?xml version="1.0" encoding="UTF-8"?>
<resources>
    <string name="app_name">xxx</string>
    <string name="businiss">商家</string>
    <string name="account">賬戶</string>
    <string name="items">項目分類</string>
    <string name="income_categories">收入類別</string>
    <string name="spending_category">支出類別</string>
</resources>

最後關注最關鍵的styles.xml

<?xml version="1.0" encoding="UTF-8"?>
<resources>
    <style name="common_activity_content">
        <item name="android:layout_gravity">center</item>
        <item name="android:layout_width">fill_parent</item>
        <item name="android:layout_height">fill_parent</item>
    </style>
    <style name="common_row_layout">
        <item name="android:layout_gravity">center_horizontal</item>
        <item name="android:paddingLeft">15dip</item>
        <item name="android:paddingRight">15dip</item>
        <item name="android:focusable">true</item>
        <item name="android:clickable">true</item>
        <item name="android:layout_width">304dip</item>
        <item name="android:layout_height">50dip</item>
    </style>
    <style name="common_row_layout_top" parent="@style/common_row_layout">
        <item name="android:background">@drawable/setting_top_bg</item>
    </style>
    <style name="common_row_layout_middle" parent="@style/common_row_layout">
        <item name="android:background">@drawable/setting_middle_bg</item>
    </style>
    <style name="common_row_layout_bottom" parent="@style/common_row_layout">
        <item name="android:background">@drawable/setting_bottom_bg</item>
    </style>
    <style name="common_row_label_new">
        <item name="android:textColor">#ff826d28</item>
        <item name="android:ellipsize">marquee</item>
        <item name="android:gravity">left</item>
        <item name="android:layout_gravity">center</item>
        <item name="android:paddingLeft">10dip</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:singleLine">true</item>
    </style>
    <style name="common_row_default_item_name_new">
        <item name="android:textColor">#ff000000</item>
        <item name="android:ellipsize">marquee</item>
        <item name="android:gravity">right</item>
        <item name="android:layout_gravity">center</item>
        <item name="android:layout_width">0.0dip</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:singleLine">true</item>
        <item name="android:layout_weight">1.0</item>
    </style>
    <style name="go_detail_new">
        <item name="android:layout_gravity">right</item>
        <item name="android:background">@drawable/common_list_item_arrow</item>
        <item name="android:layout_width">8dip</item>
        <item name="android:layout_height">13dip</item>
        <item name="android:layout_marginLeft">10dip</item>
    </style>
</resources>
就可以製作出像上圖一樣的效果了

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章