Android开发8：UI组件TextView,EditText,Button

2023-02-20 07:21:45

版本：Android4.3 API18 学习整理：liuxinming

TextView

概述

TextView直接继承了View(EditText、Button两个UI组件类的父类)

TextView还派生了一个CheckedTextView,CheckedTextView增加了一个checked状态

可以通过setChecked(boolean)和isChecked()方法来改变、访问该组件的checked状态

还可以通过setCheckMarkDrawable()方法来设置它的勾选图标。

TextView类及子类的类图

XML属性

TextView提供了大量的XMl属性，这些XML属性大部分也适用于它的子类(EditText,Button等)

具体XML属性参考

http://developer.android.com/reference/android/widget/TextView.html

EditText

概述

EditText 与 TextView非常相似，它与TextView公用了绝大部分XML属性和方法。

和TextView区别：EditText可以接受用户输入

子类

从上面类图关系可以看出，EditText派生了两个子类

1、AutoCompleteTextView ：带有自动完成功能的EditText，该类通常要与Adapter结合使用。

2、ExtractEditText ：它并不是UI组件，而是EditText组件的底层服务类，负责提供全屏输入法支持。

奉上测试案例：用户输入界面

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:stretchColumns="1"

    >

    <TableRow>

        <TextView

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:text="用户名:"

            android:textSize="16sp"

            />

        <EditText

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:hint="请填写登录账户"

            android:selectAllOnFocus="true"

            />

    </TableRow>

    <TableRow>

        <TextView

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:text="密码:"

            android:textSize="16sp"

            />

        <!-- android:inputType="numberPassword" 表明只能接受数字密码 -->

        <EditText

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:inputType="numberPassword"

            />

    </TableRow>

    <TableRow >

        <TextView

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:text="年龄:"

            android:textSize="16sp"

            />

        <EditText

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:inputType="number"

            />

    </TableRow>

    <TableRow >

        <TextView

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:text="生日:"

            android:textSize="16sp"

            />

        <EditText

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:inputType="date"

            />

    </TableRow>

    <TableRow >

        <TextView

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:text="电话号码:"

            android:textSize="16sp"

            />

        <EditText

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:hint="请填写您的电话号码"

            android:selectAllOnFocus="true"

            android:inputType="phone"

            />

    </TableRow>

    <Button

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="注册"

        />

</TableLayout>

调试效果：

Button

概述

根据上述类图关系可以看出Button继承了TextView类，它主要是在UI界面上生成一个按钮，该按钮可以提供用户单击

当用户单击时，按钮会触发一个onClick事件

可以通过android:background属性为按钮增加背景颜色和图片

RadioButton,CheckBox

RadioButton CheckBox ToggleButton(状态开关按钮) Switch(开关) 继承了Button类，因此可以使用Button支持的各种属性和方法

RadioButton CheckBox 它们多了一个可选中的功能，因此都可额外指定一个android:checked属性，用于指定初始时是否被选中

RadioButton 只能选中一个类似 HTML 中的 <input type="radio" 单选框表单

CheckBox 可以选中多个类似 HTML 中的 <input type="checkbox" 复选框

单选按钮、复选框实例

XML布局

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:stretchColumns="1"

    >

    <TableRow >

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="性别:"

            android:textSize="16sp"

            />

        <!-- 这里定义一组单选按钮 -->

        <RadioGroup android:id="@+id/button01"

            android:orientation="horizontal"

            android:layout_gravity="center_horizontal"

            >

        	<!-- 定义两个单选按钮 -->

        	<RadioButton android:id="@+id/boy"

        	    android:layout_width="wrap_content"

        	    android:layout_height="wrap_content"

        	    android:text="男"

        	    android:checked="true"

        	    />

        	<RadioButton android:id="@+id/gril"

        	    android:layout_width="wrap_content"

        	    android:layout_height="wrap_content"

        	    android:text="女"

        	    />

        </RadioGroup>

    </TableRow>

    <TableRow >

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="喜欢的美女"

            android:textSize="16sp"

            />

        <!-- 定义一个垂直的线性布局 -->

        <LinearLayout android:layout_gravity="center_horizontal"

            android:orientation="vertical"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            >

        	<!-- 定义三个复选框 -->

            <CheckBox android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="大S"

                android:checked="true"

                />

           <CheckBox android:layout_width="wrap_content"

               android:layout_height="wrap_content"

               android:text="小S"

               />

        </LinearLayout>

    </TableRow>

    <TextView

        android:id="@+id/show"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        />

</TableLayout>

java代码

package com.example.edittext;

import android.os.Bundle;

import android.app.Activity;

import android.view.Menu;

import android.widget.RadioGroup;

import android.widget.RadioGroup.OnCheckedChangeListener;

import android.widget.TextView;

public class MainActivity extends Activity {

	RadioGroup button01;

	TextView show;

	@Override

	protected void onCreate(Bundle savedInstanceState) {

		super.onCreate(savedInstanceState);

		setContentView(R.layout.activity_main);

		//获取界面上button01,show两个组件对象

		button01 = (RadioGroup) findViewById(R.id.button01);

		show = (TextView) findViewById(R.id.show);

		//为RadioGroup组件的OnCheck事件绑定事件监听器

		button01.setOnCheckedChangeListener(new OnCheckedChangeListener()

		{

			@Override

			public void onCheckedChanged(RadioGroup group, int checkedId) {

				// TODO Auto-generated method stub

				//根据用户勾选的单选按钮来动态改变tip字符串的值

				String tip = checkedId == R.id.boy ? "男人":"女人";

				//修改 show 组件中的文本

				show.setText(tip);

			}

		});

	}

	@Override

	public boolean onCreateOptionsMenu(Menu menu) {

		// Inflate the menu; this adds items to the action bar if it is present.

		getMenuInflater().inflate(R.menu.main, menu);

		return true;

	}

}

效果

ToggleButton,Switch

ToggleButton,Switch通常用于切换程序中的某种状态

具体XML属性参考官方API

http://developer.android.com/reference/android/widget/Button.html

AnalogClock,DigitalClock

DigitalClock本身继承了TextView---也就是说它本身就是文本框，只是它里面显示的内容总是当前时间

AnalogClock继承了View组件，它重写了View的OnDraw方法，它会在View上绘制模拟时钟

区别：

DigitalClock显示数字时钟，可以显示当前的秒数

AnalogClock显示模拟时钟，不会显示当前秒数

Chronometer

Chronometer(计时器)，继承TextView,显示一段文本，但它不显示当前时间，显示从某个起始时间开始，一共过去了多长时间

提供了一个android:format 属性，用于指定计时器的计时格式。

支持常用方法

1、setBase(long base) ：设置计时器的起始时间

2、setFormat(String format)：设置显示时间格式

3、start()：开始计时

4、stop()：停止计时

5、setOnChronometerTickListener(Chronometer.OnChronometerTickListenerlistener)：为计时器绑定事件监听器，当计时改变时触发该监听器。

具体用法参考官方API：

http://android.toolib.net/reference/android/widget/Chronometer.html

欢迎Android , php 同学加群 QQ ：224784042 交流

学习的结果，依靠于每天的持之以恒！！不是特忙，特加班情况，会每天更新一篇Android学习笔记，欢迎大家互相交流，学习，共同进步。

偶菜鸟一枚！！！！！！

晚安！

码农公寓