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

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组件的底层服务类,负责提供全屏输入法支持。

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

[html][/html] view plaincopy

  1. <TableLayout xmlns:android=”http://schemas.android.com/apk/res/android”
  2.     android:orientation=”vertical”
  3.     android:layout_width=”fill_parent”
  4.     android:layout_height=”fill_parent”
  5.     android:stretchColumns=”1″
  6.     >
  7.     <TableRow>
  8.         <TextView
  9.             android:layout_width=”fill_parent”
  10.             android:layout_height=”wrap_content”
  11.             android:text=”用户名:”
  12.             android:textSize=”16sp”
  13.             />
  14.         <EditText
  15.             android:layout_width=”fill_parent”
  16.             android:layout_height=”wrap_content”
  17.             android:hint=”请填写登录账户”
  18.             android:selectAllOnFocus=”true”
  19.             />
  20.     </TableRow>
  21.     <TableRow>
  22.         <TextView
  23.             android:layout_width=”fill_parent”
  24.             android:layout_height=”wrap_content”
  25.             android:text=”密码:”
  26.             android:textSize=”16sp”
  27.             />
  28.         <!– android:inputType=”numberPassword” 表明只能接受数字密码 –>
  29.         <EditText
  30.             android:layout_width=”fill_parent”
  31.             android:layout_height=”wrap_content”
  32.             android:inputType=”numberPassword”
  33.             />
  34.     </TableRow>
  35.     <TableRow >
  36.         <TextView
  37.             android:layout_width=”fill_parent”
  38.             android:layout_height=”wrap_content”
  39.             android:text=”年龄:”
  40.             android:textSize=”16sp”
  41.             />
  42.         <EditText
  43.             android:layout_width=”fill_parent”
  44.             android:layout_height=”wrap_content”
  45.             android:inputType=”number”
  46.             />
  47.     </TableRow>
  48.     <TableRow >
  49.         <TextView
  50.             android:layout_width=”fill_parent”
  51.             android:layout_height=”wrap_content”
  52.             android:text=”生日:”
  53.             android:textSize=”16sp”
  54.             />
  55.         <EditText
  56.             android:layout_width=”fill_parent”
  57.             android:layout_height=”wrap_content”
  58.             android:inputType=”date”
  59.             />
  60.     </TableRow>
  61.     <TableRow >
  62.         <TextView
  63.             android:layout_width=”fill_parent”
  64.             android:layout_height=”wrap_content”
  65.             android:text=”电话号码:”
  66.             android:textSize=”16sp”
  67.             />
  68.         <EditText
  69.             android:layout_width=”fill_parent”
  70.             android:layout_height=”wrap_content”
  71.             android:hint=”请填写您的电话号码”
  72.             android:selectAllOnFocus=”true”
  73.             android:inputType=”phone”
  74.             />
  75.     </TableRow>
  76.     <Button
  77.         android:layout_width=”wrap_content”
  78.         android:layout_height=”wrap_content”
  79.         android:text=”注册”
  80.         />
  81. </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布局
[html][/html] view plaincopy

  1. <TableLayout xmlns:android=”http://schemas.android.com/apk/res/android”
  2.     android:orientation=”vertical”
  3.     android:layout_width=”fill_parent”
  4.     android:layout_height=”fill_parent”
  5.     android:stretchColumns=”1″
  6.     >
  7.     <TableRow >
  8.         <TextView
  9.             android:layout_width=”wrap_content”
  10.             android:layout_height=”wrap_content”
  11.             android:text=”性别:”
  12.             android:textSize=”16sp”
  13.             />
  14.         <!– 这里定义一组单选按钮 –>
  15.         <RadioGroup android:id=”@+id/button01″
  16.             android:orientation=”horizontal”
  17.             android:layout_gravity=”center_horizontal”
  18.             >
  19.             <!– 定义两个单选按钮 –>
  20.             <RadioButton android:id=”@+id/boy”
  21.                 android:layout_width=”wrap_content”
  22.                 android:layout_height=”wrap_content”
  23.                 android:text=”男”
  24.                 android:checked=”true”
  25.                 />
  26.             <RadioButton android:id=”@+id/gril”
  27.                 android:layout_width=”wrap_content”
  28.                 android:layout_height=”wrap_content”
  29.                 android:text=”女”
  30.                 />
  31.         </RadioGroup>
  32.     </TableRow>
  33.     <TableRow >
  34.         <TextView
  35.             android:layout_width=”wrap_content”
  36.             android:layout_height=”wrap_content”
  37.             android:text=”喜欢的美女”
  38.             android:textSize=”16sp”
  39.             />
  40.         <!– 定义一个垂直的线性布局 –>
  41.         <LinearLayout android:layout_gravity=”center_horizontal”
  42.             android:orientation=”vertical”
  43.             android:layout_width=”wrap_content”
  44.             android:layout_height=”wrap_content”
  45.             >
  46.             <!– 定义三个复选框 –>
  47.             <CheckBox android:layout_width=”wrap_content”
  48.                 android:layout_height=”wrap_content”
  49.                 android:text=”大S”
  50.                 android:checked=”true”
  51.                 />
  52.            <CheckBox android:layout_width=”wrap_content”
  53.                android:layout_height=”wrap_content”
  54.                android:text=”小S”
  55.                />
  56.         </LinearLayout>
  57.     </TableRow>
  58.     <TextView
  59.         android:id=”@+id/show”
  60.         android:layout_width=”wrap_content”
  61.         android:layout_height=”wrap_content”
  62.         />
  63. </TableLayout>

java代码

[java][/java] view plaincopy

  1. package com.example.edittext;
  2. import android.os.Bundle;
  3. import android.app.Activity;
  4. import android.view.Menu;
  5. import android.widget.RadioGroup;
  6. import android.widget.RadioGroup.OnCheckedChangeListener;
  7. import android.widget.TextView;
  8. public class MainActivity extends Activity {
  9.     RadioGroup button01;
  10.     TextView show;
  11.     @Override
  12.     protected void onCreate(Bundle savedInstanceState) {
  13.         super.onCreate(savedInstanceState);
  14.         setContentView(R.layout.activity_main);
  15.         //获取界面上button01,show两个组件对象
  16.         button01 = (RadioGroup) findViewById(R.id.button01);
  17.         show = (TextView) findViewById(R.id.show);
  18.         //为RadioGroup组件的OnCheck事件绑定事件监听器
  19.         button01.setOnCheckedChangeListener(new OnCheckedChangeListener()
  20.         {
  21.             @Override
  22.             public void onCheckedChanged(RadioGroup group, int checkedId) {
  23.                 // TODO Auto-generated method stub
  24.                 //根据用户勾选的单选按钮来动态改变tip字符串的值
  25.                 String tip = checkedId == R.id.boy ? “男人”:”女人”;
  26.                 //修改 show 组件中的文本
  27.                 show.setText(tip);
  28.             }
  29.         });
  30.     }
  31.     @Override
  32.     public boolean onCreateOptionsMenu(Menu menu) {
  33.         // Inflate the menu; this adds items to the action bar if it is present.
  34.         getMenuInflater().inflate(R.menu.main, menu);
  35.         return true;
  36.     }
  37. }

效果

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

标签