Android学习笔记 2.3.1 文本框TextView和编辑框EditText的功能和用法

Android学习笔记

疯狂Android讲义

第2章 Android 应用的界面编程

2.3 第2组 UI组件：TextView及其子类

“九层之台，起于累土”——无论看上去多么美观的UI界面，开始都是先创建容器（ViewGroup的实例)，然后不断地向容器中添加界面组件，最后形成一个美观的UI 界面的。

2.3.1 文本框TextView和编辑框EditText的功能和用法

TextView直接继承了View，它还是EditText、Button两个UI组件类的父类。TextView的作用就是在界面上显示文本。

从功能上来看，TextView其实就是一个文本编辑器，只是Android关闭了它的文字编辑功能。如果开发者想要定义一个可编辑内容的文本框，则可以使用它的子类: EditText，EditText 允许用户编辑文本框中的内容。

TextView还派生了一个 CheckedTextView，CheckedTextView增加了一个 checked 状态，开发者可通过setChecked(boolean)和 isChecked()方法来改变、访问该组件的checked 状态。除此之外，该组件还可通过setCheckMarkDrawable()方法来设置它的勾选图标。

TextView及其子类的类图：

TextView和 EditText具有很多相似之处，它们之间的最大区别在于TextView不允许用户编辑文本内容，而 EditText则允许用户编辑文本内容。

TextView支持的XML属性及相关方法

实例——功能丰富的文本框

创建新项目

布局文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:drawableEnd="@mipmap/ic_launcher"
        android:text="我爱Android"
        android:textSize="20pt" />

    
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ellipsize="middle"
        android:singleLine="true"
        android:text="我爱Java我爱Java我爱Java我爱Java我爱Java我爱Java"
        android:textAllCaps="true"
        android:textSize="20sp" />

    
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:autoLink="email|phone"
        android:singleLine="true"
        android:text="邮件是111111111@163.com,电话是18700000000" />

    
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:shadowColor="#00f"
        android:shadowDx="10.0"
        android:shadowDy="8.0"
        android:shadowRadius="3.0"
        android:text="测试文字"
        android:textColor="#f00"
        android:textSize="18pt" />

    <CheckedTextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:checkMark="@drawable/ok"
        android:text="可勾选的文本" />

    
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/bg_border"
        android:text="带边框的文本"
        android:textSize="24pt" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/bg_border2"
        android:text="圆角边框、渐变背景的文本"
        android:textSize="24pt" />

LinearLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66

bg_border.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android">
   
   <solid android:color="#0000"/>
   
   <stroke android:width="2dp" android:color="#f00" />
shape>
1
2
3
4
5
6
7

bg_border2.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
      android:shape="rectangle">
   
   <corners android:topLeftRadius="20dp"
      android:topRightRadius="10dp"
      android:bottomRightRadius="20dp"
      android:bottomLeftRadius="10dp"/>
   
   <stroke android:width="4px" android:color="#f0f" />
   
   <gradient android:startColor="#f00"
      android:centerColor="#0f0"
      android:endColor="#00f"
      android:type="sweep"/>
shape>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

运行效果

解释

• 第1个TextView指定android;textSize=“20pt”，这就指定了字号为20pt。而且指定了在文本框的结尾处绘制图片。
• 第2个TextView指定 android:ellipsize=“middle” ,这就指定了当文本多于文本框的宽度时，从中间省略文本。而且指定了android:textAllCaps=“true”，表明该文本框的所有字母大写。
• 第3个TextView指定android:autoLink=“emailphone”，这就指定了该文本框会自动为文本框内的 E-mail地址、电话号码添加超链接。
• 第4个TextView指定一系列 android:shadowXXX属性，这就为该文本框内的文本内容添加了阴影。
• 第5个CheckedTextView指定android:checkMark=“@drawable/ok”，这就指定了该可勾选文本框的勾选图标。
• 第6个TextView指定了背景，背景是由XML文件定义的,将该文件放在drawable文件夹内，该XML文件也可被当成 Drawable使用。
• 第7个TextView使用 Drawable指定使用圆角边框、渐变背景。第二个文本框所指定的背景也是由XML 文件定义的，将该文件放在 drawable文件夹内，该XML 文件也可被当成Drawable使用。

这些属性同样适用于EditText和Button。

2.3.2 EditText的功能和用法

EditText 与 TextView的最大区别在于:EditText可以接受用户输入。

EditText组件最重要的属性是 inputType，该属性相当于HTML 的元素的type属性，用于将EditText设置为指定类型的输入组件。inputType能接受的属性值非常丰富,而且随着Android版本的升级，该属性能接受的类型还会增加。

EditText 还派生了如下两个子类：

• AutoCompleteTextView:带有自动完成功能的 EditText。
• ExtractEditText:它并不是UI组件，而是EditText组件的底层服务类，负责提供全屏输入法支持。

布局

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:stretchColumns="1">
    <TableRow android:paddingStart="20dp"
        android:paddingEnd="20dp" >
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="用户名:"
            android:textSize="16sp"/>
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="请填写登录账号"
            android:selectAllOnFocus="true"/>
    TableRow>
    <TableRow android:paddingStart="20dp"
        android:paddingEnd="20dp">
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="密码:"
            android:textSize="16sp"/>
        
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="numberPassword"/>
    TableRow>
    <TableRow android:paddingStart="20dp"
        android:paddingEnd="20dp">
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="年龄："
            android:textSize="16sp"/>
        
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="number"/>
    TableRow>
    <TableRow android:paddingStart="20dp"
        android:paddingEnd="20dp">
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="生日："
            android:textSize="16sp"/>
        
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="date"/>
    TableRow>
    <TableRow android:paddingStart="20dp"
        android:paddingEnd="20dp">
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="电话号码:"
            android:textSize="16sp"/>
        
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="请填写您的电话号码"
            android:selectAllOnFocus="true"
            android:inputType="phone"/>
    TableRow>
    <Button
        android:layout_marginStart="20dp"
        android:layout_marginEnd="20dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="注册"/>
TableLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79

直接运行