การเปลี่ยนสีแถบสถานะในการเขียน Jetpack

ทุกปัญหาที่ผ่านเข้ามาคือบทเรียน #เคล็ดลับ Android #แก้ปัญหาได้แล้ววันนี้

การเปลี่ยนสีแถบสถานะเป็นงานทั่วไปเมื่อออกแบบแอปพลิเคชัน Android ด้วย Jetpack Compose เป็นกระบวนการง่ายๆ ที่สามารถทำได้โดยใช้โค้ดเพียงไม่กี่บรรทัด

หากต้องการเปลี่ยนสีของแถบสถานะใน Jetpack Compose เราสามารถใช้ที่แพ็คเกจSystemUiControllerให้มาandroidx.compose.ui.platform

ขั้นแรก เราต้องมีaccompanist-systemuicontrollerเพิ่มการพึ่งพาไปยังไฟล์ build.gradle ของแอปของคุณ:

dependencies {
    implementation "com.google.accompanist:accompanist-systemuicontroller:x.y.z"
}

เราจำเป็นต้องสร้างฟังก์ชันที่เขียนได้ซึ่งจะตั้งค่าสีของแถบสถานะ (สร้างคลาสSetStatusBarColor.kt ) นี่คือตัวอย่าง:

@Composable
fun SetStatusBarColor(color: Color) {
    val systemUiController = rememberSystemUiController()
    SideEffect {
        systemUiController.setSystemBarsColor(color)
    }
}

ต่อไป เราสามารถเรียกใช้ฟังก์ชันนี้ใน@Composableฟังก์ชันหลักบนMainActivityได้ดังนี้

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            YourAppNameTheme {
                StatusBarColor(color = MaterialTheme.colors.primary)
                // Other content here, example :
                Surface(modifier = Modifier.fillMaxSize(), color = MaterialTheme.colors.background) {
                    YourAppClass()
                }
            }
        }
    }
}

และนั่นแหล่ะ! ด้วยโค้ดเพียงไม่กี่บรรทัด เราสามารถเปลี่ยนสีของแถบสถานะได้อย่างง่ายดายในแอปพลิเคชัน Android ที่ใช้ Jetpack Compose

การใช้งานSystemUiControllerไม่ได้จำกัดแค่การเปลี่ยนสีแถบสถานะเท่านั้น แต่ยังสามารถใช้กับการกำหนดค่า UI ของระบบอื่นๆ ได้อีกด้วย เช่น แถบนำทาง โหมดดื่มด่ำ และอื่นๆ

ฉันมีแอปตัวอย่างโดยใช้การเขียน jetpack ในที่เก็บของฉันgithub.com/im-o

เสร็จแล้วปัดฝุ่น ขอบคุณ!