Odaklanmak için tepki ver

Kompozisyon ağacında odak her değiştiğinde Compose, üst ve alt değiştiricilerin gözlemleyebileceği bir odak etkinliği tetikler. Odak durumu geçişlerini dinlemek, mevcut odak özelliklerini sorgulamak ve duruma dayalı kullanıcı arayüzü güncellemelerini tetiklemek için onFocusChanged değiştiricisini kullanabilirsiniz.

onFocusChanged ile odak durumunu gözlemleme

onFocusChanged değiştiricisi, bir öğe odak kazandığında veya kaybettiğinde FocusState nesnesi sağlar.

Örneğin, özel bileşen durumunu güncellemek için odak değişikliklerini gözlemleyebilirsiniz (ör. bir öğenin kenarlık rengini değiştirme veya animasyon tetikleme):

var color by remember { mutableStateOf(Color.White) }
Card(
    modifier = Modifier
        .onFocusChanged {
            color = if (it.isFocused) Red else White
        }
        .border(5.dp, color)
) {}

Bu örnekte, remember yeniden oluşturma işlemleri sırasında kenarlık rengini depolar ve öğenin odak durumu her değiştiğinde kenarlık rengi güncellenir.

FocusState özellikleri

onFocusChanged işlevine iletilen FocusState nesnesi üç temel özellik sağlar:

  • isFocused: Bu değiştiricinin eklendiği belirli composable, şu anda etkin giriş odağına sahipse true değerini döndürür.
  • hasFocus: Bu composable veya alt composable'larından herhangi biri şu anda odaklanmışsa true değerini döndürür. Bu, içindeki herhangi bir alt öğenin ne zaman etkin olduğunu bilmesi gereken üst kapsayıcılar (ör. kartlar veya araç çubukları) için kullanışlıdır.
  • isCaptured: Odak şu anda öğeye kilitlenmişse (ör. captureFocus() kullanılarak yapılan modal alt etkileşimler sırasında) true değerini döndürür. Odak yakalandıktan sonra odağı diğer öğelere taşımaya çalışmak odağı temizlemez.
Modifier.onFocusChanged { focusState ->
    val isFocused = focusState.isFocused
    val hasFocus = focusState.hasFocus
    val isCaptured = focusState.isCaptured
}