Lập trình Android - TextView

TextView trong Android

Bạn sử dụng TextView để hiển thị các đoạn văn bản mà không muốn người dùng có thể chỉnh sửa được nội dung. Bạn có thể khai báo TextView trong file layout XML hoặc trong đoạn code Java.

TextView là class con của View. Do đó, bạn có thể đặt một TextView vào bên trong một GroupView trong ứng dụng của mình.

Chúng ta có thể tạo một TextView trong tập tin XML hoặc khởi tạo TextView trong code Java

 

Code TextView trong XML

 <TextView android:id="@+id/txtSimpleView"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Hiệp Sĩ IT" />

Code TextView trong JAVA

TextView textView = (TextView) findViewById(R.id.textView);
textView.setText("Hiệp Sĩ IT"); //set text for text view

Thuộc tính thường dùng của TextView

Bây giờ chúng xem một số thuộc tính hay sử dụng trong TextView trong tập tin XML

1. android:id: Là thuộc tính duy nhất của TextView. Xem ví dụ sau:

 <TextView android:id="@+id/txtSimpleView"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Hiệp Sĩ IT" />

2. android:gravity: Thuộc tính này thường sử dụng để canh nội dung trên TextView: left, right, center, top, bottom, center_vertical, center_horizontal

<TextView android:id="@+id/txtSimpleView"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Hiệp Sĩ IT"
	android:textSize="20sp"
	android:gravity="center_horizontal"/> <!--center horizontal gravity-->

3. android:text: Thuộc tính này dùng xuất chuỗi văn bản lên TextView, Chúng ta có thể khai báo trong XML hoặc code Java

<TextView android:id="@+id/txtSimpleView"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Hiệp Sĩ IT"
	android:textSize="20sp"
	android:layout_centerInParent="true"
	android:gravity="center_horizontal"/> <!--center horizontal gravity-->
 

Java class:

TextView textView = (TextView)findViewById(R.id.textView);
textView.setText("Hiệp Sĩ IT"); //set text for text view

4. android:textColor: Thuộc tính này dùng xác định màu chữ, dạng màu chữ: “#argb”, “#rgb”, “#rrggbb”, hoặc “#aarrggbb”.

<TextView android:id="@+id/txtSimpleView"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Hiệp Sĩ IT"
	android:layout_centerInParent="true"
	android:gravity="center_horizontal"
	android:textSize="25sp"
	android:textColor="#f00"/>

Java Class:

TextView textView = (TextView)findViewById(R.id.textView);
textView.setTextColor(Color.RED); //set red color for text view

5. android:textSize: Thuộc tính textSize xác định kích thước văn bản của TextView. Chúng ta có thể đ8ạ kích thước văn bản theo sp(scale independent pixel) hoặc dp(density pixel). Trong ví dụ này chúng ta xác định kich thước cho văn bản là 40sp

 <TextView android:id="@+id/txtSimpleView"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Hiệp Sĩ IT"
	android:layout_centerInParent="true"
	android:gravity="center_horizontal"
	 android:textSize="40sp"
	/>

Java class:

TextView textView = (TextView)findViewById(R.id.txtSimpleView);
textView.setTextSize(40); //set 20sp size of text

6. android: textStyle: Thuộc tính xác định loại văn bản của TextView, thông thường có các loại văn bản:bold, italic và normal. Nếu chúng ta muốn sử nhiều hơn một loại văn bản thì phải thêm phép toán hoặc "|" vào giữa các loại văn bản:

<TextView android:id="@+id/txtSimpleView"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Hiệp Sĩ IT"
	android:layout_centerInParent="true"
	android:gravity="center_horizontal"
	android:textStyle="bold|italic"
	 android:textSize="40sp"
	/>

7. android:background: Thuộc tính này xác định màu nền cho TextView

8. android:padding: Thuộc tính này xác định khoảng cách từ đường viền của TextView với nội dung nó chứa: left, right, top or bottom. Cũng ví dụ trên bây giờ chúng ta xác định padding=10sp từ mọi phía của TextView

 <TextView android:id="@+id/txtSimpleView"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Hiệp Sĩ IT"
	android:layout_centerInParent="true"
	android:gravity="center_horizontal"
	android:textStyle="bold|italic"
	 android:textSize="40sp"
	 android:padding="10dp"
android:textColor="#fff"
android:background="#000"
	/>

Java Class:

TextView textView = (TextView)findViewById(R.id.txtSimpleView);
textView.setBackgroundColor(Color.BLACK);//set background color

Chú ý:

Để kết nối các phần tử chúng ta dùng hàm findViewById đối truyền vào là R.id.xyz trong đó xyz là id mà chúng ta đã đặt cho các phần tử ở trong file xml. Tuy nhiên hàm này sẽ trả về kiểu View (View là kiểu cha của tất cả các thành phần, tức là TextView, EditText, Button,… đều kế thừa từ View) nên chúng ta cần ép kiểu về kiểu chính xác của mỗi phần tử:
TextView firstName = (TextView)findById(view, R.id.text_first_name);


Ví dụ: Trong ví dụ này chúng ta tạo một TextView trong XML, sau đó thay đổi nội dung của nó thông qua một button được lập trình xử lý sự kiện trong Java Class (Button chúng ta sẽ tìm hiểu ở trang tiếp theo).

Bước 1: Tạo một project tên là TextView: File->New->Android Application Project điền các thông tin ->Next ->Finish

Bước 2: Mở res -> layout -> xml (hoặc) activity_main.xml và thêm code, chúng ta sẽ tạo một TextView Button trong  Relative Layout.

<RelativeLayout xmlns: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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/simpleTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:text="Trước khi Click Me"
        android:textColor="#f00"
        android:textSize="25sp"
        android:textStyle="bold|italic"
        android:layout_marginTop="50dp"/>

    <Button
        android:id="@+id/btnChangeText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:background="#f00"
        android:padding="10dp"
        android:text="Change Text"
        android:textColor="#fff"
        android:textStyle="bold" />
</RelativeLayout>

Bước 3: Mở app -> src->MainActivity.java và thêm code . Nội dung của TextView sẽ thay đổi khi click vào Button.

package hiepsiit.com.textview;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

public class MainActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		final TextView simpleTextView = (TextView) findViewById(R.id.simpleTextView); //get the id for TextView
        Button changeText = (Button) findViewById(R.id.btnChangeText); //get the id for button
        changeText.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                simpleTextView.setText("Sau khi click me"); //set the text after clicking button
            }
        });
	}

	
}

Download ví dụ

Ứng dụng này được phát triển bởi adt bundleandroid 4.2 sử dụng minimum sdk 11  and target sdk 21.


Kết quả khi chạy ứng dụng:

Sau khi click vào button cho kết quả: