Lazy Column -Jetpack Compose’da durum yönetimi ile paralel işleme | tarafından Saurabh Pant | Haz, 2022

Lazy Column -Jetpack Compose'da durum yönetimi ile paralel işleme |  tarafından Saurabh Pant |  Haz, 2022

Bazen tembel bir durumda olmak iyi hissettiriyor!!

Kaynak: https://www.aiche.org/

Android uygulama geliştiricileri olarak bizlerin çokça karşılaştığı yaygın bir senaryo vardır ve bu bir listeye sahip olmak ve her öğe tıklamasında arka planda bazı verileri işlememiz ve nihai sonucu liste öğesine geri yansıtmamız gerektiğidir.

instagram gibi bir liste düşünelim ve ‘Beğenmek’ düğmesini tıkladığınızda, sunucudaki verileri güncelleyen ve başarılı sonuç üzerine, ‘Beğenmek’ düğme arka planı farklı renge dönüşür. Şimdi bu, listedeki tek bir eylemdir. Bir kullanıcı tıklayabilir ‘Beğenmek’ Listedeki farklı öğeler üzerinde düğmesine basın ve elde edilen sonuca göre her öğe için listemizi doğru bir şekilde güncellememiz gerekiyor.

Bu yazıda, birden fazla öğe için liste durumumuzu nasıl yönetebileceğimizi ve verileri arka planda eşzamanlı olarak nasıl işleyebileceğimizi ve bunları kullanıcı arayüzünde doğru şekilde nasıl güncelleyebileceğimizi göreceğiz.

Sonuç

Sonunda aşağıdaki sonucu elde edebileceğiz.

varsayım

20 öğeden oluşan bir listemiz olduğunu varsayacağız (daha fazla/daha az olabilir) ve her öğeye tıklamak bir süre için bir arka plan görevi başlatır. Gecikme işlevini kullanarak uzun süredir devam eden görevi simüle edeceğiz ve bu gecikme her öğeye rastgele atanacak, böylece tüm öğelerin kendilerini rastgele güncellediğini görebilelim.

Kontrol akışı

Kontrol akışı

Akışı kodlayalım

Eğitim amaçlı temel bir liste öğemiz olacak (burada süslü şeyler yok).

Jetpack oluşturmada özel görünümlerin/düzenlerin nasıl oluşturulacağını kontrol etmek istiyorsanız, Bu ve Bu bir okuma. Hayal kırıklığına uğramayacaksın.

O halde önce liste öğemizi oluşturalım.

Ve bu gibi görünüyor

Liste öğesi — Başlatılmadı

Liste öğemiz, tıklandığında bir yükleyici başlatacak ve rastgele bir süre boyunca bir arka plan görevi başlatacak ve aşağıdaki gibi görünüyor

Liste öğesi — Devam ediyor

Görev geri döndüğünde, kontrol edildi olarak işaretler.

Liste öğesi — Tamamlandı

Tamam! Artık liste öğemizin nasıl çalışacağını biliyoruz. Listemize ekleyelim.

Kod kendini açıklayıcıdır. Burada dikkat edilmesi gereken birkaç önemli nokta:

  • Liste öğemiz vatansızdır ve bu önemlidir. Devlet kaldırmasını izlemeliyiz.
  • Olay işleme, Görünüm modelinde yapılır.
  • Durum değiştikçe liste öğesinde güncellenir.

Bize durum ve veri işleme sağlayan modeli görüntülemeye geçelim.

hazırlıyoruz Eşya listesi dizin olarak kimliği olan 20 öğeden. Kullanarak listemiz için durumu oluşturuyoruz mutableStateListOf() ve ayrıca bu listenin değişmez bir durumunu şu şekilde oluşturur: öğelerDevlet. Son olarak init bloğunda liste nesnelerimizi değişken durumumuza ekliyoruz.

Şimdi öğemize tıklandığında, içinde olup olmadığını kontrol ediyoruz. Başlatılmadı durumu daha sonra yeni bir eşyordam başlatır ve öğe kimliğini iletiriz. Daha sonra küçük bir rastgele gecikme oluştururuz ve gecikme sona erdiğinde, öğe kimliği görev durumumuzu güncelleriz ve bu da etkilenen liste öğemizin yeniden oluşturulmasını zorlar.

Burada G/Ç göndericisini sadece bazı G/Ç işlemleri yaptığımızı simüle etmek için kullanıyoruz. Son olarak, kapsamımız bittiğinde eşyordamlarımızı iptal ediyoruz.

override fun onCleared() {
super.onCleared()
viewModelScope.cancel()
}

kahretsin! Artık eşzamanlı aramalar yaptığımız ve öğelerimizi buna göre güncellediğimiz çıktıya sahibiz.

Bir kez daha aşağıda referans için çıktıdır.

Kodun tamamını şu adresten kontrol edin:

hadi bağlanalım orta veya üzerinde github.

Ve bir sonraki ilginç eğitimde tekrar görüşürüz.

Bir sonrakine kadar…

Şerefe!

Bir cevap yazın

E-posta hesabınız yayımlanmayacak.