มาลองเขียน Android Jetpack Compose

Jetpack Compose UI App Development Toolkit - Android Developers

Jetpack Compose is Android’s recommended modern toolkit for building native UI. It simplifies and accelerates UI development on Android. Quickly bring your app to life with less code, powerful tools, and intuitive Kotlin APIs.

Android Developers

เครื่องมือตัวใหม่ ของ Android Native ที่ปรับการเขียน Code ใหม่หมดเลย วันนี้จะพาไปลองเขียน Jetpack compose กัน

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            Text("Hello world!")
        }
    }
}

เริ่มจาก Compose นี่เราจะลืมการทำ XML ไปเลยครับ เพราะตัว Compose จะสร้าง View ผ่าน Java/Kotlin อย่างเดียวเลย จะเรียกว่า Composable Function จากตัวอย่าง Text ก็เป็น Composable Function ชนิดหนึ่งเหมือนกันครับ

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MessageCard("Android")
        }
    }
}

@Composable
fun MessageCard(name: String) {
    Text(text = "Hello $name!")
}

เราสามารถสร้าง Composable Function โดยการใส่ @Composeable ไปยัง Function ที่เราสร้างขึ้น

ถ้าต้องการ ให้ แสดง หน้าตา ระหว่าง dev อยู่ ตัว Compose Function อยู่ ให้เราสามารถเติม @Preview ลงไปใน Compose Function ตัว ที่ dev จะแสดง บนหน้าตา Design ของ IDE ครับ

@Preview
@Composable
fun MessageCard(name: String) {
    Text(text = "Hello $name!")
}

นี่คือการเริ่มต้น สำหรับ Android Jetpack Compose สามารถศึกษาต่อได้ที่ ลิงค์ด้านล่างได้เลยนะครับ ขอในสนุกกับ Jetpack Compose แบบใหม่ครับ

Jetpack Compose UI App Development Toolkit - Android Developers

Jetpack Compose is Android’s recommended modern toolkit for building native UI. It simplifies and accelerates UI development on Android. Quickly bring your app to life with less code, powerful tools, and intuitive Kotlin APIs.

Android Developers