AS边学边写——day03简单的用户界面

简单的用户界面

Android的图形用户界面是由多个View和ViewGroup构建出来的。View是通用的UI窗体小组件，比如按钮(Button)或者文本框(text field)，而ViewGroup是不可见的，是用于定义子View布局方式的容器，比如网格部件(grid)和垂直列表部件(list)。

关于布局，我们应该分别为小屏幕，大屏幕创建不同不同的xml文件，方便兼容不同屏幕设备

1.创建一个线性布局(LinearLayout)

在project面板找到layout文件夹的activity_my.xml(在project视图app/src/main/res/layout文件夹下或者Android视图res/layout/，为方面以后直接给出相对路径，如：res/layout/activity_my.xml

1.把根标签（相对布局）RelativeLayout改为LinearLayout，注意：没改的话属性android:orientation="horizontal"无法在相对布局生效。只需改开始标签，结束标签会自动修改

2.删掉多余代码android:padding 属性和tools:context 属性

android:paddingLeft="@dimen/activity_horizontal_margin  android:paddingRight="@dimen/activity_horizontal_margin"android:paddingTop="@dimen/activity_vertical_margin"android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".Helloworld"

3.删掉TextView 标签（这是一个显示的文字标签）

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

4.添加android:orientation="horizontal"。android:orientation设置布局的方向，horizontal水平，vertical垂直

完成后的res/layout/activity_my.xml如下：

<LinearLayout 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"android:orientation="vertical">

代码解释

1.属性xmlns:android和xmlns:tools都是安卓的命名空间

2.属性android:layout_width和android:layout_height，设定布局的宽和高，其值match_parent表示会匹配父标签的width和height。在这里因为LinearLayout是根标签（父标签），所以其宽和高都应充满整个屏幕的

2.添加一个文本输入框(EditText)

1.打开res/layout/activity_my.xml，在根标签LinearLayout下添加<EditText>,其宽高值为wrap_parent。注意：wrap_parent只会占据内容大小的空间，如果这里换成match_parent，EditText将会布满整个屏幕，因为match_parent适配了父标签LinearLayout的布局大小。当然你也可以直接宽高的数值（新手不建议）

2.在<EditText>添加android:id="@+id/edit_message"属性，为以后传值做准备。id属性是每个View的唯一标识符，通过该标识符对对象进行引用，例如传值，修改等。@表示对xml文件资源对象的引用。+号是第一次定义创建一个资源id，只要创建id后，其他资源如果引用这个ID就不再需要+号了。+号后面是资源的类型(这里是id)，最后是资源的名字(这里使用的是edit_message)。（ps:资源的名字edit_message会在R.java文件创建一个标识符，然后与EditText标签关联起来。关于R.java，因为du0m0是初学者，在as暂时找不到在哪，同时也不了解其工作原理，请大神们帮忙解答，谢谢。同时借用coder-pig老师的话)

R.java文件:由aapt工具根据App中的资源文件自动生成,可以理解为资源字典

3.在<EditText>添加android:hint="@string/edit_message"属性。android:hint属性提供可描述输入字段预期值的提示信息，提示会在输入字段为空时显示,并会在字段获得焦点时消失。属性值@string/edit_message引用values/strings.xml文件下名称为edit_message的String类型的值。在这里现在会出现红字错误（编译错误），因为values/strings.xml文件下，并不存在这个edit_message字符串资源。

4.创建edit_message字符串资源。打开values/strings.xml，首先删掉多余语句<string name="hello_world">Hello world!</string>

5.添加<string name="edit_message">编辑信息</string>。编辑信息就是输入提示框显示的信息。顺带地为按钮Button添加一个的字符串资源（稍后使用）<string name="button_send">发送</string>

完成后的values/strings.xml代码：

<resources><string name="app_name">Helloworld</string><string name="edit_message">编辑信息</string><string name="button_send">发送</string><string name="action_settings">Settings</string></resources>

完成后的res/layout/activity_my.xml如下

