LongListSelector kontrolü bize büyük verilerimizi ekranda göstermeyi sağlar. LongListSelector’e örnek olarak Twitter gösterilebilir. Bununla ilgili kod örneğini Msdn’de görebilirsiniz: http://code.msdn.Microsoft.com/wpapps/TwitterSearch-Windows-b7fc4e5e
Ben bu yazımda basit bir şekilde verileri nasıl longlistselector ile kullanırız ondan bahsedeceğim. LongListSelector kullanarak bir takım kişilerin isim ve maillerini göstereceğim. Öncelikle boş bir proje açalım ve içine LongListSelector kontrolünü ekleyelim.
Resim-1
Projeye sağ tıklayıp Add-Class yollarını izleyerek bir Class oluşturalım.
Resim-2
Resim-3
Bu Class’ımızda verimizin property’lerini belirteceğiz, daha sonra bunu MainPage’de kullanacağız. Bu yüzden Class’ı oluşturduğumuzda ilk yapacağımız iş bunu Public yapmak. Eğer siz hiçbir şey yapmazsanız Compiler bunu otomatik olarak Private algılar.
Resim-4
Benim senaryomda şuan sadece isim ve mail olduğu için bu Property’leri ekledim. Prop yazıp Tab’a iki kere tıkladıktan sonra kolayca Property oluşturabilirsiniz, bu da Visual Studio’nun sunmuş olduğu bir güzellik :)
Resim-5
Data Classımızla işimiz bu kadar. Şimdi MainPage.xaml.cs ‘de verilerimizi ekleyeceğiz. Bunun için Global bir List oluşturup ona Add metoduyla tek tek kullanıcıların isim ve maillerini gireceğiz.
Resim-6
Ekledikten sonra, son olarakta DataContext’imize verilerimizi eklediğimiz listeyi atamayı unutmuyoruz.
En başta eklemiş olduğumuz LongListSelector’un ItemSoruce’unu Binding yaptıktan sonra ItemTemplate oluşturmamız gerekiyor. StackPanel’i bir konteynır olarak düşünebilirsiniz. StackPanel’e eklenilen veriler alt alta veya yan yana sıralanır. Eğer hiçbir şey yapmazsanız StackPanel default olarak alt alta ekler. Yan yana eklemek için aşağıdaki xaml kodunu kullanabilirsiniz.
<StackPanel Orientation=”Horizontal” >
Resim-7
İlk textblock ‘ a isim, hemen altına ikinci textblock’a da mail’i yazmasını istediğim için yukarıdaki gibi kullandım. Emülatorde çalıştırdığımda karşıma çıkan sonuç;
Resim-8
Bu konuyla ilgili sorularınızı alt kısımda bulunan yorumlar alanını kullanarak sorabilirsiniz.
Referanslar
