Android仿微信UI布局视图（圆角布局的实现）

圆角按钮，或布局可以在xml文件中实现，但也可以使用图片直接达到所需的效果，以前版本的微信就使用了这种方法。

实现效果图：

不得不说，这种做法还是比较方便的。

源代码：

MainActivity（没写任何代码，效果全在布局文件中实现）：

package com.android_settings;

import android.app.Activity;
import android.os.Bundle;

public class MainActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
	}

}

activity_main:

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

    <LinearLayout
        android:id="@+id/title"
        android:layout_width="fill_parent"
        android:layout_height="45dp"
        android:background="@drawable/title_bar"
        android:gravity="center_horizontal|center_vertical" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="设置"
            android:textColor="#ffffff"
            android:textSize="20sp" />
    </LinearLayout>

    <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scrollbarStyle="outsideOverlay" >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical" >

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="14dp"
                android:background="@drawable/preference_first_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="个人信息"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:clickable="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/preference_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="二维码名片"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/preference_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="腾讯微博"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/preference_last_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="二维码名片"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <!-- ******************************************************************** -->

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="14dp"
                android:background="@drawable/preference_first_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="我的帐号"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/preference_last_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="手机通讯录匹配"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <!-- *********************************************************************** -->

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="14dp"
                android:background="@drawable/preference_single_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="聊天背景"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <!-- *********************************************************************** -->

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="14dp"
                android:background="@drawable/preference_first_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="通用"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/preference_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="插件"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/preference_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="黑名单"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/preference_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="隐私"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/preference_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="系统通知"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/preference_last_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="流量统计"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>
            <!-- ******************************************************************** -->

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="14dp"
                android:background="@drawable/preference_first_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="帮助与反馈"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/preference_last_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="关于微信"
                    android:textColor="#000"
                    android:textSize="17sp" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:scaleType="matrix"
                    android:src="@drawable/mm_submenu" />
            </RelativeLayout>

            <!-- *********************************************************************** -->

            <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="14dp"
                android:background="@drawable/preference_single_item"
                android:clickable="true"
                android:gravity="center_vertical" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:padding="8dp"
                    android:text="清空聊天记录"
                    android:textColor="#000"
                    android:textSize="17sp" />
            </RelativeLayout>
            <!-- *********************************************************************** -->

            <Button
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="14dp"
                android:layout_marginLeft="12dp"
                android:layout_marginRight="12dp"
                android:layout_marginTop="14dp"
                android:background="@drawable/btn_style_red"
                android:gravity="center"
                android:padding="4dp"
                android:text="退出登录"
                android:textColor="#fff"
                android:textSize="18sp" />
        </LinearLayout>
    </ScrollView>

</LinearLayout>

drawable文件夹下的xml文件：

preference_first_item.xml：

<?xml version="1.0" encoding="UTF-8"?>
<selector
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="true" android:state_selected="true" android:drawable="@drawable/ic_preference_first_pressed" />
    <item android:state_enabled="true" android:state_pressed="true" android:drawable="@drawable/ic_preference_first_pressed" />
    <item android:drawable="@drawable/ic_preference_first_normal" />
</selector>

drawable文件夹下的其他布局文件，都大同小异，我这里就不一一给出来了。但这里需要注意的就是，圆角布局块是由上、中、下三块图拼起来的。。。

如下图：

需要源代码的可以我上传的资源中下载。

Android仿微信UI布局视图（圆角布局的实现）,布布扣,bubuko.com