Oluşturma ile çevirmeli giriş

Döner giriş, saatinizin dönen veya dönen parçalarından gelen girişi ifade eder. Ortalama olarak kullanıcılar kol saatiyle etkileşimde yalnızca birkaç saniye geçirir. Kullanıcılarınızın çeşitli görevleri hızlıca tamamlamasına olanak tanımak için Rotary girdilerini kullanarak kullanıcı deneyiminizi geliştirebilirsiniz.

Çoğu saatte döndürmenin üç ana kaynağı, dönen yan düğme (RSB) ve fiziksel bir çerçeve ya da ekranın etrafında yuvarlak bir dokunma bölgesi olan dokunmatik çerçevedir. Beklenen davranış giriş türüne göre değişebilir ancak tüm önemli etkileşimler için çevirmeli girişi desteklediğinizden emin olun.

Kaydır

Çoğu kullanıcı uygulamaların kaydırma hareketini desteklemesini bekler. İçerik ekranda kaydırılırken, çevirmeli etkileşimlere yanıt olarak kullanıcılara görsel geri bildirim verin. Görsel geri bildirim, dikey kaydırma için konum göstergeleri veya sayfa göstergeleri içerebilir.

Wear OS için E-posta Yaz özelliğini kullanarak kaydırmalı kaydırma işlevini uygulayın. Bu örnekte, bir yapı iskelesi ve dikey olarak kaydırılan bir ScalingLazyColumn uygulaması açıklanmaktadır. İskele, Wear OS uygulamaları için temel düzen yapısını sağlar ve halihazırda kaydırma göstergesi için bir yuvaya sahiptir. Kaydırma işleminin ilerlemesini göstermek için liste durumu nesnesine dayalı bir konum göstergesi oluşturun. ScalingLazyColumn dahil olmak üzere kaydırılabilir görünümlerde, çevirmeli giriş eklemek için zaten kaydırılabilir bir durum mevcuttur. Dönen kaydırma etkinlikleri almak için aşağıdakileri yapın:

  1. FocusRequester kullanarak açıkça odak isteyin.
  2. Kullanıcı ayar düğmesini çevirdiğinde veya çerçeveyi döndürdüğünde sistemin oluşturduğu etkinliklere müdahale etmek için onRotaryScrollEvent değiştiricisini ekleyin. Her döndürme etkinliğinin belirli bir piksel değeri vardır ve dikey veya yatay olarak kaydırılır. Değiştiricide, etkinliğin kullanılıp kullanılmadığını belirtmek için bir geri çağırma da bulunur ve tüketildiğinde üst etkinlik yayılımı durdurulur.
val listState = rememberScalingLazyListState()

Scaffold(
    positionIndicator = {
        PositionIndicator(scalingLazyListState = listState)
    }
) {

    val focusRequester = rememberActiveFocusRequester()
    val coroutineScope = rememberCoroutineScope()

    ScalingLazyColumn(
        modifier = Modifier
            .onRotaryScrollEvent {
                coroutineScope.launch {
                    listState.scrollBy(it.verticalScrollPixels)

                    listState.animateScrollBy(0f)
                }
                true
            }
            .focusRequester(focusRequester)
            .focusable(),
        state = listState
    ) { ... }
}

Ayrık değerler

Alarm ayarlanırken ayarlarda parlaklığı ayarlama veya zaman seçicide sayıları seçme gibi farklı değerleri ayarlamak için de çevirmeli etkileşimleri kullanın.

ScalingLazyColumn işlevine benzer şekilde, seçici, kaydırma çubuğu, step aracı ve diğer composable'lara da çevirmeli giriş elde etmek için odaklanılması gerekir. Ekranda, saat ve dakikalar gibi zaman seçicideki saat ve dakika gibi birden fazla kaydırılabilir hedef olması durumunda, her hedef için bir FocusRequester oluşturun ve kullanıcı saat ya da dakikalara dokunduğunda odağı buna göre değiştirin.

@Composable
fun TimePicker() {
    var selectedColumn by remember { mutableStateOf(0) }
    val focusRequester1 = remember { FocusRequester() }
    val focusRequester2 = remember { FocusRequester() }

    Row {
       Picker(...)
       Picker(...)
    }

    LaunchedEffect(selectedColumn) {
        listOf(focusRequester1,
               focusRequester2)[selectedColumn]
            .requestFocus()
    }
}

Özel işlemler

Uygulamanızdaki çevirmeli girişe yanıt veren özel işlemler de oluşturabilirsiniz. Örneğin, bir medya uygulamasında yakınlaştırma/uzaklaştırma veya ses düzeyini kontrol etmek için çevirmeli girişi kullanın.

Bileşeniniz, ses kontrolü gibi kaydırma etkinliklerini yerel olarak desteklemiyorsa kaydırma etkinliklerini kendiniz işleyebilirsiniz.

// VolumeScreen.kt

val focusRequester: FocusRequester = remember { FocusRequester() }

Column(
    modifier = Modifier
        .fillMaxSize()
        .onRotaryScrollEvent {
            // handle rotary scroll events
            true
        }
        .focusRequester(focusRequester)
        .focusable(),
) { ... }

Görünüm modelinde yönetilen özel bir durum ve çevirmeli kaydırma etkinliklerini işlemek için kullanılan özel bir geri çağırma oluşturun.

// VolumeViewModel.kt

object VolumeRange(
    public val max: Int = 10
    public val min: Int = 0
)

val volumeState: MutableStateFlow<Int> = ...

fun onVolumeChangeByScroll(pixels: Float) {
    volumeState.value = when {
        pixels > 0 -> min (volumeState.value + 1, VolumeRange.max)
        pixels < 0 -> max (volumeState.value - 1, VolumeRange.min)
    }
}

Basitlik adına, yukarıdaki örnekte, gerçekte kullanılırsa aşırı hassas olabilecek piksel değerleri kullanılmaktadır.

Aşağıdaki snippet'te gösterildiği gibi, etkinlikleri aldıktan sonra geri çağırma işlevini kullanın.

val focusRequester: FocusRequester = remember { FocusRequester() }
val volumeState by volumeViewModel.volumeState.collectAsState()

Column(
    modifier = Modifier
        .fillMaxSize()
        .onRotaryScrollEvent {
            volumeViewModel
                .onVolumeChangeByScroll(it.verticalScrollPixels)
            true
        }
        .focusRequester(focusRequester)
        .focusable(),
) { ... }

Ek kaynaklar

Compose'un Wear OS ve diğer Wear OS API'leri için sağladığı işlevleri tamamlayan bir dizi Wear kitaplığı sağlayan Google açık kaynak projesi Horolog'u kullanabilirsiniz. Horology, gelişmiş kullanım alanları ve cihaza özel birçok ayrıntı için uygulama sunar.

Örneğin, farklı çevirmeli giriş kaynaklarının hassasiyeti değişiklik gösterebilir. Değerler arasında daha kolay geçiş için hız sınırlaması uygulayabilir veya geçiş için tutturma veya animasyon ekleyebilirsiniz. Bu, dönüş hızının kullanıcılar için daha doğal görünmesini sağlar. Horology, kaydırılabilir bileşenler ve farklı değerler için değiştiriciler içerir. Ayrıca, odaklanmayı sağlamak için yardımcı programlar ve dokunma teknolojisiyle ses seviyesi kontrolü uygulamak için Ses Kullanıcı Arayüzü kitaplığı içerir.

Daha fazla bilgi için GitHub'da Horologist'i ziyaret edin.