初探Activity2:添加简单的UI控件

原创 2016年05月31日 13:40:34

Activity是用来展示界面的,所以在继续了解Activity的知识之前,还是应该先了解一下如何在Activity中添加简单的UI控件。上一节那个Button按钮,我是通过界面编辑器的“Design”面板直接拖拉进去的,代码是直接生成的。这一节,就通过代码的方式,来给Activity添加一些简单的UI控件。

参考资料

如果要更加深入,可以看CodePath Android Cliffnotes的“Views and Layouts”那一部分的内容。

这节了解的UI控件

View 控件
TextView 文本
Button 按钮
EditText 文本编辑框
ImageView 图片

View和ViewGroup?

在了解UI控件之前,我们首先要知道Android中的“View和ViewGroup”。
这里写图片描述
看上面这个图,Android的图形用户界面是通过上图View和ViewGroup对象这样的层级关系来构建的。View对象通常就是像Button、TextView这样的UI控件。而ViewGroup对象则是一些你看不见的“视图容器”,它定义了它所包含的那些View子元素是怎样布局的,例如是网格列表又或者是垂直列表。

Android中用XML文件对应View和ViewGrop的子类,因此可以用XML来定义一系列UI元素的层级。

另外要注意,看下面官方文档的截图,ViewGroup是View的子类。

具体的View和ViewGroup?

View或ViewGroup 常见的具体元素
View Button、TextView、EditText……
ViewGroup RelativeLayout、LinearLayout、FrameLayout……

截取官方文档:
View
这里写图片描述

从上面的内容,我们知道应该是ViewGroup这个看不见的“容器”包含View子元素。
就是例如LinearLayout中包含着Button、TextView、EditText等等,
所以我们接下来就学习一下,怎么创建LinearLayout,怎么添加Button、EditText等等控件到LinearLayout中。

创建一个LinearLayout

1.在AndroidStudio的”res/layout”目录中,新建或打开一个layout布局xml文件。这里可以用自动生成的”activity_main.xml”文件来测试。
2.上一节是直接通过“所见即所得”的预览编辑窗口来添加界面元素的,现在选择编辑窗口底部“Design|Text”中的“Text”来通过代码直接编辑界面。
3.直接把原来的代码删掉,把下面的代码贴到进去。

<?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:orientation="horizontal">

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button2"
        android:layout_gravity="center_vertical" />

</LinearLayout>

4.来说明一下:
LinearLayout是指定通过”android:orientation”属性,把它里面的子View元素(Button、TextView这些)按照水平或者垂直方向排列的view group(ViewGroup的子类)。

另外”android:layout_width”和”android:layout_height”这两个属性则是所有View元素(也就包括ViewGroup了)都必须指定的,用于指定它们的大小。

因为现在这个LinearLayout是这个layout布局的根View,所以它应该填充满整个屏幕,这里是通过“match_parent”给宽高来设置。“match_parent”意思就是这个View应该扩充它的宽或高去匹配它父View的宽或高。

For more information about layout properties, see the Layout guide.
更多关于layout布局参数的信息,可以看官方文档的介绍:Layout API Guide

添加一个EditText

1.还是在刚才操作的那个layout文件,我这里就是”activity_main.xml”。在<LinearLayout>标签里面,定义一个<EditText>,并且把它的id设置为@+id/edit_message
2.定义”layout_width” 和”layout_height”属性为”wrap_content”。
3.定义一个hint属性,并为它赋值一个名为“edit_message”的字符串对象。
最后就是下面这个样子:

<EditText android:id="@+id/edit_message"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:hint="@string/edit_message" />

下面来解释一下刚才所设置的属性:

  • android:id
    这个属性为View控件提供了一个唯一的id,这样你就可以在app的代码中使用这个控件对象的引用,例如去读取并操作这个对象。(之后会有这部分内容)

The at sign (@) is required when you’re referring to any resource object from XML. It is followed by the resource type (id in this case), a slash, then the resource name (edit_message).

当你从XML中”@”符号 refer to

The plus sign (+) before the resource type is needed only when you’re defining a resource ID for the first time. When you compile the app, the SDK tools use the ID name to create a new resource ID in your project’s gen/R.java file that refers to the EditText element. With the resource ID declared once this way, other references to the ID do not need the plus sign. Using the plus sign is necessary only when specifying a new resource ID and not needed for concrete resources such as strings or layouts. See the sidebox for more information about resource objects.

  • android:layout_width和android:layout_height

  • android:hint

[未完待续]

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

跟着Innost理解下与Activity相关的UI控件系统

Android的控件系统封装了: · 测量各个UI元素(一段文字、一个图片)的显示尺寸与位置。 · 对各个UI元素进行布局计算与绘制。 · 当显示内容需要发生变化时进行重绘。出于效率考虑,...

Android—开发自学历程(1)-Activity(4)-UI控件

一款软件最重要的是什么?不同的人有不同的理解。对于程序员来说,如何实现一个功能而且不出bug才是重点,然而对于用户来说,功能对于他们而言他不应该是基本么,他们有时更加看重一款软件的界面,因为如果一款软...

android实现UI控件自动注入到Activity

在写android程序里要获取UI控件,我们都必须在Activity通过findViewById()来获取各个UI控件。当然有很多第三方的框架都帮我们简化了这个操作(具体的不在这里介绍了),但本人都觉...

让Activity UI普通控件具有弹性效果(一)

一、定义监听器 package test.xzy.com.test1.listener; import android.graphics.Rect; import android.view.Moti...

Android L 新增UI控件:RecyclerView CardView的简单使用

源码下载:https://github.com/qyxxjd/RecyclerViewDemo RecyclerView: RecyclerView用来替代ListView,更好的性能而且...

ios UI控件的简单整理

把该文件复制到.m文件里就能够方便的查找/** 匿名类目:可以声明方法和变量,属性为private(不允许在外部调用,且不能被继承 */ /** 发送数据的委托方,接收数据的时代理发(即代理的反...

UI控件 简单

一 UILable:仅仅只能用来显示文字,可以设置不同的颜色,字体,大小等 通过双击可以设置文字的显示 代码创建lable   UIlable *lable=[[UILable alloc]in...

jquery demo - jquery ui 日期控件简单应用

jquery ui 是jquery官方提供的ui插件, 提供了许多功能强大, 漂亮实用的ui工具.  今日研究了一下里面的日期控件, 在此与大家分享: 先看效果:   html代码: ...

iOS开发UI篇—Date Picker和UITool Bar控件简单介绍

一、Date Picker控件 1.简单介绍: Date Picker显示时间的控件 有默认宽高,不用设置数据源和代理 如何改成中文的? (1)查看当前系统是否为中文的,把模拟器改成是中...

iOS开发UI篇—UITableview控件简单介绍

iOS开发UI篇—UITableview控件简单介绍 一、基本介绍 在众多移动应⽤用中,能看到各式各样的表格数据 。 在iOS中,要实现表格数据展示,最常用的做法就是使用UI...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)