Merhaba,

Bu örneğimizde ListView’in tüm özelliklerinden yararlanarak verilerimizi bu özelliklere göre nasıl kullanabileceğimizi inceleyeceğiz.

Örneğimizi Portable Class Library proje tipi üzerinden yapacağız.

NOT: Bu örneğimizi incelemeden önce Xamarin Forms Converters örneğimizi incelemenizi tavsiye ederim.

Senaryo

Beşiktaş JK futbol takımı oyuncularının bilgilerinin listelendiği, futbolcu ismine göre veya ülkesine göre gruplama yapabildiğim, listview içerisindeki bir futbolcu üzerine basılı tuttuğumda bilgilerini Alert olarak yayınlayabildiğim, futbolcu detayına gidip, o futbolcunun diğer özelliklerini görebildiğim bir uygulama yapacağız.

Kaynak : http://www.bjk.com.tr/tr

Klasör Yapısı : Data, Images, Utility, Views

Data : Converter ve POCO Binding işlemleri’nin yapıldığı klasör.

Images : Oyuncu ve Ülke resimlerinin bulunduğu klasör.

Utility : Generic Grouping helper sınıfının bulunduğu klasör.

Views : Players.xaml ve Detail.xaml sayfaları’nın bulunduğu klasör.

Converter sınıfları için gözden kaçırmamamız gereken bir durum var. Futbolcu ve ülke resimlerinin okunacağı kaynağın değiştirilmesinde bize çok yardımcı olacak.

Normal şartlarda bir uygulama geliştirdiğinizde üzerinde çalıştığımız ortam kullandığımız resimleri kendi dosyaları içerisinde arayacağı için, her ortam için resimleri kopyala/yapıştır ile ilgili dosya içerisine atmamız gerekiyor. Bu durum tekrar etmiş, gereksiz veri demek oluyor. Fakat Xamarin Forms Converter ile bu durumu kontrol edebiliyoruz!

Yazmış olduğumuz ImageResourceConverter sınıfı ile resimlerimizi kodlarımızı paylaştığımız katman olan PCL katmanından okuması gerektiğini söyleyebiliyoruz. IValueConverter anlatımı için tıklayın.

Fakat burada dikkat etmemiz gereken bir nokta daha var. Resimlerimizin Build Action değerini Embedded Resource olarak değiştirmemiz gerekiyor.

ListView özelliklerini açıklamayla devam edelim..

CachingStrategy : Adından anlaşıldığı gibi ListView’in performansını optimize etmeye yarıyor. 2 adet CachingStrategy mevcut. RetainElement (default) ve ReCycleElement

RetainElement : ListView içerisinde çok sayıda özel kontrol (viewcell, textcell gibi..) bağlantısı barındıryorsanız (30+) ve kontrol şablonları sık değişime açık ise RetainElement kullanılması öneriliyor.

ReCycleElement : RetainElement’in tam tersi olarak ListView içerisinde az sayıda özel kontrol bağlantısı varsa ve ListView içerisindeki veriler birbirinden bağımsız listelenip veri güncellenme durumu çok sık oluşmuyorsa ReCycleElement kullanımı öneriliyor.

Not : Bu örneğimizde ReCycleElement Caching kullanacağız.

Not : ListView CachingStrategy durumuna ek olarak özel renderer yöntemi ile daha fazla performans kazanabilirsiniz.

IsPullToRefreshEnabled : Cihaz üzerinde yukarıdan aşağıya doğru parmağınızla bir çekme işlemi yaptığınızda güncelleme işlemi’nin aktif olmasını sağlayan özellik.

Refreshing : Güncelleme işleminde hangi event’in tetikleneceğini söylediğimiz özellik.

IsGroupingEnabled : ListView üzerindeki verileri gruplayarak listeleyeceğinizi belirttiğimiz özellik.

GroupDisplayBinding : Gruplama başlığımız. (A – B – C gibi)

GroupShortNameBinding : Gruplamayı hangi özelliğe göre yapacağını belirlediğimiz özellik.

Footer : ListView üzerinde verilerimizin en altında sabit ve değişmeyen bir şekilde göstereceğimiz veriyi belirlediğimiz özellik.

Footer özelliğine dikkat edersek Count diye bir veriyi bind ettiğini görüyoruz, fakat bizim sınıfımızda Count yoktu!

{Binding Count, Source={x:Static local:BJKFactory.Players}}

Not : Footer özelliği üzerinde Binding işlemi yaparken Source belirleyebiliriz. Belirlediğimiz veriyi FooterTemplate içerisinde kullanabilriiz. Yukarıdaki örneğimizde BJKFactory.Players diyerek static nesnemizin verilerini almış oluyoruz.

24 players

Gördüğünüz gibi bu sayede ListView kontrolümüzün FooterTemplate’ine veri kümesi taşıyabildik.

Aslında örneğimizin en önemli kavramlarından biri gruplama işlemi.

Sorgumuzu Grouping sınıfına OrderBy ve GroupBy anahtarlarını belirleyerek ve geriye Gruplanmış bir veri dönmesini isteyerek oluşturuyoruz.

Grouping sınıfını debug ettiğimizde Key değerinin “A” geldiğini ve “A” Key değerine karşılık verimizde adı “A” ile başlayan 3 oyuncu olduğunu görüyoruz. (FullName özelliğini kullandığımız için, Alexis Ruano Delgado, Andreas Beck, Atiba Hutchinson)

Aslında her bir Key değeri kendi listesini oluşturuyor. İşte burası çok önemli!!!

“A” Key’i için 3, “D” Key’i için 2, “G” Key’i için 2 gibi.. Yani ListView içerisindeki veri listesi içeirisinde listeler bulunmakta.

ListView’i her yenilediğimde (Pull To Refresh) gruplama özelliğimin değişmesini istiyorum.

Çok basit bir değişken tanımlaması ve işlemiyle bunu gerçekleştirebiliyorum.

Not : Bu kısım çok değişik fikirlere açık 🙂

ListView.ItemTemplate özelliği ile verilerimizi bind edip, istediğimiz verileri converter işleminden geçirebiliyoruz.

Burada dikkat etmemiz gereken nokta ViewCell.ContextActions 

ViewCell.ContextActions : ListView içerisindeki bir veriye basılı tuttuğumuzda ListView üzerinde bir button veya istediğimiz bir MenuItem çıkmasını ve işlem yapmamızı sağlamaktadır.

Not : Örneğimizdeki data-binding, sınıf oluşturma, .xaml converter kullanımı gibi işlemleri daha önceki örneklerimizde incelediğimiz için atlıyorum.

Uygulamamızı inceleyelim..

Önce FullName özelliğine göre gruplanmış ve sıralanmış geliyor. PullToRefresh ile Ülke adına göre gruplanmış ve sıralanmış olarak değiştiriyorum 🙂

Gruplama ve sıralama işlemlerini istediğiniz gibi oluşturabilirsiniz. ListView için hemen hemen tüm özelliklerini incelediğimizi düşünüyorum.

Görüşmek üzere.

GitHub : ListView Tüm Özellikleri ve Ayrıntılı Kullanımları