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

Đổi màu Status Bar trùng màu App Android Kotlin

Hướng dẫn này minh họa cách thay đổi màu Status Bar (thanh trạng thái) để trùng khớp với màu chủ đạo của ứng dụng Android sử dụng Kotlin.

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

Mở Android Studio, chọn File → New Project và điền thông tin cần thiết.

Bước 2: Thiết kế giao diện (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:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="50dp"
        android:text="Tutorials Point"
        android:textAlignment="center"
        android:textColor="@android:color/holo_green_dark"
        android:textSize="32sp"
        android:textStyle="bold" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Check the Color of the Status Bar"
        android:textAlignment="center"
        android:textColor="@color/colorAccent"
        android:textSize="24sp"
        android:textStyle="bold" />

</RelativeLayout>

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

import android.os.Bundle
import android.view.Window
import android.view.WindowManager
import androidx.appcompat.app.AppCompatActivity
import androidx.core.content.ContextCompat

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        title = "KotlinApp"

        val window: Window = window
        window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS)
        window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS)
        window.statusBarColor = ContextCompat.getColor(this, R.color.colorAccent)
    }
}

Bước 4: Cấu hình màu trong res/values/colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#6200EE</color>
    <color name="colorPrimaryDark">#3700B3</color>
    <color name="colorAccent">#03DAC5</color>
</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>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

    </application>
</manifest>

Chạy ứng dụng

Kết nối thiết bị, nhấn Run. Status Bar sẽ chuyển màu thành colorAccent (xanh ngọc) thay vì màu mặc định.

Giải thích các flag

FlagChức năng
FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDSCho phép app vẽ background cho system bars
FLAG_TRANSLUCENT_STATUSLàm status bar trong suốt (cần clear flag này)

Cách thay đổi Navigation Bar (thanh điều hướng dưới)

window.navigationBarColor = ContextCompat.getColor(this, R.color.colorPrimaryDark)

Lưu ý về Theme

Đảm bảo theme trong styles.xml không set android:windowTranslucentStatus="true hoặc android:windowDrawsSystemBarBackgrounds="false":

<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:windowTranslucentStatus">false</item>
    <item name="android:statusBarColor">@color/colorPrimaryDark</item>
</style>

Android 11+ (API 30+): Insets & WindowInsetsController

val insetsController = window.insetsController
insetsController?.systemBarsBehavior = WindowInsetsController.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE
insetsController?.setSystemBarsAppearance(
    WindowInsetsController.APPEARANCE_LIGHT_STATUS_BARS,
    WindowInsetsController.APPEARANCE_LIGHT_STATUS_BARS
)