Android 開發中一種蛋疼的UI佈局

需求：如下圖的一種佈局，帶有圓角，帶有邊框，而且顏色的深度呈梯度變化，效果看上去還不錯，一般商業軟件需要的佈局。

解決思路：這種情況和一般的佈局是有些不同，想要實現這種方式的佈局，確實找了不少的資料，但是效果都不是很好，過程是曲折的，但是問題需要解決，這種方式在在網上不怎麼看到，通過搜索圓角、邊框、漸變、selector、shape等一些關鍵詞，東拼西湊最後把問題給解決了，達到了產品部門所要求的效果。

這種佈局使用了很多新鮮的東西，至今沒有看的太懂，比如：selector、shape、gradient、corners這些新詞都沒怎麼接觸過，可能是谷歌爲一些佈局特效提供的吧。不懂沒關係，現在可以直接拿過來就能使用了。最後我打包上傳上去。上傳的我是從項目中截取了部分代碼，改了一部分名稱，還有部分有些麻煩就沒有改，呵呵  不知道有沒有泄露公司機密。順便說一下，開發過程中代碼的寫法要儘量的規範，比如顏色值放在colorlist.xml裏，文字放在了strings.xml裏，長度放在了dimens.xml，開發中命名的規範性，這裏的命名不是很規範了，因爲一旦牽涉的頁面比較多的時候，不小心就有重複的頁面佈局，懶惰的我們就會複製粘貼，稍有疏忽就會存在同名的問題，儘管谷歌對這方面也做了很多努力，可以在不同的文件裏使用相同的名字，但是這個不是萬全之策，而且一旦是同名引起的問題，錯誤是不太好找的。一定要在複製粘貼的時候注意好命名問題，當然如果你水平夠厲害，可以做好代碼重用（複製粘貼不算重用吧）

代碼中的背景有四種形式 ：top，bottom,center，round。分別貼在了不同位置的TextView當做背景，周圍的框能夠伸縮的，這個Demo裏別的比較特殊的東西沒有注意到，可以自己下載了看一下，用途就是可以實現點擊每一個部分都能夠實現一個跳轉，解決一些實際中需要的問題。

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout
        android:id="@+id/llBottom"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/more_body_margin"
        android:layout_marginRight="@dimen/more_body_margin"
        android:layout_marginTop="10dp"
        android:background="@drawable/venue_bg_selector_round"
        android:orientation="vertical"
        android:padding="0.5dp" >

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="46dp"
            android:background="@drawable/venue_bg_selector_top"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:drawableLeft="@drawable/icon"
                android:drawablePadding="9dp"
                android:gravity="center"
                android:paddingLeft="@dimen/more_left_right_margin"
                android:text="測試"
                android:textColor="@color/body_textcolor"
                android:textSize="@dimen/more_body_textsize" />
        </RelativeLayout>

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:src="@color/firstcolor" />

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:src="@color/secondcolor" />

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="46dp"
            android:background="@drawable/venue_bg_selector_center"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:drawableLeft="@drawable/icon"
                android:drawablePadding="9dp"
                android:gravity="center"
                android:paddingLeft="@dimen/more_left_right_margin"
                android:text="測試"
                android:textColor="@color/body_textcolor"
                android:textSize="@dimen/more_body_textsize" />
        </RelativeLayout>

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:src="@color/firstcolor" />

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:src="@color/secondcolor" />

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="46dp"
            android:background="@drawable/venue_bg_selector_center"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:drawableLeft="@drawable/icon"
                android:drawablePadding="9dp"
                android:gravity="center"
                android:paddingLeft="@dimen/more_left_right_margin"
                android:text="測試"
                android:textColor="@color/body_textcolor"
                android:textSize="@dimen/more_body_textsize" />
        </RelativeLayout>

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:src="@color/firstcolor" />

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:src="@color/secondcolor" />

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="46dp"
            android:background="@drawable/venue_bg_selector_bottom"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:drawableLeft="@drawable/icon"
                android:drawablePadding="9dp"
                android:gravity="center"
                android:paddingLeft="@dimen/more_left_right_margin"
                android:text="測試"
                android:textColor="@color/body_textcolor"
                android:textSize="@dimen/more_body_textsize" />
        </RelativeLayout>
    </LinearLayout>

</RelativeLayout>

Demo下載 http://download.csdn.net/detail/walker02/4534951