1. 程式人生 > >介面元件——文字框(TextView)和編輯框(EditText)

介面元件——文字框(TextView)和編輯框(EditText)

介紹

TextView直接繼承了View,它還是EditTextButton兩個UI元件類的父類。

TextViewEditView均能在介面上顯示文字,只是後者還能提供對此顯示文字的編輯功能

用例1:基本屬性設定

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<!--設定字型為20pt--> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="一代人" android:textSize="20pt"/> <!--設定中間省略--> <TextView android:layout_width
="match_parent" android:layout_height="wrap_content" android:singleLine="true" android:text="黑夜給了我黑色的眼睛,我卻用它尋找光明。" android:ellipsize="middle"/>
<!--對郵件增加連結--> <TextView android:layout_width="match_parent" android:layout_height="wrap_content"
android:singleLine="true" android:text="個人郵箱[email protected],歡迎來信。" android:autoLink="email"/>
<!--設定文字顏色、大小,並使用陰影--> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="詩歌愛好者" android:shadowColor="#0000ff" android:shadowDx="15.0" android:shadowDy="20.0" android:textColor="#ff0000" android:textSize="25pt"/> <!--測試密碼框--> <TextView android:id="@+id/password" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Hello World" android:password="true"/> </LinearLayout>

相應地介面展示結果:
圖1

用例2給文字框新增邊框或圖片

使用shape在drawable目錄下建立一個背景檔案

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#ffffff" />
    <stroke android:width="1dp" android:color="#ff0000" />
</shape>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!--通過android:backgroup指定背景-->
    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/bg_border"
        android:text="帶邊框的文字"
        android:textSize="25dp"/>

    <!--通過android:drawableLeft繪製一張圖片-->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="帶圖片的文字"
        android:drawableLeft="@drawable/leaf"/>

</LinearLayout>

相應地介面展示結果:

圖2

用例3新增預設提示和焦點切換功能,對於電話號碼框時輸入法自動切換到數字鍵盤

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

    <TableRow>
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="使用者名稱: "
            android:textSize="10pt"
            android:background="@drawable/bg_border"/>

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="請填寫登入賬號"
            android:selectAllOnFocus="true"/>
    </TableRow>

    <TableRow>
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="密碼: "
            android:textSize="10pt"
            android:background="@drawable/bg_border"/>

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:password="true"/>
    </TableRow>

    <TableRow>
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="電話號碼"
            android:background="@drawable/bg_border"/>

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="請填寫您的電話號碼"
            android:selectAllOnFocus="true"
            android:phoneNumber="true"/>
    </TableRow>

    <TableRow>
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="註冊"/>
    </TableRow>
</TableLayout>

相應地介面展示結果:

圖2

摘自《瘋狂Android講義》