Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> Android

Cách tạo nhiều style trong một TextView trên Android bằng Kotlin

Ví dụ này minh họa cách tạo nhiều kiểu dáng (style) khác nhau bên trong một TextView trên Android sử dụng Kotlin.

Bước 1: Tạo dự án mới

Trong Android Studio, chọn File → New Project và điền đầy đủ thông tin để tạo dự án mới.

Bước 2: Cấu hình layout chính (activity_main.xml)

Thêm mã sau vào res/layout/activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="150dp"
        android:padding="4dp"
        android:textAlignment="center"
        android:textSize="16sp" />
    <TextView
        android:id="@+id/textView2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/textView"
        android:layout_marginTop="70dp"
        android:padding="4dp"
        android:textAlignment="center"
        android:textSize="16sp" />
    <TextView
        android:id="@+id/textView3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/textView2"
        android:layout_marginTop="70dp"
        android:padding="4dp"
        android:textAlignment="center"
        android:textSize="16sp" />
</RelativeLayout>

Bước 3: Viết mã MainActivity.kt

Thêm mã sau vào src/MainActivity.kt:

import android.os.Bundle
import android.text.Html
import android.widget.TextView
import androidx.appcompat.app.AppCompatActivity

@Suppress("DEPRECATION")
class MainActivity : AppCompatActivity() {
    private lateinit var textView: TextView
    private lateinit var textView2: TextView
    lateinit var textView3: TextView
    
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        title = "KotlinApp"
        
        textView = findViewById(R.id.textView)
        textView2 = findViewById(R.id.textView2)
        textView3 = findViewById(R.id.textView3)
        
        // Cách 1: Set HTML trực tiếp
        textView.text = Html.fromHtml(
            "Multiple style inside android textView: bold text: " +
            "bold text, italic text: italic text, small font: small text, " +
            "font color: Text Color, " +
            "font color with bold text: Bold with font color"
        )
        
        // Cách 2: Sử dụng biến trung gian
        val text = Html.fromHtml(
            "Multiple style inside android textView: bold text: " +
            "bold text, italic text: italic text, small font: small text, " +
            "font color: Text Color, " +
            "font color with bold text: Bold with font color"
        )
        textView2.text = text
        
        // Cách 3: Lấy từ strings.xml
        textView3.text = Html.fromHtml(getString(R.string.textStyle))
    }
}

Bước 4: Cấu hình strings.xml

Mở res/values/strings.xml và thêm:

<resources>
    <string name="textStyle"><![CDATA[
        Multiple style inside android textView: bold text: bold text, 
        italicText text: italic text, small font: small text, 
        font color: Text Color, 
        font color with bold text: Bold with font color
    ]]></string>
</resources>

Bước 5: Cấu hình AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="com.example.q11">
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                
                
            </intent-filter>
        </activity>
    </application>
</manifest>

Chạy ứng dụng

Kết nối thiết bị Android thực với máy tính. Từ Android Studio, mở file activity và nhấn biểu tượng Run trên thanh công cụ. Chọn thiết bị di động và kiểm tra màn hình hiển thị.

Lưu ý: Html.fromHtml() không hỗ trợ tất cả thẻ HTML. Các thẻ được hỗ trợ: <b>, <i>, <u>, <small>, <font color="...">, <br>, v.v. Để có khả năng định dạng phong phú hơn, hãy sử dụng SpannableString kết hợp các Span như StyleSpan, ForegroundColorSpan, RelativeSizeSpan, ClickableSpan, v.v.