ขอโฟกัสแบบเป็นโปรแกรม

ในโฟลว์ผู้ใช้บางรายการ แอปพลิเคชันของคุณต้องย้ายโฟกัสไปยังคอมโพเนนต์ที่เฉพาะเจาะจงอย่างชัดเจน ตัวอย่างเช่น เมื่อผู้ใช้คลิกปุ่ม "ค้นหา" คุณอาจต้องการโฟกัสไปที่ช่องป้อนข้อมูลการค้นหาโดยอัตโนมัติ

ใช้ FocusRequester

วิธีขอโฟกัสอย่างชัดแจ้ง

  1. สร้างและจดจำอินสแตนซ์ FocusRequester: val focusRequester = remember { FocusRequester() }
  2. แนบ FocusRequester กับ Composable เป้าหมายโดยใช้ตัวแก้ไข focusRequester
  3. เรียกใช้ requestFocus() ภายใน Callback ของเหตุการณ์ (เช่น onClick) หรือขอบเขตโครูทีน

val focusRequester = remember { FocusRequester() }
var text by remember { mutableStateOf("") }

TextField(
    value = text,
    onValueChange = { text = it },
    modifier = Modifier.focusRequester(focusRequester)
)
 

val focusRequester = remember { FocusRequester() }
var text by remember { mutableStateOf("") }

TextField(
    value = text,
    onValueChange = { text = it },
    modifier = Modifier.focusRequester(focusRequester)
)

Button(onClick = { focusRequester.requestFocus() }) {
    Text("Request focus on TextField")
}

ตั้งค่าโฟกัสหน้าจอเริ่มต้น

หากต้องการวางโฟกัสเริ่มต้นบนคอมโพเนนต์ที่เฉพาะเจาะจงเมื่อหน้าจอปรากฏขึ้นเป็นครั้งแรก ให้เรียกใช้ requestFocus() ภายใน LaunchedEffect(Unit) ดังนี้

LaunchedEffect(Unit) {
    focusRequester.requestFocus()
}

เมื่อไปยังส่วนต่างๆ ระหว่างคอนเทนเนอร์หรือกลับมาจากหน้าจออื่น คุณยังสามารถแนบ focusRestorer() กับคอนเทนเนอร์หลัก เพื่อกลับไปโฟกัสที่รายการย่อยที่โฟกัสล่าสุดโดยอัตโนมัติได้ด้วย ดูข้อมูลเพิ่มเติมได้ที่คู่มือคืนค่าโฟกัส

ก่อนหน้า
แสดงความรู้สึกเพื่อให้โฟกัส
ถัดไป
ย้ายและล้างโฟกัส