Android输入控件经典—Input Controls【装】

浏览数：22 / 时间：2015年06月11日

输入控件是应用程序用户接口的一类交互式组件。Android系统提供了大量可供大家在UI中使用的输入控件，比如按钮、文本编辑空间、复选框、单选框以及各种对话框等。

基本输入控件

下面我们通过一个个人设置页面的例子讲解输入控件的基本用法。

先看界面效果，如图10-6所示。

技术分享

▲图10-6 控件示例界面

主界面main.xml

1. <?xml version="1.0" encoding="utf-8"?>

2. <LinearLayout

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

4. android:layout_width="fill_parent"

5. android:layout_height="fill_parent"

6. android:orientation="vertical"

7. android:background="#ffe8e8e8">

8. <LinearLayout

9. android:layout_width="fill_parent"

10. android:layout_height="wrap_content">

11. <TextView

12. android:id="@+id/textView1"

13. android:layout_width="wrap_content"

14. android:layout_height="wrap_content"

15. android:text="头像："

16. android:layout_gravity="center"

17. android:textColor="#000000"/>

18. <ImageView

19. android:id="@+id/ImageView1"

20. android:layout_width="100dp"

21. android:layout_height="100dp"

22. android:src="@drawable/sample" />

23. </LinearLayout>

24. <LinearLayout

25. android:layout_width="fill_parent"

26. android:layout_height="wrap_content">

27. <TextView

28. android:layout_width="wrap_content"

29. android:layout_height="wrap_content"

30. android:textColor="#000000"

31. android:text="姓名：" />

32. <EditText

33. android:id="@+id/editText1"

34. android:layout_width="wrap_content"

35. android:layout_height="wrap_content"

36. android:layout_weight="1" >

37. <requestFocus />

38. </EditText>

39. </LinearLayout>

40. <LinearLayout

41. android:layout_width="fill_parent"

42. android:layout_height="wrap_content">

43. <TextView

44. android:layout_width="wrap_content"

45. android:layout_height="wrap_content"

46. android:text="性别： "

47. android:textColor="#000000"

48. android:layout_gravity="center"/>

49. <RadioGroup

50. android:id="@+id/RadioGroup1"

51. android:layout_width="wrap_content"

52. android:layout_height="wrap_content"

53. android:orientation="horizontal">

54. <RadioButton

55. android:id="@+id/RadioButton1"

56. android:layout_width="wrap_content"

57. android:layout_height="wrap_content"

58. android:textColor="#000000"

59. android:text="男 "

60. android:checked="true"/>

61. <RadioButton

62. android:id="@+id/RadioButton2"

63. android:layout_width="wrap_content"

64. android:layout_height="wrap_content"

65. android:textColor="#000000"

66. android:text="女"/>　　

67. </RadioGroup>

68. </LinearLayout>

69. <LinearLayout

70. android:layout_width="fill_parent"

71. android:layout_height="wrap_content">

72. <TextView

73. android:layout_width="wrap_content"

74. android:layout_height="wrap_content"

75. android:text="爱好： "

76. android:textColor="#000000"

77. android:layout_gravity="center"/>

78. <CheckBox android:id="@+id/checkbox1"

79. android:layout_width="wrap_content"

80. android:layout_height="wrap_content"

81. android:textColor="#000000"

82. android:text="唱歌" />

83. <CheckBox android:id="@+id/checkbox2"

84. android:layout_width="wrap_content"

85. android:layout_height="wrap_content"

86. android:textColor="#000000"

87. android:text="跳舞" />

88. </LinearLayout>

89. <LinearLayout

90. android:layout_width="fill_parent"

91. android:layout_height="wrap_content">

92. <TextView

93. android:layout_width="wrap_content"

94. android:layout_height="wrap_content"

95. android:text="婚姻： "

96. android:textColor="#000000"

97. android:layout_gravity="center"/>

98. <ToggleButton android:id="@+id/ToggleButton1"

99. android:textOn="已婚"

100. android:textOff="未婚"

101. android:layout_width="wrap_content"

102. android:layout_height="wrap_content"/>

103. </LinearLayout>

104. <LinearLayout

105. android:layout_width="fill_parent"

106. android:layout_height="wrap_content">

107. <TextView

108. android:layout_width="wrap_content"

109. android:layout_height="wrap_content"

110. android:layout_gravity="center"

111. android:text="生日： "

112. android:textColor="#000000" />

113. <DatePicker android:id="@+id/datePicker"

114. android:layout_width="wrap_content"

115. android:layout_height="wrap_content"

116. android:layout_gravity="center_horizontal"/>

