类微信界面设计将实现的页面效果：
• 1. 隐藏原页面的标题，设置新的标题为“WeChatApplication”
• 2. 页面具有中间显示框
• 3. 页面具有底部选择框，并且具有选择事件
• 4. 页面底部选择框在进行改变的时候，我们需要中间显示框的页面同步改变
• 5. 页面的布局清晰
实验结果预览图：
1.实验环境
Android Studio 版本：4.0.1
虚拟机：Pixel 2 API 30
实验的图标素材选择的是阿里巴巴矢量图标库上的免费素材。点击图标库连接可以自行下载：www.iconfont.cn/
2.实验准备
1.新建一个名为WeChApplication 的 Empty Activity工程
页面程序的主函数放在/app/java/com.example.wechatapplication 下
页面的布局文件放在/app/res/layout 下
2.图标处理和导入
图标大小一般为长宽为50像素的图像合适，一个图标准备两个状态一个是正常状态一个是按压状态。就像下面这个样子
待机状态
选中后状态
之后将处理后的图标从系统的目录下复制到Android Studio左面工程栏上的App/java(generated)/res/drawable 目录下便于后面图标的调用。
3.微信页面布局设置思路
进行基础的实验准备后要开始着手设计我们要完成的页面布局模式，首先App的设计来看是将页面的自带标题去除。这里用view.Window库下面的FEATURE_NO_TITLE函数隐藏原App的标题：
requestWindowFeature(Window.FEATURE_NO_TITLE);
接下来就进行App的主界面设计：由App的界面来看，我们可以看到微信App的界面设计主要是由标题、程序主界面和底部的标题栏三部分构成；其中标题的下端可以通过点击来对App主界面的内容进行设计，而这次设计的主要难点就是对于底部按钮对主要内容切换的设置和切换的图标响应。
主要的layout布局文件选择的是Layout XML File。其中App的layout布局文件分别为top.xml(App顶部标题文件)、bottom.xml(App底部按键设定文件)、activity_main.xml(App主体文件)。top.xml由TextView设定文字和背景颜色即可。bottom.xml由imagebotton和TextView组成。
要实现按键对App进程的切换，还得建立对应的xml页面文件（由于这次只是简单的设计一些布局文件，所以这些xml文件只有一个TextView标签，用来表明每次点击底部的按钮后可以切换App的内容）。要想用按钮对App的窗口进行操作，就需要使用Fragment函数可使Activity在运行中实现动态地加入、移除和交换等操作。我们要将我们的layout布局文件存储于Fragment函数中，这里的Fragment函数可以作为一个容器对代码进行储存。然后我们再创建监控函数来与Activity文件进行通信，根据点击的按键不同进入不同的页面。这里Fragment将几个不同的页面整合起来，根据用户对主界面发起的信号，从监听函数中收到相关的指令从而进行相应的行动。
Fragment函数：这个java Class用来存储配置好的tab02布局文件
布局文件tab02
监听函数：根据点击来执行相应的命令并且改变图标。其中show()函数，括号中的参数是主界面layout的实例，储存上面的java class布局文件。而mImgWeixin是布局文件的imagebotton，这里点击后就将图标改成这个样子。而resetting（）函数则是在执行到下一次点击后就对之前的App图标进行一次复原（就是将图标设置成原来的样子），对选择的App起到一个突出作用。具体源码看我的gitee仓库。
监听的响应函数：对于点击的图片给监听函数传i值。
activity_main总体布局文件就由include函数来引用顶部和底部的布局文件top和bottom（这是id）。然后中间的Frame就将fragment布局显示在页面的中间。下面是配置源码：
<include layout="@layout/top" />
<FrameLayout android:id="@+id/id_content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
</FrameLayout><include layout="@layout/bottom" />
这些就是程序大体的设计思路了，其他方面的还是直接看源码吧。 4.实验源码 gitee.com/SDVA8766304…
