第一个安卓应用小程序--浅浅仿照微信发现界面

一、实验目标

模仿微信“发现”页创建列表布局，学习使用Textview imageview、LinearLayout

二、实验步骤

列出实验的关键步骤、代码解析、截图。

1.安装jdk

创建一个英文名称的文件夹（尽量别用中文），将下载好的 jdk 保存至该目录下

进入java SE的安装页面

点击下一步之后，默认会安装到的 C:\Program Files\Java\jdk \ (这个路径一定要记住，后续要用)，

你也可以选择想要安装的文件夹（此处选择默认路径），之后再点击下一步

开始下载 …

直接下一步,安装完成.

然后，就可以在你选择的文件下看到下载好的 jdk 和 jre ，

此处使用的是默认安装地址，所以在 C:\Program Files\Java\jdk \ 能够看到这两个文件

2、JAVA环境配置——环境变量配置

鼠标右键我的电脑（此电脑） - 属性 - 高级系统设置再选择环境变量

点击环境变量后，如图所示，

点击新建

添加配置：

变量名：Java_Home

变量值：jdk 的安装目录，可以点击浏览目录选择(这个就是刚才的安装路径)

新建好了，点击确定保存

同时还需要添加 Path 的配置，选择 Path ，点击编辑

新建两个环境变量

变量1：%Java_Home%\bin

变量2：%Java_Home%\jre\bin

我们会将它上移到顶部，再确定保存

检测是否配置成功

使用 dos 命名：win + R 再输入 cmd 回车

打开命令窗口输入java 回车

如果想要查看当前系统的全局 jdk 版本

可输入 java -version 命令查看

3、Android studio安装（含SDK）

首次运行时，因为我们没有SDK 所以系统会去检测环境，这里选择

Cancel 即可

设置自定义的地方

先使用默认的即可直接Next下一步

这里是一些关于SDK的协议选择Accept接受协议然后点击Finish

导入自己的设置地方可以先进行跳过后期可以自己进行设置

开发工具的主题目前以黑色为主看个人爱好选择好之后Next下一步

开发工具的主要设置主要涵盖了一些SDK等直接Next下一步

如果安装完成了

页面就会变成这个样子点击加号或New Project创建项目

选择Empty Activity 创建空的页面app

我们这里把项目语言那里改成JAVA

首次运行

需要下载一些运行项目的库

到了这个页面

我们就算是完成安装了

只需要让开发工具自行

下载一个运行所需的

jar包就可以了

*LinearLayout 线性布局在安卓开发中，用的相对频繁的是线性布局和相对布局，在大多数的情况下使用这两种布局都能完成。线性布局相对简单，就是所有控件都依次排序，谁也不会覆盖谁。线性布局需要定义一个方向（横向或纵向），下面简单介绍一下 weight（权重属性）： weight 属性用来等比例地划分区域的，但需要注意是对当前布局中剩余空间进行分配，因此可能会出现比例倒置的情况，因此谷歌建议水平线性布局的宽度设置成0dp后再设置对应控件的权重，垂直的高度设置成0再设置权重.

4.项目逻辑梳理

页面上主要包含5组列表，每组列表包含1-2个列表项。

具体内容解释如下：

• 列表组1：“朋友圈”单行列表项；

• 列表组2：“扫一扫”和“摇一摇”两行列表项；

• 列表组3：“看一看”和“搜一搜”两行列表项；

• 列表组4：“购物”和“游戏”两行列表项；

• 列表组5：“小程序”单行列表项。

1.首先设计一个外部总垂直布局,包含所有的列表组

2.写五个LinearLayout来构建这五个列表组

3.每个列表组的单独构建

4.列表组之间的间隔样式搭建

创建父布局；对父布局进行设置背景色；设置父布局的垂直方向

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:background="#f0f0f0"android:orientation="vertical"tools:context=".MainActivity">
</LinearLayout>

构建第一个列表组；设置宽高；设置背景色；设置垂直方向
```
<LinearLayoutandroid:layout_marginTop="10dp"android:background="#fff"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="60dp"></LinearLayout>
```
1. 创建列表组里的第一个图标；设置宽高；设置背景色；设置与左边的距离；设置居中

<ImageViewandroid:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/icon_pengyou"android:layout_width="40dp"android:layout_height="40dp"/>

创建列表组中的汉字；设置汉字；设置宽高；设置字体颜色；设置字体样式；设置字体大小；设置与左侧的距离；设置字体居中

<TextViewandroid:textColor="#333"android:textStyle="bold"android:textSize="18dp"android:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:layout_weight="1"android:text="朋友圈"android:layout_width="0dp"android:layout_height="wrap_content"/>

创建列表组右边的箭头；设置宽和高；设置背景；设置水平居中；设置与右边的距离

<ImageViewandroid:layout_marginRight="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/right"android:layout_width="7dp"android:layout_height="13dp"/>

可以设计一个外部总垂直布局，包含5组列表，用五个 LinearLayout 来构建这5组列表，每组列表组单独构建，列表组之间存在间隔。

代码如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:background="#f0f0f0"android:orientation="vertical"tools:context=".MainActivity">

