# 中山大学数据科学与计算机学院本科生实验报告
## (2021年春季学期)
| 课程名称 | Android现代操作系统应用开发 | 任课老师 | 郑贵锋 |
| :------------: | :-------------: | :------------: | :-------------: |
| 年级 | 2018级 | 专业(方向) | 软件工程专业 |
| 学号 | 18342142 | 姓名 | 周朗 |
| 电话 | 15271612279 | Email |[email protected]|
| 开始日期 | 2021.3 | 完成日期 | 2021.3.22|
---
## 一、实验题目
## MAD2021 HW1
创建第一个Android 开发项目,在实际项目开发中掌握并理解课堂上的知识和理论,在代码中感受《移动应用开发》的真正魅力!
---
## 二、实现内容
1. 按照作业要求,使用约束布局,还原各个页面。
2. 在制作页面时,掌握如:TextView,RecyclerView,TabLayout 等控件的使用方法。
3. 完成页面跳转等交互功能。
## 三、实验结果
### (1)实验截图
| 选择语言界面 | 学习界面 |
| :-----------------------------: | :-----------------------------: |
|![在这里插入图片描述](./img/img1.png)|![在这里插入图片描述](./img/img2.png)|
| 用户界面(信息) | 用户界面(设置) |
| :-----------------------------: | :-----------------------------: |
|![在这里插入图片描述](./img/img3.png)|![在这里插入图片描述](./img/img4.png)|
### (2)实验步骤以及关键代码
1. 制作选择语言界面
该页面的难度集中在**页面的布局**上,我需要将 4 张带标题的图片,加上一个总的标题。
这里我采用 LinearLayout,将整个布局看作几个“行式”的内容,并使用 Contraint 布局固定元素在界面中的位置(配置方法:在 XML “design” 模式下,右键元素 -> Constrain -> "parent start" 等,点击之后,自动配置元素在界面中的约束)。
除此之外,该页面还需要实现**点击跳转**功能。这里我在对应的 Activity 中(Code -> Welcome)获取图片元素,并配置点击事件:
```
// english
ImageView but1 = findViewById(R.id.american);
but1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent it = new Intent();
it.setClass(Welcome.this, MainActivity.class);
it.putExtra("language","学习英语");
Welcome.this.startActivity(it);
}
});
```
上述代码是点击“英语图片”进入“学习英语”的界面(对应 MainActivity)。
注:使用 Intent putExtra 添加额外的数据,让跳转后的页面根据用户选择显示不同的内容。
```
Intent intent=getIntent();
language=intent.getStringExtra("language");
```
上述代码是在跳转后的(MainActivity)界面构造函数中,通过 Intent 对象,获取跳转过程附加的信息。
2. 学习列表页面
该页面主体即为一个带单元标题的列表。这里我选择使用 RecycleView 来实现列表。
制作列表需要的元素有:list.xml(含有 RecycleView 的页面模板),list_item.xml(确定列表每一个单元的模板) 以及一个 Adapter 将数据(这里的数据时在 dummy 文件夹下的 DummyContent 中构建的)以 list_item 的形式 添加到 list 中。
这里,我在学习列表所在的 Code -> ListFragment 中获取 RecycleView 后,为其 `setAdapter` 配置适配器。这样一来,便可以制作一个含有列表的 Fragment。
3. 用户页面
用户页面包含一个“登录”的圆形图片(这个依靠绘制一个自定义的 TextView 来完成),然后难点在于使用 TabLayout 完成一个 Fragment 内部的切换器。
这里我们仿照主界面的做法,创建两个 Fragments,然后创建 Adapter 将 Fragments 与 TabLayout 连接起来。适配器的制作方法请详见 Code -> dashboard -> MyFragmentAdapter。Java 代码结构图如下:
![在这里插入图片描述](./img/img5.jpg)
可以看到,这里我们创建了两个 Fragments,userTab1,userTab2,并编写了对应的模板.xml,为其构造相关元素。
4. 导航栏的实现
本次实验需要制作底部和顶部的导航栏。
底部导航栏可以在创建项目时,选择带底部导航栏的模板项目,然后对模板项目的导航代码进行理解和修改,达到实现要求。其中 MainActivity 中导航栏的创建如下:
```
BottomNavigationView navView = findViewById(R.id.nav_view);
// Passing each menu ID as a set of Ids because each
// menu should be considered as top level destinations.
AppBarConfiguration appBarConfiguration = new AppBarConfiguration.Builder(
R.id.navigation_list, R.id.navigation_dashboard)
.build();
NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment);
// NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);
NavigationUI.setupWithNavController(navView, navController);
```
顶部导航栏,由于项目模板自带的顶部 ActionBar 不能够添加“返回按钮”,所以我们在 AndroidManifest.xml 中,将项目的 theme 属性配置为 "NoActionBar" 即可去掉模板自带的标题栏,然后使用 LinearLayout 自己制作一个顶部导航栏。
制作顶部导航栏有一个需要注意的地方就是,必须在导航栏所在的 Fragment 的 OnCreateView 中去绑定点击事件,而不能在 MainActivity 的 OnCreate 中去绑定,因为这个时候,相应的 Fragment 以及其中的元素都没有创建,编译器会报错,“为空指针绑定点击事件处理函数”。
---
## 四、实验思考及感想
在这次实验中,我对**约束布局**有了更深刻的理解,一开始只使用了线性布局,真正运行的时候,所有元素都错位到了一块儿,只有在配置了每个最外层的元素相对于 parent 的约束布局,才能够保证所有元素在确认的位置显示。
然后就是各个控件的使用了,从需要变成圆形的 TextView,到需要配置 Adapter 的 RecycleView 和 TabLayout,课堂上一知半解的内容,到了实际使用时遇到了很多困难。最后在参考了 Android 提供的使用模板,以及很多博客的指导意见之后,终于使用这些控件做出了想要的页面效果。
最后,需要改进的地方,应该就是对 Android 的整个项目结构还是有不清晰的地方,比如 Manifest.xml 时如何控制整个项目的样式的,等等。希望在接下来的学习中,一方面能够对 Android 项目架构有更清晰的认识,另一方面,也希望自己使用各种控件时,能够更加熟练、高效。
感谢观看。