117. </LinearLayout>

118. <LinearLayout

119. android:layout_width="fill_parent"

120. android:layout_height="wrap_content">

121. <TextView

122. android:layout_width="wrap_content"

123. android:layout_height="wrap_content"

124. android:text="来自： "

125. android:textColor="#000000" />

126. <Spinner

127. android:id="@+id/Spinner1"

128. android:text="国内 "

129. android:layout_width="wrap_content"

130. android:layout_height="wrap_content"

131. />

132. </LinearLayout>

133. <Button android:id="@+id/button1"

134. android:layout_height="wrap_content"

135. android:layout_width="fill_parent"

136. android:text="普通按钮"/>

137. </LinearLayout>

主界面布局我们整体上采用纵向的线性布局，内嵌套横向线性布局。

我们用TextView来做文本展示，通过android:text=””属性设置我们要展示的文本内容，其中android:textColor属性设置了字体颜色。

第18～22行是一个ImageView用于显示图像，在这里我们指定了图像的显示大小为100dp，通过android:src属性设置了要显示的图片。当然我们也可以在Java代码里设置要显示的图片。

第32～38行的EditText控件常作为文字输入框，设置<requestFocus />属性获得输入焦点。我们也能通过设置android:inputType属性来限定输入类型为数字、电话号码、密码、IP地址等类型。

第49～67行声明在RadioGroup标签内的2个RadioButton单选按钮组合成一个单选框。其作为一个整体由RadioGroup设置监听器。其中的android:checked属性用于设置默认值。

第78～87行是2个CheckBox组成的多选框，与单选框必须组合不同，CheckBox能独立放置，独立设置监听器。

第98～103行ToggleButton是开关形式的按钮，通过android:textOn属性设置选中状态的文字，通过android:textOff属性设置未选中状态的文字。在功能上它和CheckBox很类似。

第113～116行的DatePicker是日期选择控件，可以进行挑选年、月、日，也可以软键盘输入指定的年月日。

第126～131行的Spinner控件是一个列表选择框，单击后弹出选择列表，允许用户从一组数据中选择一个值。控件内的具体内容在代码里通过设置适配器来完成。

第133～136行是个普通Button按钮，我们可以在代码里设置按钮的监听事件来完成相应操作。

下面是本例的Java代码部分。

TestActivity.java

1. public class TestActivity extends Activity {

2. private ImageView ImageView1;

3. private EditText editText1;

4. private Spinner spinner1;

5. private RadioGroup RadioGroup1;

6. private CheckBox checkbox1,checkbox2;

7. private ToggleButton ToggleButton1;

8. private ArrayAdapter<String> adapter;

9. private DatePicker datePicker;

10. private Button button1;

11. @Override

12. public void onCreate(Bundle savedInstanceState) {

13. super.onCreate(savedInstanceState);

14. setContentView(R.layout.test);

15. findwidget();}

16. void findwidget()

17. {

18. ImageView1=(ImageView)findViewById(R.id.ImageView1);

19. ImageView1.setImageResource(R.drawable.sample);

20. editText1=(EditText)findViewById(R.id.editText1);

21. editText1.addTextChangedListener(new TextWatcher() {

22. @Override

23. public void afterTextChanged(Editable arg0) {

24. // TODO Auto-generated method stub

25. }

26. @Override

27. public void beforeTextChanged(CharSequence s, int start, int count,int after) {

a) // TODO Auto-generated method stub

28. }

29. @Override

30. public void onTextChanged(CharSequence s, int start, int before,int count) {

31. // TODO Auto-generated method stub

32. }});

33. RadioGroup1=(RadioGroup)findViewById(R.id.RadioGroup1);

34. RadioGroup1.setOnCheckedChangeListener(new

RadioGroup.OnCheckedChangeListener()

35. {@Override

36. public void onCheckedChanged(RadioGroup arg0, int checkedId)

37. {

38. switch(checkedId)

39. {

40. case R.id.RadioButton1:

41. Log.d("TestActivity","select RadioButton1");

42. break;

43. case R.id.RadioButton2:

44. Log.d("TestActivity","select RadioButton2");

45. break;

46. default:

47. break;

48. }}});

49. checkbox1=(CheckBox)findViewById(R.id.checkbox1);

50. checkbox2=(CheckBox)findViewById(R.id.checkbox2);

51. OnCheckedChangeListener listener = new

CompoundButton.OnCheckedChangeListener()

52. {

53. @Override

54. public void onCheckedChanged(CompoundButton buttonView, boolean

isChecked) {

55. switch(buttonView.getId()){

56. case R.id.checkbox1: //action

57. Log.d("TestActivity","checkbox1:"+isChecked+"="+buttonView.getText());

58. break;

59. case R.id.checkbox2: //action

60. Log.d("TestActivity","checkbox2:"+isChecked+"="+buttonView.getText());

61. break;

62. case R.id.ToggleButton1: //action

63. Log.d("TestActivity","ToggleButton1:"+isChecked+"="+buttonView.getText());

64. break;

65. } } } ;

66. checkbox1.setOnCheckedChangeListener(lisdtener);

67. checkbox2.setOnCheckedChangeListener(listener);

68. ToggleButton1=(ToggleButton)findViewById(R.id.ToggleButton1);

69. ToggleButton1.setOnCheckedChangeListener(listener);

70. datePicker=(DatePicker)findViewById(R.id.datePicker);

71. datePicker.init(2012, 9, 8, new DatePicker.OnDateChangedListener(){

72. public void onDateChanged(DatePicker view, int year,int monthOfYear, int

dayOfMonth) {

73. Log.d("TestActivity","datePicker您选择的日期是："+year+"年"+(monthOfYear+1)+"月"+
dayOfMonth+"日。");

74. }});

75. final String[] from={"中国","美国","俄罗斯","加拿大"};

76. spinner1=(Spinner)findViewById(R.id.Spinner1);

77. adapter = new ArrayAdapter<String>(this,

android.R.layout.simple_spinner_item, from);

78. adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

79. spinner1.setAdapter(adapter);

80. spinner1.setOnItemSelectedListener(new Spinner.OnItemSelectedListener(){

81. @Override

82. public void onItemSelected(AdapterView<?> arg0, View arg1, int arg2,long arg3)

83. {

84. Log.d("TestActivity","我单击的是spinner1："+from[arg2]);

85. }

86. @Override

87. public void onNothingSelected(AdapterView<?> arg0) {

88. }} );

89. button1=(Button)findViewById(R.id.button1);

90. button1.setOnClickListener(new View.OnClickListener() {

91. @Override

92. public void onClick(View v) {

93. Log.d("TestActivity:","我单击的是：button");

94. }});}

