是男人就下100层【第一层】——高仿微信界面（9）

前面几篇文章实现的界面效果不符合4.0的HOLO主题及官方建议的设计规范，感谢“一片冰心在玉壶”给我指出，不然我可能会一直错下去，也会误导大家。接下来这几篇我计划用HOLO主题来高仿一下微信5.0的界面实现。

先看看今天要实现的效果：

闪屏界面和前面做的类似这里就不叙述了，我们直接看主界面的实现布局文件：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/white" >

    <LinearLayout
        android:id="@+id/llayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:orientation="vertical" >

        <include layout="@layout/top1" />

        <include layout="@layout/top2" />
    </LinearLayout>

	<LinearLayout 
	    android:layout_width="match_parent"
	    android:layout_height="match_parent"
	    android:orientation="vertical">
	    
	</LinearLayout>

</RelativeLayout>

上面的<include>标签引入外部布局放入到此处

top1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:background="@drawable/abc_ab_bottom_solid_dark_holo"
        android:gravity="center_vertical" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:layout_alignParentLeft="true"
            android:layout_marginLeft="10dp"
            android:gravity="center"
            android:orientation="horizontal" >

            <ImageView
                android:layout_width="30dp"
                android:layout_height="30dp"
                android:src="@drawable/actionbar_icon" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dip"
                android:text="微信"
                android:textColor="@color/lightgray"
                android:textSize="18dp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:layout_alignParentRight="true"
            android:gravity="center"
            android:orientation="horizontal" >

            <ImageView
                android:layout_width="30dp"
                android:layout_height="wrap_content"
                android:layout_marginRight="20dip"
                android:src="@drawable/actionbar_search_icon" />

            <ImageView
                android:id="@+id/add"
                android:layout_width="30dp"
                android:layout_height="wrap_content"
                android:layout_marginRight="20dip"
                android:src="@drawable/actionbar_add_icon" />

            <ImageView
                android:id="@+id/set"
                android:layout_width="30dp"
                android:layout_height="wrap_content"
                android:src="@drawable/actionbar_more_icon" />
        </LinearLayout>
    </RelativeLayout>

</LinearLayout>

这个布局很简单，就是一个相对布局嵌套两个线性布局。

top2.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/lllayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#F5F5F5"
        android:orientation="horizontal" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/guide_round"
            android:gravity="center"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/liaotian"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:padding="10dip"
                android:text="聊天"
                android:textColor="@color/green"
                android:textSize="15dip" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/guide_round"
            android:clickable="true"
            android:gravity="center"
            android:orientation="vertical"
            android:saveEnabled="false" >

            <TextView
                android:id="@+id/faxian"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:padding="10dip"
                android:text="发现"
                android:textColor="@color/black"
                android:textSize="15dip" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/guide_round"
            android:focusable="false"
            android:gravity="center"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/tongxunlu"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:padding="10dip"
                android:text="通讯录"
                android:textColor="@color/black"
                android:textSize="15dip" />
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

三个线性布局中包裹的分别是三个菜单。

最后再将manifest文件内容贴出

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.holoweixin"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="18" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@android:style/Theme.Black.NoTitleBar" >
        <activity
            android:name=".IndexActivity"
            android:label="@string/app_name"
            android:theme="@android:style/Theme.Black.NoTitleBar.Fullscreen"
            android:screenOrientation="portrait"
             >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity
            android:name=".MainActivity" 
            android:screenOrientation="portrait"/>
    </application>

</manifest>

这两天上火感冒的，今天就这样吧，下一篇继续....

如果有什么问题或者更好的方法请大家指出，我会再次改进，谢谢大家。

源代码：http://download.csdn.net/detail/lxq_xsyu/7002611