Android SDK Tutorials系列 - Hello Views - Form Stuff

Form Stuff

本教程介绍几种窗口小部件，利用它们能创建不同的窗体，例如：图片按钮、文本框、复选框以及单选按钮等。

1. 创建工程：HelloFormStuff.
2. 打开res/layout/main.xml，里面应该已经有一个基本的LinearLayout:

   <?xml version="1.0" encoding="utf-8"?>
   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:orientation="vertical"
       android:layout_width="fill_parent"
       android:layout_height="fill_parent" >
   </LinearLayout>
   

   你可以添加你需要的窗口小部件到LinearLayout里面。

下面的每一章节，都假设HelloFormStuff 已经实现了下面的默认的onCreate()方法：

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
}

下面，选择你要创建的窗口小部件（也可以不选择，一个一个依次往下看）：

• Custom Button
• Edit Text
• Checkbox
• Radio Buttons
• Toggle Button
• Rating Bar

Custom Button

这一节，我们将创建一个图片按钮，而不是通常的文本按钮。使用Button小部件和一个XML布局文件，根据按钮的状态来显示不同的图片。当按钮被按下时，会显示一个文本消息。

1. 将下面的图片拷贝到res/drawable/。这些图片用于显示按钮的不同状态。
   
   
2. 在res/drawable/ 下面创建一个android_button.xml布局文件， 内容如下：

   <?xml version="1.0" encoding="utf-8"?>
   <selector xmlns:android="http://schemas.android.com/apk/res/android">
       <item android:drawable="@drawable/android_pressed"
             android:state_pressed="true" />
       <item android:drawable="@drawable/android_focused"
             android:state_focused="true" />
       <item android:drawable="@drawable/android_normal" />
   </selector>
   

   这个XML文件定义了一个图像资源，当按钮状态变化时，显示的图片也跟着变。第一个<item> 定义了当按钮被按下时显示的图片是android_pressed.png；第二个<item> 定义了当按钮被选中时（当按钮被轨迹球或者方向键选中时）显示的图片是android_focused.png；第三个<item> 定义了当按钮既没被按下，也没被选中时显示的图片是android_normal.png。这个XML文件就是一个图像资源，当Button用它做背景时，显示的图片会随着按钮状态的变化而变化。

   注意: <item> 项的顺序是有讲究的。当这个图像资源被引用时，系统会依次检查<item> 项来决定按钮当前状态应该显示哪张图片。因为"normal"图片在最后，显示它的前提是 android:state_pressed （按下）和android:state_focused （选中）两个条件都不满足。 

3. 打开 res/layout/main.xml并在LinearLayout里面添加一个Button：

       <Button
           android:id="@+id/button"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:padding="10dp"
           android:background="@drawable/android_button" />
   

   android:background 属性指定了按钮的背景图片（如果前面创建的android_button.xml文件改名为android.xml，那这里的背景应该设置为@drawable/android）。这个XML文件代替了按钮普通的背景图片，在整个系统里绝大部分按钮是直接用背景图片的。

4. 在onCreate()末尾添加以下代码来处理点击事件：

   final Button button = (Button) findViewById(R.id.button);
   button.setOnClickListener(new OnClickListener() {
       public void onClick(View v) {
           // Perform action on clicks
           Toast.makeText(HelloFormStuff.this, "Beep Bop", Toast.LENGTH_SHORT).show();
       }
   });
   

   这段代码获得对界面里面Button的引用，然后给它加上一个点击事件监听器。监听器里面必须实现一个onClick(View) 回调函数来处理点击事件，这里会显示一个文本消息。

5. 运行应用。

Edit Text

本节里，将用EditText创建一个让用户输入的文本框。输入文本后按下"Enter" (“回车”)会弹出一条文本消息，显示输入的内容。

1. 打开res/layout/main.xml， 在LinearLayout里面添加一个EditText：

   <EditText
           android:id="@+id/edittext"
           android:layout_width="fill_parent"
           android:layout_height="wrap_content"/>
   

2. 在onCreate()方法末尾添加以下代码来处理按键事件：

   final EditText edittext = (EditText) findViewById(R.id.edittext);
   edittext.setOnKeyListener(new OnKeyListener() {
       public boolean onKey(View v, int keyCode, KeyEvent event) {
           // If the event is a key-down event on the "enter" button
           if ((event.getAction() == KeyEvent.ACTION_DOWN) &&
               (keyCode == KeyEvent.KEYCODE_ENTER)) {
             // Perform action on key press
             Toast.makeText(HelloFormStuff.this, edittext.getText(), Toast.LENGTH_SHORT).show();
             return true;
           }
           return false;
       }
   });
   

   这段代码获得对界面里EditText的引用，并给它添加一个 View.OnKeyListener按键监听器，监听器必须实现 onKey(View, int, KeyEvent)方法，该方法处理按键事件（当该部件处于焦点时）。这里只处理回车输入，回车时会弹出一个文本消息框显示输入的内容。onKey(View, int, KeyEvent)方法应该总是在处理事件以后返回true，这样该事件就不会“起泡”（结果是在文本框保存一个回车符）。

3. 运行应用。

Checkbox

本节里，将用CheckBox来创建一个复选框用来选择选项。当复选框被点击时，会弹出一个文本消息显示复选框的当前状态。

1. 打开res/layout/main.xml，添加一个 CheckBox ：

       <CheckBox android:id="@+id/checkbox"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="check it out" />
   

