2014-2-4TextView及其子類2

1.    EditText的功能與用法

EditText可以接受用戶輸入。其最重要的屬性是inputType，用於EditView爲指定類型的輸入組件。

實例：用戶友好的輸入界面

Xml代碼清單：

<TableLayoutxmlns: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"

            />

        <!--android:inputType="number"表明是數值輸入框 -->

        <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"

            />

        <!-- inputType="date"表明是日期輸入框 -->

        <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"

            />

        <!-- inputType="phone"表明是電話號碼輸入框 -->

        <EditText

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:inputType="phone"

            />

    </TableRow>

    <Button

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="註冊"

        />

</TableLayout>

效果圖：

2.    按鈕（Button）組件

Button繼承了TextView，它可供用戶點擊，觸發onClick事件。按鈕可通過android：background屬性來添加背景顏色和背景圖片。也可以使用自定義Drawable對象實現按鈕的背景顏色、背景圖片隨用戶動作動態改變。

實例：按鈕、圓形按鈕、帶文字的圖片按鈕

Xml代碼清單：

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

    android:orientation="vertical"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

     >

    <!-- 文字帶陰影的按鈕 -->

    <Button

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="文字帶陰影的按鈕"

        android:textSize="12pt"

        android:shadowColor="#aa5"

        android:shadowRadius="1"

        android:shadowDx="5"

        android:shadowDy="5"

        />

    <!-- 普通文字按鈕 -->

    <Button

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="@drawable/pp"

        android:text="普通按鈕"

        android:textSize="10pt"

        />

    <!-- 帶文字的圖片按鈕 -->

    <Button

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="@drawable/button_selector"

        android:textSize="11px"

        android:text="帶文字的圖片按鈕"

        />

</LinearLayout>

       上面的界面佈局中第一個爲普通按鈕，但爲該按鈕的文字指定了陰影——配置方法與TextView配置陰影方法相同。

第二個按鈕通過background屬性配置了背景圖片，該按鈕會顯示背景圖片形狀的按鈕。

第三個按鈕通過指定android:background屬性爲@drawable/button_select，該屬性引用了一個Drawable資源，該資源對應的xml文件如下：

<?xmlversion="1.0"encoding="utf-8"?>

<selectorxmlns:android="http://schemas.android.com/apk/res/android">

    <!-- 指定按鈕按下是的圖片 -->

    <itemandroid:state_pressed="true"

        android:drawable="@drawable/red"

        ></item>

    <!-- 指定按鈕鬆開時的圖片 -->

    <itemandroid:state_pressed="false"

        android:drawable="@drawable/purple"

        />

</selector>

效果圖：

PS：從上面按鈕來看，當按鈕內容太多時，android會自動縮放整張圖片，以保證背景圖片能覆蓋整個按鈕，使圖片效果不好。

可通過只縮放圖片部分，保證視覺效果。這要藉助9Patch圖片實現，它是一種特殊的PNG圖片，以.9.png結尾，它在原始圖片四周各添加一個寬度爲1像素的線條，這四條線條決定了該圖片的縮放規則、內容顯示規則。

Android爲製作9Patch圖片提供了draw9patch工具，該工具位於Android SDK安裝路徑的tools目錄下，雙擊draw9patch.bat文件，可啓動該工具。

3.    單選按鈕（RadioButton）與複選框（CheckBox）

它們多了一個可選中功能，可額外指定一個android:checked屬性。一組RadioButton只能選中其中一個，通常要與RadioGroup一起使用，用於定義一組單選按鈕。

實例：利用單選按鈕、複選框獲取用戶信息

Xml代碼清單：

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

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical">

   

    <TableRow>

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="性別："

        android:textColor="#0ff"

        android:textColorLink="#ff0"

        android:textSize="16px"/>

    <!-- 定義一組單選按鈕 -->

    <RadioGroupandroid:id="@+id/rg"

        android:orientation="horizontal"

        android:layout_gravity="center_horizontal"

        >

        <!-- 定義兩個單選按鈕，

android:checked默認勾選-->

        <RadioButton

           android:layout_width="wrap_content"

           android:layout_height="wrap_content"

           android:id="@+id/male"

           android:text="男"

           android:checked="true"

           />

        <RadioButton

           android:layout_width="wrap_content"

           android:layout_height="wrap_content"

           android:id="@+id/famale"

           android:text="女"        

           />      

    </RadioGroup>

    </TableRow>

    <TableRow>

        <TextView

           android:layout_width="wrap_content"

           android:layout_height="wrap_content"

           android:text="喜歡的顏色："

           android:textSize="16px"

           />

        <!-- 定義一個垂直的線性佈局 -->

        <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="紅色"

               android:checked="true"/>

           <CheckBox

               android:layout_width="wrap_content"

               android:layout_height="wrap_content"

               android:text="藍色"

               />

           <CheckBox

               android:layout_width="wrap_content"

               android:layout_height="wrap_content"

               android:text="綠色"

               />

        </LinearLayout>

    </TableRow>

    <TextView

        android:id="@+id/show"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:textColor="#0f0"

        android:textSize="20px"/>

</TableLayout>

       爲了監聽單選按鈕、複選框的勾選狀態的改變，可以爲他們添加事件監聽器。下面Activity爲RadioGroup添加了事件監聽器：

packagecom.hqsA.checkbuttont;

 

importandroid.os.Bundle;

importandroid.app.Activity;

importandroid.widget.RadioGroup;

importandroid.widget.RadioGroup.OnCheckedChangeListener;

importandroid.widget.TextView;

 

public classCheckButtonT extends Activity {

         RadioGroup rg;

         TextView show;

         @Override

         protected void onCreate(BundlesavedInstanceState) {

                   super.onCreate(savedInstanceState);

                   setContentView(R.layout.check_button_t);

                   //獲取界面上 rg,show兩個主件

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

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

                   //爲RadioGroup組件的OnCheck事件綁定事件監聽器

                   rg.setOnCheckedChangeListener(newOnCheckedChangeListener()

                   {

                            @Override

                            public voidonCheckedChanged(RadioGroup Group,int CheckedId)

                            {

                                     //根據用戶勾選的單選按鈕來動態改變tip字符串的值

                                     String tip= CheckedId == R.id.male ?

                                                        "先生，您好！" : "女士，您好！";

                                     //修改show組件中的文本

                                     show.setText(tip);

                            }

                   });

         }

}

效果圖：