LazyColumn ve LazyRow gibi Jetpack Compose'daki kaydırılabilir listeler, büyük miktarda veriyi verimli bir şekilde görüntüleyebilir. Ancak yapılandırma değişiklikleri (ör. cihazı döndürme veya katlanabilir bir cihazı katlama/açma), listenin durumunu sıfırlayarak kullanıcıları önceki konumlarına tekrar kaydırmaya zorlayabilir.
En iyi uygulamalar
Kaydırılabilir listeler, sorunsuz bir kullanıcı deneyimi sağlamak için tüm yapılandırma değişiklikleri sırasında durumlarını (özellikle kaydırma konumu) ve tek tek liste öğelerinin (ör. metin girişleri) durumunu korumalıdır.
Malzemeler
rememberLazyListState(): Listenin kaydırma konumunu kontrol etmek ve gözlemlemek için kullanılan birLazyListStateoluşturur ve hatırlar. Yapılandırma değişiklikleri arasında otomatik olarak kalıcı olur.rememberSaveable: Yapılandırma değişikliklerinde durum değerini hatırlar. Bu, liste öğelerinin durumlarını (ör. metin alanı girişleri) korumak için kullanışlıdır.
Adımlar
Jetpack Compose'da, kaydırma durumu kullandığınızda listenin kaydırma konumu otomatik olarak korunur. Tek tek karmaşık liste öğelerinin (ör. TextField girişleri) durumunu korumak için rememberSaveable kullanın.
1. Liste kaydırma durumunu koruma
Yapılandırma değişiklikleri sırasında listenizin kaydırma konumunu kaydetmek ve geri yüklemek için rememberLazyListState() kullanarak bir LazyListState oluşturun ve bunu kaydırılabilir listenizin state parametresi olarak iletin (ör. LazyColumn).
Oluşturma özelliği, kaydırma konumunu sizin için otomatik olarak korur.
2. Ayrı liste öğesi durumunu koruma
Listenizde durum bilgisi olan öğeler (ör. metin alanları içeren öğeler) varsa bu öğelerin durumu, ekran dışına kaydırılıp geri dönüştürüldüğünde veya yapılandırma değişiklikleri sırasında kaybolabilir.
Tek tek öğelerin durumunu korumak için liste öğesi kapsamı içinde rememberSaveable kullanın. Bu, öğe yeniden oluşturulduğunda veya görünüm alanına geri kaydırıldığında durumunun geri yüklenmesini sağlar.
Aşağıda, hem kaydırma durumu hem de öğe durumu geri yüklemeyi gösteren eksiksiz ve derlenebilir bir uygulama verilmiştir:
// Scroll state is automatically saved and restored by rememberLazyListState val listState = rememberLazyListState() LazyColumn(state = listState) { items(100) { index -> // Use rememberSaveable to preserve individual item state (e.g., text input) var text by rememberSaveable { mutableStateOf("") } TextField( value = text, onValueChange = { text = it }, label = { Text("Item $index") } ) } }
Sonuçlar
Kaydırılabilir listeniz artık kaydırma konumunu ve listedeki her öğenin durumunu geri yükleyebilir.