课程实践 1: 制作第一个 Android App

第一个 Android App"/>

课程实践 1: 制作第一个 Android App

这是 Android 开发（入门）课程 的第一部分《布局和交互》的第一次课程实践，导师是 Lyla Fujiwara，主要内容是安装 Android Studio 并制作第一个 Android App。

安装 Android Studio

在前两节课利用 XMLV 查看仿真效果之后，从现在开始，终于可以用真正的 IDE: Android Studio 来学习和实践 Android 了。

把 Android Studio 看作开发 Android App 的工作室，JDK 则是工具箱。因此，在安装 Android Studio 之前，需要先安装 JDK (Java Development Kit)。

1. Java 由 Oracle 支持与维护，到 下载页面 选择相应包下载安装 JDK，完成后打开 Terminal 输入 java -version 验证安装是否成功，若成功，返回值如下：

java version "9.0.1"
Java(TM) SE Runtime Environment (build 9.0.1+11)
Java HotSpot(TM) 64-Bit Server VM (build 9.0.1+11, mixed mode)
复制代码

2. Android Studio 由 Google 提供，到 Android 开发者网站 下载安装，成功后软件会正常启动。

具体的安装步骤不再赘述，Udacity 提供了一份 Android Studio 安装故障排除手册可供参考，相信网上也会有大量的资源。另外，因为我用 Mac 开发，所以以下操作都是在 MacBook 进行的。

制作第一个 Android App

1. Android Studio 初始界面

点击第一个选项 "Start a new Android Studio project"。

2. 配置新工程

一共有四个参数：
（1）Application name（应用名）
显示在 App 应用栏上，也是 App 安装后在设备上显示的名称；
（2）Company Domain（域名）
若无可保持默认；
（3）Package name（安装包名）
默认由应用名和域名的倒叙组成 apk 安装包的名称，可修改，安装包名需要是独一无二的。
（4）Project location（工程存放路径）
工程会存放在名称为应用名的目录内，可修改。

3. 选择 App 运行设备和最低 SDK 版本

（1）App 运行设备可选择手机和平板 (Phone and Tablet)、可穿戴设备 (Wear)、电视 (TV)、汽车 (Android Auto)、物联网设备 (Android Things)。
（2）最低 SDK 版本 (Minimum SDK) 可点击 "Help me choose" 帮助选择。例如选择 "API 15: Android 4.0.3 (IceCreamSandwich)" 后，左侧可见目前已支持所有 Android 设备，右侧列出支持的特性，如下图所示。

低版本的 SDK 或 API 能支持更多的设备，但支持更少的特性。

4. 选择工程模板

Android Studio 提供了许多工程模板让开发者能够在模板的基础上进行开发，此处选择 Empty Activity。

5. 为工程文件命名

工程由许多不同类型的文件组成，如图片文件、声音文件、XML 文件、Java 文件等，可以根据 App 需求将他们的名称进行修改，此处保持默认。最后点击 Finish 完成。

6. 等待底部状态栏加载完成，工程新建完毕

需要注意的是，虽然 Google 一直都致力于改善 Android 平台，添加一些出色的新功能，这对开发者来说是个好事，但是有时候也会给教育带来难题。最近，Google 推出了“约束布局 (ConstraintLayout)”，它包含各种不同的组件，让开发者能快速制作自适应 UI。尽管如此，但在本课程中，仍将使用更简单的 RelativeLayout 和 LinearLayout。因此，打开 "app/src/main/res/layout/activity_main.xml" 将以下代码替换 Android Studio 自动生成的 ConstraintLayout 代码。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayoutxmlns:android=""xmlns:tools=""android:layout_width="match_parent"android:layout_height="match_parent"tools:context="com.example.hsujin.helloworld.MainActivity"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Hello World!" />
</RelativeLayout>
复制代码

Android Studio 的界面看上去很复杂，但其实不用了解所有的按钮，只需要在用到时查询即可。此时只需要关注三点：