2. 在 onCreate()末尾添加以下代码来处理复选框状态的变化：

   final CheckBox checkbox = (CheckBox) findViewById(R.id.checkbox);
   checkbox.setOnClickListener(new OnClickListener() {
       public void onClick(View v) {
           // Perform action on clicks, depending on whether it's now checked
           if (((CheckBox) v).isChecked()) {
               Toast.makeText(HelloFormStuff.this, "Selected", Toast.LENGTH_SHORT).show();
           } else {
               Toast.makeText(HelloFormStuff.this, "Not selected", Toast.LENGTH_SHORT).show();
           }
       }
   });
   

   这段代码首先获得界面里CheckBox的引用，然后给它添加一个点击事件监听器来处理复选框的点击事件。被点击后，isChecked()会被调用来检查复选框的新状态。如果是被选中状态，则弹出文本消息框显示"Selected"，否则显示"Not selected"。注意，View对象被转换成了CheckBox对象，因为isChecked()方法在类View里面没有定义。Checkbox会处理自己的状态变化，因此只要查询他的当前状态就可以了。

3. 运行应用。

小贴士: 如果你想自己改变复选框的状态（例如当加载一个保存的CheckBoxPreference时），调用setChecked(boolean) 或 toggle() 方法.

Radio Buttons

本节里，将用RadioGroup和RadioButton两个窗口小部件来创建两个互斥的单选按钮。无论点击哪个按钮，都会显示一个文本消息。

1. 打开res/layout/main.xml，添加如下内容：

       <RadioGroup
         android:layout_width="fill_parent"
         android:layout_height="wrap_content"
         android:orientation="vertical">
         <RadioButton android:id="@+id/radio_red"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:text="Red" />
         <RadioButton android:id="@+id/radio_blue"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:text="Blue" />
       </RadioGroup>
   

   把两个RadioButton放在RadioGroup里分成一组很关键，这样保证了只有一个按钮被选中，这个由Android系统自动完成。当一个组里面的RadioButton被选中时，其他的所有按钮都被自动设置为未选中状态。

2. 需要添加一个点击事件监听器来处理RadioButton的点击事件。这里，由于需要复用这个监听器，所以添加下面的代码为HelloFormStuff创建一个新的成员：

   private OnClickListener radio_listener = new OnClickListener() {
       public void onClick(View v) {
           // Perform action on clicks
           RadioButton rb = (RadioButton) v;
           Toast.makeText(HelloFormStuff.this, rb.getText(), Toast.LENGTH_SHORT).show();
       }
   };
   

   首先，把View转换成RadioButton，然后弹出一个文本消息显示被选中的按钮上的文本。

3. 在onCreate()末尾添加以下内容：

     final RadioButton radio_red = (RadioButton) findViewById(R.id.radio_red);
     final RadioButton radio_blue = (RadioButton) findViewById(R.id.radio_blue);
     radio_red.setOnClickListener(radio_listener);
     radio_blue.setOnClickListener(radio_listener);
   

   从界面获得每个单选按钮RadioButton的引用，并为它们每个设置新创建的监听器。

4. 运行应用。

Toggle Button

本节里，将用ToggleButton小部件来创建一个开关按钮，这种按钮有两种状态可以切换，是对单选按钮的完美替代，当只有两个简单的互斥状态时（例如：“打开”，“关闭”）。

1. 打开 res/layout/main.xml，添加ToggleButton ：

       <ToggleButton android:id="@+id/togglebutton"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:textOn="Vibrate on"
           android:textOff="Vibrate off"/>
   

   属性android:textOn 和android:textOff 设置了按钮不同状态下的显示文本，默认是"ON"和"OFF"。

2. 在onCreate()末尾添加以下代码来处理按钮的点击事件：

   final ToggleButton togglebutton = (ToggleButton) findViewById(R.id.togglebutton);
   togglebutton.setOnClickListener(new OnClickListener() {
       public void onClick(View v) {
           // Perform action on clicks
           if (togglebutton.isChecked()) {
               Toast.makeText(HelloFormStuff.this, "Checked", Toast.LENGTH_SHORT).show();
           } else {
               Toast.makeText(HelloFormStuff.this, "Not checked", Toast.LENGTH_SHORT).show();
           }
       }
   });
   

   首先获得对ToogleButton的引用，然后添加一个点击事件监听器。监听器必须实现onClick(View)回调函数来处理点击事件。这里，回调函数检查按钮的新状态，并弹出一条文本消息显示当前状态。

   注意：ToggleButton会自己处理自己的状态变化（选中、未选中），因此只需要查询是什么状态就可以了。

3. 运行应用。

Rating Bar

本节里，将用RatingBar来创建一个小部件让用户能够进行等级评价。

1. 打开res/layout/main.xml 并添加一个RatingBar ：

       <RatingBar android:id="@+id/ratingbar"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:numStars="5"
           android:stepSize="1.0"/>
   

   属性android:numStars 设置显示几颗星星，属性android:stepSize 设置评价等级的粒度（例如，0.5允许评价半颗星）。

2. 在onCreate()末尾添加以下代码来处理评价事件:

   final RatingBar ratingbar = (RatingBar) findViewById(R.id.ratingbar);
   ratingbar.setOnRatingBarChangeListener(new OnRatingBarChangeListener() {
       public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {
           Toast.makeText(HelloFormStuff.this, "New Rating: " + rating, Toast.LENGTH_SHORT).show();
       }
   });
   

   首先获得对RatingBar的引用，然后设置RatingBar.OnRatingBarChangeListener评价事件监听器。回调函数onRatingChanged() 处理用户的评价。这里，弹出一条文本消息显示最新的评价。

3. 运行应用。

如果你添加了上面讲到的所有小部件，你的应用看起来应该像这样：

返回 Android SDK Tutorials系列 - Hello Views

   转载请注明出处：http://blog.csdn.net/mtding/article/details/6966714