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ácSpannhưStyleSpan,ForegroundColorSpan,RelativeSizeSpan,ClickableSpan, v.v.