Android开发入门之学习笔记（三）：程序窗口的布局

Android应用程序的用户界面能够看做是由View和View Group组成的，从字面意思上就能够看出，View Group是能够包含多个View的。借用官方教程的图能够更容易理解：

说到这里，咱们尚未解释，何为View？其实就是咱们所看到的按钮、文本编辑框之类的。换句话说，View是一些用户能够看得见的窗口小部件，而ViewGroup则是用户看不见的，它的做用是更好的组织和布局View。

因为咱们是初学者，因此能够简单的来概括一下：

Android应用程序经过 res/layout目录下的一个XML文件（activity_main.xml）来配置和管理程序窗口的布局。固然，一个Android应用程序可能有多个程序窗口，每一个程序窗口都会有一个XML文件来管理它的界面布局。每一个XML文件的名称可能不同。咱们这里讨论的是最简单的Android程序，它是由ADT自动生成的只有一个程序窗口的程序，因此它的布局文件也只有一个：activity_main.xml。

若是使用ADT工程，自动产生一个最简单的Android应用程序工程，其默认布局的内容大体以下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="@string/hello_world" />

</RelativeLayout>

咱们精简一下这个XML文件可能看起来会更容易一些：

<RelativeLayout>

    <TextView
              />

</RelativeLayout>

这个XML文件有两个元素，分别是RelativeLayout和TextView，其中RelativeLayout就是一个ViewGroup，而TextView就是一个View。这个TextView包含在RelativeLayout之中。咱们结合着程序在手机上的实际运行效果看：

除了程序上方的标题栏以外，整个程序窗口一片空白，只有中间有一行文字信息：Hello world!。

这种效果就是TextView居中显示在整个屏幕的中央。须要注意的是，TextView是包裹在RelativeLayout之中的。因此，确切的说，应该是这个程序窗口中有一个RelativeLayout，它占据了所有的屏幕，而它里面又包含了一个TextView，这个TextView位于RelativeLayout的中央（即屏幕的中央）。因此最终，咱们只看到了一个TextView（它没有边框）。

咱们回过头来，再看看activity_main.xml文件。

首先，咱们仅看RelativeLayout的属性：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

这五个属性中，咱们只看其中最简单的两个（谁让咱是初学者呢，更多的咱也看不懂）：android.layout_width和android.layout_height。它们分别指定了RelativeLayout的宽度和高度。它们都使用的是match_parent这个值。查金山词霸能够得知，match_parent的意思是“适应父亲”。其实，就是让RelativeLayout伸展到包含它的上级View的大小。而这个上级View就是这个程序的窗口了（由于RelativeLayout已是根元素了）。这样，RelativeLayout就占据了当前这个程序屏幕的所有。

再来看看RelativeLayout中包含的那一个TextView，它也有五个属性：

<TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="@string/hello_world" />

属性中的android:layout_width和android:layout_height咱们已经知道，分别表示的是宽度和高度了。可是，这里使用的值不同，是wrap_content。仍是金山词霸，wrap是包裹、缠绕、盘绕的意思，content是（书的）内容的意思，咱们意译就是包裹文字内容，以文字内容为大小，换句话说，TextView里的文本信息占据多大的空间，TextView就多大。

这里咱们能够试着把wrap_content换成match_parent，如下是实际效果：

 

初一看，难于理解，为何Hello world!会出如今左上角？个人分析是，由于咱们让TextView扩充到了RelativeLayout的所有大小，这样，其中的文字就只是一部份内容了，那么按照惯例，文字就是居左上对齐的。

android:layout_centerHorizontal和android:layout_centerVertical这两个属性，从字面意思上就能够理解了，一个是水平居中，一个是垂直居中。值的选择，要么是true，要么是false。

这里我作了个试验，不论宽度和高度设置为match_parent仍是wrap_content，居中不居中，效果都与上图是同样的，Hello world!居左上角显示。原理稍稍想一想就明白了，这里就再也不罗嗦了。

最后，讲一个比较重要的属性，这个一次还讲不完，之后还会补充。

TextView有一个属性是android:text="@string/hello_world"。注意，这里是hello_world，两个单词之间是有一个下划线的，不是最终手机屏幕上面显示的那个Hello world!。简单的讲，这里是将TextView要显示的内容定义成了一个字符串，它的名字是hello_world，而TextView真正要显示的是这个字符串的值。那么这个字符串的值又在何处呢？

在res/values目录下有一个strings.xml文件，答案就在这里。

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">My Temp App</string>
    <string name="hello_world">Hello world!</string>
    <string name="menu_settings">Settings</string>

</resources>

分析这个文件，在<resources>元素中包含有三个<string>元素，它们都有一个名字，还有一个值。相信你们一看就明白了。咱们程序中显示的字符串信息都在这里定义了，包括程序的名字，屏幕上显示的字符串，还有菜单键里显示的菜单名。

既然咱们找到了hello_world，那么咱们能够简单试验一下，只要修改Hello world!为别的信息就能够了：

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">My Temp App</string>
    <string name="hello_world">这是个人第一个Android程序！</string>
    <string name="menu_settings">Settings</string>

</resources>

实际效果以下图所示：

 

OK，这一次笔记就到此吧，这篇博文够长了^0^