Odaklanma geçiş sırası

Kullanıcılar, Sekme tuşunu veya yön (ok / D-pad) tuşlarını kullanarak klavye odağını kullanıcı arayüzü öğeleri arasında taşıyabilir:

  • Sekme / Üst Karakter+Sekme: Odağı tek boyutlu görünüm sırasına göre ileri veya geri taşır.
  • Yön tuşları: Odağı iki boyutlu olarak hareket ettirir (Yukarı, Aşağı, Sol ve Sağ).

Tek boyutlu odak geçişi

Tek boyutlu odak geçişinde, Sekme tuşu, ekrandaki görsel görünüm sırasına göre kullanıcı arayüzünde odağı ilerletir.

Örneğin, dört düğme satırlar halinde düzenlendiğinde:

Column {
    Row {
        Button(onClick = { /* ... */ }) { Text("1st") }
        Button(onClick = { /* ... */ }) { Text("2nd") }
    }
    Row {
        Button(onClick = { /* ... */ }) { Text("3rd") }
        Button(onClick = { /* ... */ }) { Text("4th") }
    }
}

Sekme tuşuna basıldığında odak, aşağıdaki sırayla düğmeler arasında sırayla hareket eder:

  1. 1. düğme (üst-başlangıç)
  2. 2. düğme (üst uç)
  3. 3. düğme (sol alt)
  4. 4. düğme (alt uç)

Son öğede Sekme tuşuna basıldığında ilk odak hedefine geri dönülür. Üst Karakter+Sekme tuşlarına basıldığında odak ters sırada taşınır.

İki boyutlu odak geçişi

Klavyedeki ok tuşlarına basmak veya D-pad kullanmak, iki boyutlu odak geçişini tetikler.

İki boyutlu gezinmede sistem, istenen yöndeki en yakın hedefi belirlemek için kullanıcı arayüzü öğelerinin geometrik koordinatlarını ve uzamsal sınırlarını inceler.

İki boyutlu odak geçişi başa dönmez. Kullanıcı en alttaki öğeye odaklanmışken Aşağı tuşuna basarsa odak, ekranın üst kısmına atlamak yerine bu öğede kalır.

İşaretçi tıklamalarıyla odak geçişini sıfırlama

Masaüstü veya büyük ekranlı cihazlarda fiziksel klavye ile fare ya da dokunmatik alan arasında geçiş yaparken:

  • Dokunma veya tıklama ile odağı temizleme: Fare veya dokunmatik alan ile etkileşimli olmayan bir alana tıklamak ya da dokunmak, odağı etkin öğeden kaldırır.
  • Geçişi yeniden başlatma: Odak temizlendikten sonra, Sekme tuşuna bir sonraki basışta, daha önce etkin olan öğeden devam etmek yerine görsel görünüm sırasına göre ilk odak hedefinde tek boyutlu geçiş yeniden başlatılır. İki boyutlu odak geçişiyle aynıdır. Yön tuşları, klavye odağını istenen yöndeki en yakın odak hedefine taşır.

Odağı programatik olarak temizleme hakkında ayrıntılı bilgi için Odağı taşıma ve temizleme başlıklı makaleyi inceleyin.

Odak geçiş sırasını özelleştirme

focusProperties değiştiricisini kullanarak gezinme davranışını özelleştirebilirsiniz.

Tek boyutlu gezinme sırasını özelleştirme

Tek boyutlu gezinmeyi geçersiz kılmak için next veya previous özelliğini FocusRequester ile belirtin:

  1. remember { FocusRequester() } ile bir FocusRequester nesnesi oluşturun.
  2. focusRequester değiştiricisini kullanarak FocusRequester öğesini hedef composable'a ekleyin.
  3. Kaynak composable'a focusProperties değiştiricisini uygulayın ve FocusRequester değerini next (Sekme için) veya previous (Üst Karakter+Sekme için) olarak atayın.

val (first, second, third) = remember { FocusRequester.createRefs() }

Column {
    Button(
        onClick = { /* ... */ },
        modifier = Modifier
            .focusRequester(first)
            .focusProperties { next = third }
    ) {
        Text("First (Tab jumps to Third)")
    }
    Button(
        onClick = { /* ... */ },
        modifier = Modifier.focusRequester(second)
    ) {
        Text("Second")
    }
    Button(
        onClick = { /* ... */ },
        modifier = Modifier.focusRequester(third)
    ) {
        Text("Third")
    }
}

İki boyutlu gezinme sırasını özelleştirme

Benzer şekilde, focusProperties içinde up, down, start, end, left veya right'ya FocusRequester örnekleri atayarak iki boyutlu odak gezinmesini geçersiz kılabilirsiniz:

val (topButton, bottomButton) = remember { FocusRequester.createRefs() }

Button(
    onClick = { /* ... */ },
    modifier = Modifier
        .focusRequester(topButton)
        .focusProperties {
            down = bottomButton
            right = bottomButton
        }
) {
    Text("Top button")
}
Button(
    onClick = { /* ... */ },
    modifier = Modifier.focusRequester(bottomButton)
) {
    Text("Bottom button")
}

Belirli bir yönde odak gezinmesini engellemek için (örneğin, düzen sınırlarında) ilgili özelliğe FocusRequester.Cancel değerini atayın (örneğin, down = FocusRequester.Cancel). Belirli bir yön için sistemin varsayılan gezinme algoritmasını açıkça korumak istiyorsanız FocusRequester.Default değerini atayın.