2020/10/11 晚完成该课程第一个实验报告。

Android Studio微信页面提交

需要完成以下要求：

1.页面具有标题

2.页面中间具有现实框

3.页面具有底部选择框，同时具有选择事件

4.页面底部选择框，在进行改变的时候，我们中间显示框的页面同步改变

5.页面不出要清晰

1.基础元素放入

在基础的元素中，包括图片，首先将我们所需要的图片放入

Ctrl CV 放在/app/res/drawble 目录下即可，选择是随意的，都可以，优先选择第一个即可

2.布局设计

在完成基础的元素的放入后，我们就要来思考如何构思我们所需要的页面布局。

首先关注我们微信的页面分为上下三个部分，首先是最上面的头部也就是APP的的名字，然后是中间的内容，最后就是文件的底部，也是我们在切换界面时要点击的东西。这样想好后，首先我们就需要一个头部显示的xml文件（top.xml），然后是底部按钮的xml文件（button.xml），我们还发现每一次的点击我们都是要显示界面的，所以点击的四个button要对应四个界面的xml文件（t1.xml，t2.xml，t3.xml，t4.xml）。目前将我们所需要的大致的界面都已经将层次分清楚了，也将所需要的对应的文件都新建。

首先是头部的xml文件，从一般的见面可以看出，就是比较简单的TextView文件显示而已，然后我们需要居中放置即可，然后我们自定义字体颜色和背景颜色就可以了。有关于文字居中，我们要修改和添加一些配置信息（既可以在code中直接修改也可以在design中去选择）。

在linearlayout（后面简写为l）中，我们修改gravity所对应的配置信息为center

在TextView（后面简写文t）中，我们修改layout_gravity所对应的配置信息为center_horizontal

然后我们就可以看见，文字居中了，我们只是修改了他的位置，然后我们需要修改字体颜色和背景颜色，背景色在l中修改，背景色就肯定是background的，然后是字体颜色，输入textcolor，然后选择颜色即可，选择颜色有一种比较方便的修改方式，首先在color一行输入#000000或者#ffffff，然后再左侧会出现相对应的颜色块，刚刚输入的就是黑色和白色，但是哪一个是哪一个色，我也不是很清楚，点击相应的色块后，就可以在下面选择颜色以及其亮度（我也不知道是啥度，反正会变，自己看着点吧），然后选出自己想要的颜色。

然后大家看我一个test的对应配置信息，可以看见我们写的并不是文字，而是@string/app_name，这个的意思就是使用在/res/values文件夹下的string.xml文件里app_name所对应的字符串。对应格式也可以仿照已经有的，而且也可以修改对应的工程的名字。如果你需要其他的，你一样也可以添加。

我突然发现最开头有一个问题，就是原本app最上面有一个框，我们需要不显示他，由于版本不一样，导致我们使用老师的方法，我们并不能达到我们所需要的效果，我百度到了一个方法，其他方法要实现也可以，我的方法比较简单，在/res/values文件夹下的style.xml文件里，将style标签里的parent的配置信息改为Theme.AppCompat.Light.NoActionBar，就是最后哪一个点后面改为NoActionBar就可以了。

然后，一些基本的配置我们就弄完了，什么字体颜色大小，自己随意就好，想咋样就咋样。还有，关于自带的activity_main.xml文件要先删掉，然后再新建

top的文件弄好了，我们再弄button的xml，首先我们看，其实就是2×4的表格，上面是imagebutton，下面是TextView，我们看着样子也可以仿照，然后的话先一个水平放置的LinearLayout，然后早这个下放入四个垂直的LinearLayout，在四个垂直的LinearLayout下先放置一个imagebutton，再放一个TextView，这样大致布局就好了，然后我们要配置宽度和高度，使八个东西我们都可以看见，然后再慢慢拖就行，想咋拖就咋拖，记得拖对，别托错了。下面是配置怎么让那四个显示出来。

在垂直的LinearLayout中，修改下列文件配置，要是配置信息写入之后没有预期效果，就对照我的代码吧，百度也可以。layout_width，layout_weight，orientation，这三个需要改。分别是0dp，1，vertical，也可以在视图中改下，更方便，记得四个都要改。ID啥的就自己改下，自己认得就行。然后布局弄完之后就是内容，内容自己随意就好，想咋整就咋整。

主界面就更简单了，就是四个界面，就是四个xml文件，兴建四个layout文件，然后每一个里面都放一个TextView，放正中间，咋放刚刚说了，自己去看看，然后内容自己随意就好。

这样我们所设计的基本的布局就好了，我们再主界面再把他们放在一起就好。