95. }

第2～10行是控件对象定义部分，定义了main布局文件里用到的控件。

第12～15行在onCreate函数里我们把main布局设置为程序的view，然后在findwidget函数里绑定控件和设置监听器。

第18～19行是ImageView控件的代码，通过setImageResource方法可以把drawable里的图片资源设置到图片上。

第20～32行是EditText控件，通过addTextChangedListener设置了TextWatcher监听器。这个监听器在用户输入、删除和修改EditText内容时被回调。通过beforeTextChanged函数可以获得修改前的内容，通过onTextChanged函数能知道哪些地方被改动了，而afterTextChanged函数能获得修改后的内容。通过这几个回调函数能在用户输入时做一些判断、提醒、限制的工作。

第33～48行是RadioGroup和RadioButton组成的单选框。在代码里只需要获取到RadioGroup对象并通过setOnCheckedChangeListener设置RadioGroup.OnCheckedChangeListener监听器。当用户单击单选项时系统就会回调设置的监听器代码，在监听器的onCheckedChanged方法里通过checkedId就能知道是哪个RadioButton触发了单击事件，并作相应的处理。

第49～50行是两个多选控件checkbox1和checkbox2对象。

第51～65行定义了CheckBox的Checked状态改变监听对象OnCheckedChangeListener listener。在这个对象里实现了系统回调函数onCheckedChanged。onCheckedChanged被回调时会通过buttonView指示哪个控件的状态改变了，改变的值是isChecked。在这里给checkbox 1、checkbox 2和ToggleButton 1都设置了listener监听器对象，然后通过buttonView.getId()函数来判断是哪个控件状态改变。

第66～67行给checkbox 1和checkbox 2设置了监听器listener。

第68～69行是ToggleButton控件，也用了监听器listener，其功能上和CheckBox类似。

第70～74行是日期选择DatePicker控件，datePicker.init函数用来初始化控件的年月日，并设置日期改变监听器DatePicker.OnDateChangedListener()。当用户改变日期时系统就会回调监听器里的onDateChanged函数，通过这个函数我们知道了修改后的年月日数据。注意：monthOfYear是从0开始计数的，即0代表一月。

第75～79行是Spinner列表选择器并设置了adapter适配器。字符串数组from里是列表的内容源，通过数组适配器adapter将内容源与其连接，通过设置adapter.setDropDownViewResource给列表设置simple_spinner_dropdown_item显示风格。单击Spinner后的效果图如图10-7所示。

技术分享