<LinearLayout 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"android:orientation="horizontal"><EditText    android:id="@+id/edit_message"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:hint="@string/edit_message"/></LinearLayout>

注意：你也可以不引用资源，在res/layout/activity_my.xml中，直接添加输出的语句，例如android:hint="编辑信息"（但不建议）

原因

当你在用户界面定义一个文本的时候，你应该把每一个文本字符串列入资源文件。这样做的好处是：对于所有字符串值，字符串资源能够单独的修改，在资源文件里你可以很容易的找到并且做出相应的修改。通过选择定义每个字符串，还允许您对不同语言本地化应用程序。

注意：字符串资源与id使用了相同的名称（edit_message）。然而，对于资源的引用是区分类型的（比如id和字符串），因此，使用相同的名称不会引起冲突。

3.添加一个按钮

1.打开res/layout/activity_my.xml在<EditText>后根目录<LinearLayout>内，添加<Button>宽高为wrap_content

2.添加android:text="@string/edit_send"属性。android:text显示文本信息。其值@string/edit_send因为之前在values/strings.xml定义了，所以会出现在代码候选提示

顺带地为按钮Button添加一个的字符串资源（稍后使用）<string name="button_send">发送</string>

完成后的res/layout/activity_my.xml如下

<LinearLayout 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"android:orientation="horizontal"><EditText    android:id="@+id/edit_message"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:hint="@string/edit_message"/><Button    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:text="@string/button_send" /></LinearLayout>

4.调整输入框大小

1.打开res/layout/activity_my.xml，添加android:layout_weight="1"，修改layout_width值为0dp

完成后的res/layout/activity_my.xml如下

<LinearLayout 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"android:orientation="horizontal"><EditText    android:id="@+id/edit_message"    android:layout_weight="1"    android:layout_width="0dp"    android:layout_height="wrap_content"    android:hint="@string/edit_message"/><Button    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:text="@string/button_send" /></LinearLayout>

代码解释

1.android:layout_weight权重。

权重的值指的是每个部件所占剩余空间的大小，该值与同级部件所占空间大小有关。就类似于饮料的成分配方：“两份伏特加酒，一份咖啡利口酒”，即该酒中伏特加酒占三分之二。例如，我们设置一个View的权重是2，另一个View的权重是1，那么总数就是3，这时第一个View占据2/3的空间，第二个占据1/3的空间。如果你再加入第三个View，权重设为1，那么第一个View(权重为2的)会占据1/2的空间，剩余的另外两个View各占1/4。(请注意，使用权重的前提一般是给View的宽或者高的大小设置为0dp，然后系统根据上面的权重规则来计算View应该占据的空间。但是很多情况下，如果给View设置了match_parent的属性，那么上面计算权重时则不是通常的正比，而是反比，也就是权重值大的反而占据空间小)。

对于所有的View默认的权重是0，如果只设置了一个View的权重大于0，则该View将占据除去别的View本身占据的空间的所有剩余空间。因此这里设置EditText的权重为1，使其能够占据除了按钮之外的所有空间。

注意：因为du0m0之前设置的布局是android:orientation="horizontal"水平的，所以只能设置android:layout_width="0dp"，若设置android:layout_height="0dp"会报错。如果之前是android:orientation="vertical"，则相反。

---

从day03开始看的朋友们，初次见面，我是du0m0。这是我正式踏入安卓编程的第一篇文章，呈献给大家，不知大家觉得如何。如果能够喜欢我会感到万分荣幸。这里列举的每行代码，我基本都有写自己的理解，也不知道是否正确。不过我相信还是有很多不足的地方，请大家多多指正。现在du0m0还不会正确使用Markdown，特别是不会设置代码块，请大家帮忙解答，让小弟早日更正。目前的文章都是取材于google的文档，再加上coder-pig老师，IT_xiao小巫老师的教程。再次感谢coder-pig老师，IT_xiao小巫老师。

那么，期待下次见面。