<LinearLayoutandroid:layout_marginTop="10dp"android:background="#fff"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="60dp">

<ImageViewandroid:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/icon_pengyou"android:layout_width="40dp"android:layout_height="40dp"/>
<TextViewandroid:textColor="#333"android:textStyle="bold"android:textSize="18dp"android:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:layout_weight="1"android:text="朋友圈"android:layout_width="0dp"android:layout_height="wrap_content"/>

<ImageViewandroid:layout_marginRight="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/right"android:layout_width="7dp"android:layout_height="13dp"/>

</LinearLayout>

<TextViewandroid:background="#f0f0f0"android:layout_width="wrap_content"android:layout_height="15dp"/>

<LinearLayoutandroid:background="#fff"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="60dp">

<ImageViewandroid:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/one"android:layout_width="40dp"android:layout_height="40dp"/>
<TextViewandroid:textColor="#333"android:textStyle="bold"android:textSize="18dp"android:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:layout_weight="1"android:text="扫一扫"android:layout_width="0dp"android:layout_height="wrap_content"/>

<ImageViewandroid:layout_marginRight="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/right"android:layout_width="7dp"android:layout_height="13dp"/>

</LinearLayout>
<LinearLayoutandroid:background="#fff"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="60dp">

<ImageViewandroid:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/three"android:layout_width="40dp"android:layout_height="40dp"/>
<TextViewandroid:textColor="#333"android:textStyle="bold"android:textSize="18dp"android:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:layout_weight="1"android:text="摇一摇"android:layout_width="0dp"android:layout_height="wrap_content"/>

<ImageViewandroid:layout_marginRight="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/right"android:layout_width="7dp"android:layout_height="13dp"/>

</LinearLayout>
<LinearLayoutandroid:layout_marginTop="15dp"android:background="#fff"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="60dp">

<ImageViewandroid:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/four"android:layout_width="40dp"android:layout_height="40dp"/>
<TextViewandroid:textColor="#333"android:textStyle="bold"android:textSize="18dp"android:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:layout_weight="1"android:text="看一看"android:layout_width="0dp"android:layout_height="wrap_content"/>

<ImageViewandroid:layout_marginRight="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/right"android:layout_width="7dp"android:layout_height="13dp"/>

</LinearLayout>
<LinearLayoutandroid:background="#fff"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="60dp">

<ImageViewandroid:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/five"android:layout_width="40dp"android:layout_height="40dp"/>
<TextViewandroid:textColor="#333"android:textStyle="bold"android:textSize="18dp"android:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:layout_weight="1"android:text="搜一搜"android:layout_width="0dp"android:layout_height="wrap_content"/>

<ImageViewandroid:layout_marginRight="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/right"android:layout_width="7dp"android:layout_height="13dp"/>

</LinearLayout>
<LinearLayoutandroid:layout_marginTop="15dp"android:background="#fff"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="60dp">

<ImageViewandroid:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/six"android:layout_width="40dp"android:layout_height="40dp"/>
<TextViewandroid:textColor="#333"android:textStyle="bold"android:textSize="18dp"android:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:layout_weight="1"android:text="购物"android:layout_width="0dp"android:layout_height="wrap_content"/>

<ImageViewandroid:layout_marginRight="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/right"android:layout_width="7dp"android:layout_height="13dp"/>

</LinearLayout>
<LinearLayoutandroid:background="#fff"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="60dp">

<ImageViewandroid:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/seven"android:layout_width="40dp"android:layout_height="40dp"/>
<TextViewandroid:textColor="#333"android:textStyle="bold"android:textSize="18dp"android:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:layout_weight="1"android:text="游戏"android:layout_width="0dp"android:layout_height="wrap_content"/>

<ImageViewandroid:layout_marginRight="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/right"android:layout_width="7dp"android:layout_height="13dp"/>

</LinearLayout>
<LinearLayoutandroid:layout_marginTop="15dp"android:background="#fff"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="60dp">

<ImageViewandroid:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/eight"android:layout_width="40dp"android:layout_height="40dp"/>
<TextViewandroid:textColor="#333"android:textStyle="bold"android:textSize="18dp"android:layout_marginLeft="15dp"android:layout_gravity="center_vertical"android:layout_weight="1"android:text="小程序"android:layout_width="0dp"android:layout_height="wrap_content"/>

<ImageViewandroid:layout_marginRight="15dp"android:layout_gravity="center_vertical"android:background="@mipmap/right"android:layout_width="7dp"android:layout_height="13dp"/>

</LinearLayout>




</LinearLayout>

三、程序运行结果

列出程序的最终运行结果及截图。

四、问题总结与体会

1.实验环境搭建时一定注意每一步操作是否正确，否则很容易重来。

2.安装过程网络经常波动，只能try again。

3.如果Android-studio无法安装虚拟机HAXM，可能是电脑部分变量问题，解决办法：

物理连接手机，跟着网上教程即可轻松连接；或是下载第三方模拟器，根据教程连接到studio

4.代码报错，很可能是部分包没安装，请阅读error网上查阅资料重新下载包体，重启解决。