在activity_main里，首先在最外面设置垂直，配置orientation就行，配置以v开头就行。然后是将头部和button放入，用include导入top和button，然后中间放入一个FrameLayout就可以了。

这样布局界面就写完了。

3.主Java文件编写

在主Java代码中，我们布局已经写好了，我们再就需要按对应的按钮显示对应的界面，我们是Fragment进行操作，我们创建对象，然后肯定会报错，因为我们没有对应的类以及对应的构造函数，我们按报错提示新建对应的class就好，然后修改R.layout所对应的ID去得到我们所需要的layout文件，这样就可以得到对应的布局。

按上图配置，每一个类对应一个布局，这样我们就将四个布局所对应的xml文件就变成了四个类对象（t1，t2，t3，t4），这样我们就可以正常调用它。

然后我们就可以开始写主Java程序开始调用，我们要在fragment中显示我们的layout布局文件，既然要显示多个布局那我们肯定先要将布局文件放入，然后才能显示，调用fragmenttransaction就可以实现放入，然后提交就可以了，首先将fragment实例化，然后将fragmenttransaction实例化，我说过的所有的实例化，前面早就已经定义过，记得定义。

在实例化fragmentmanager是，用的函数不是getFragmentManager()，而是getSupportFragmentManager()，产生这个问题的原因也是由于版本不对，不论你如何改，按照报错的情况都无法将他弄对。

transaction.add(R.id.zhuomian,t1); //这是加入一个，前面是fragment，后面是要放入的主界面布局的layout文件的实例，就是前面我所实例化的对象，就是ti(i取1,2,3,4)。

我们可以分析我们是通过点击imagebutton来改变布局的内容，然后button变亮，默认是第一个界面，所以我们就需要将我们所需要监听和显示的实例化，因为Java是不能直接调用layout文件。然后我们要将linearlayout和imagebutton实例化，这样后面我们才可以监听，使用findViewById（），就可以是按对应控件实例化。实例化后，我们就可用Java程序进行调用了。

我们是通过点击来切换界面，那么我们监听函数，就需要通过的得到我们所点击的控件的ID来确定我们时点击哪一个imagebutton，从而返回一个值，从而显示所对应的界面。

再最开始显示界面之前，我们需要先将我们的界面隐藏起来，不然都会显示，这样我们后面写的函数show()才有意义，所以，先执行函数hide()即可，对应参数传入界面的layout的实例对象即可。

首先是显示对应的界面，我们要认为添加一个ID，只要不相同，且一一对应，数组字母都可以，但是要统一，然后监听得到点击后返回所对应ID，这样我们就通过ID判断，所以我们的显示界面的函数是以id为参数（id是自己人为规定），这就是一个switch函数，通过调用transaction的show()函数，括号中的参数给的是主界面layout的实例，这样就可以显示对应的界面；然后imagebutton变量，说白了就是换一张图片显示，通过imagebutton的实例调用setImageResource()函数，改变图片的路径，括号里填图片的路径，通过R.drawable给出图片路径，尽量图片的命名为英文，这样就可以让图片亮起来。现在我们发现，我们只能让图片亮起来，但是不能暗下去，所以我们需要统一让图片暗下去，然后再通过点击亮一个，这样点击就是我们得到的效果，我们既可以写一个无返回值无参数的函数，将照片的路径改为最开始的路径，也是调用setImageResource()函数，然后将函数放在显示界面函数的最开始，这样就可以，也可以在显示界面函数最前面加上四个修改路径的代码。最后就实现了imagebutton的亮和灭。

然后就是监听函数，我们通过写一个参数为view无返回值的函数，得到监听的view的id，使用getID函数，根据对应的id从而显示不同的界面，我之前说过要我们认为规定一个id，这时候就调用显示界面的函数，给显示界面的函数传入所需要的参数，然后显示界面函数就可以对应执行，这样我们就实现了不同界面的切换。

虽然理论上我们已经弄好了但是我们并没有监听，所以写一个无参无返回值的函数，启动监听即可，调用函数setOnClickListener()即可，传入参数为this，这样就实现了监听。

但是在监听的时候注意，你会发现如果你监听linearlayout，是无法监听的，因为后面找不到这个函数，所以我们就，换一个监听，我们监听imagebutton也可以，这个是完全可以监听的，所以，这样就可以完成，关于如何换一个监听，换一个实例对象就好了。

这样的话，我们就完成了页面的设计，我们可以看出，大部分都是Java类对象的理解，然后也是比较基础的逻辑关系，最后注意，我给出的图片都是由于版本不对应，我的代码的不同之处。