Android Studio类微信页面设计

Android Studio类微信页面设计

此处Android Studio类微信页面的设计，主要要求是设计APP门户界面，此实验包含4个tab切换效果

一.实验要求
页面头部有“WeChat”字样，页面中间有对页面功能的简介，页面底部有四个微信选择框，并且具有选择事件（点击底部四个不同按钮时，四个图标按钮颜色发生变化、中间显示框对应文字都发生改变）

二.实验步骤

在本实验中我们把微信界面分为上中下三个部分
上部实现对“wechat”标题的显示
中部实现对对应页面功能简介的显示
底部实现四个微信微信按钮的显示
所以至少需要三个xml文件。又因为底部有微信，朋友，通讯录，设置四个界面，所以又需要四个xml文件。最终需要七个xml文件。

下面开始进行对类微信页面的设计实验：
准备工作：
首先将需要用到的图标导入到工程的/app/res/drawble 目录下（先将所需图片复制，然后点击drawble目录，直接ctrl+v即可）

1.头部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="65dp"
    android:gravity="center"
    android:background="#e6e6e6"
    android:orientation="vertical">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="WeChat"
        android:textColor="#000000"
        android:textSize="20sp" />
</LinearLayout>

top中主要只是加入一个textview，并使其居中
需要注意的是，设置text时，如果直接设置
android:text=“WeChat”
会出现警告
通常在/res/values文件夹下的string.xml文件里事先设置好将会用到的字符串

然后设置text为
android:text="@string/app_name"

2.中部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:gravity="center"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/textView5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center"
        android:text="这是微信聊天界面&#