1. 左侧 Project 标签显示了工程文件树，双击文件会在中间打开；
2. 文件底部有两个标签，一般在 Text 下编辑，文件会自动保存，善用撤销 (cmd+z) 和重做 (cmd+shift+z)；
3. 右侧 Preview 标签实时显示效果预览。

到此为止，第一个 Android App 就完成了。从 Android Studio 右侧的 Preview 标签可以看到 App 会显示 "Hello World!" 字样，现在安装到实际的 Android 设备验证。

首先在手机上开启开发者选项 (Developer options) 并勾选 USB 调试 (USB debugging)；连接手机后（Windows 平台需要安装驱动）。 准备好后，点击 Android Studio 顶部工具栏的绿色播放按钮或快捷键 "shift+F10" 运行 App，稍后会出现设备选择界面，选择已连接的设备，点击 OK 即可。

如果想用模拟器来仿真 App，则在上面的设备选择界面点击 "Create New Virtual Device" 新建一台虚拟 Android 设备。如果虚拟设备启动后没有自动打开 App，可以再次点击运行按钮 (shift+F10) 并选择虚拟设备，运行结果如下图所示。

这种方法会大量消耗电脑的性能，并存在 bugs，若要取得可靠的调试结果，建议使用硬件调试。

课程至此，我做了第一个实战项目——商家信息应用。这是个简单的 XML 练习，源码如下。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android=""xmlns:tools=""android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><ImageViewandroid:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="1"android:scaleType="centerCrop"android:src="@drawable/borgesbookshop" /><TextViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:paddingLeft="16dp"android:paddingRight="16dp"android:paddingTop="16dp"android:text="Borges Bookshop. 小而精的独立文学书店"android:textColor="@android:color/black"android:textSize="16sp" /><TextViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:gravity="right"android:paddingBottom="16dp"android:paddingLeft="16dp"android:paddingRight="16dp"android:paddingTop="8dp"android:text="不卖畅销书，书籍按作者姓名字母排列摆放。"android:textColor="@android:color/black"android:textSize="16sp" /><TextViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:paddingLeft="16dp"android:paddingRight="16dp"android:text="地址：广州市海珠区怡乐路95号二层"android:textSize="15sp" /><TextViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:paddingLeft="16dp"android:paddingRight="16dp"android:paddingTop="8dp"android:text="电话：020-83340575"android:textSize="15sp" /><TextViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:paddingLeft="16dp"android:paddingRight="16dp"android:paddingTop="8dp"android:text="电邮：borgeslibreria@vip.163"android:textSize="15sp" /><TextViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:paddingBottom="16dp"android:paddingLeft="16dp"android:paddingRight="16dp"android:paddingTop="8dp"android:text="微博："android:textSize="15sp" /></LinearLayout><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:padding="16dp"android:text="博\n尔\n赫\n斯\n书\n店"android:textColor="@android:color/white"android:textSize="34sp"android:textStyle="bold" />
</RelativeLayout>
复制代码

App 效果如图所示。

这个 App 虽然非常简单，但也有几点需要注意的基础知识点。

1. 文字要重叠在图片之上，所以 TextView 要放在 ImageView 的下面。最先放上的 Views 在最底层，依次层叠。
2. 在 ImageView 中，图片 borgesbookshop 需要放在 drawable 目录中，在 Android Studio 左侧工程文件树中展开 res (resource)，右键 drawable 点击 "Reveal in Finder" 即可跳到 drawable 目录。注意文件名只能是小写字母或数字，不能出现大写字母或符号。
3. ImageView 的宽度和高度设置为 "wrap_content" 时，在手机等小屏设备上可能能占满屏幕，但对于平板等大屏设备仍然会在屏幕上显示大片空白，所以 ImageView 的宽度和高度建议设置为 "match_parent"，并与 centerCrop 配合使用。
4. 对于一些由更高的 API 支持的属性，例如 fontFamily 属性只能在 API 16 以上的版本使用，这种情况下，运行在 API 15 或以下的设备不受影响，运行 API 16 或以上的设备对属性有效。
5. 对于新手，每完成一步都运行 App 到手机进行验证是一个良好的习惯。