Windows 8 Search Contract Uygulamasi

Daha onceden Windows 8 ile veri goruntuleme uygulamai hazirlamistik hatirlayacaginiz gibi. Eger bu makaleye ilk kez ulasiyorsanizda bu linkten yararlanabilirsiniz :  https://sevdanurgenc.com/archives/2739 Bu makalemizde ise Windows 8 de kullanilan Charms menuzundeki Search islemini projelerimize nasil ekleyebiliriz ondan bahsedecegim. Onceden olusturmus oldugum proje uzerinden calismaya devam edebiliriz. Uygulamamız içerisinde Charms menüsündeki Ara simgesini kullanarak arama yapılabilmesini desteklemek için projemize geri dönelim. Uygulamalarımıza çeşitli ek özellikler katabilmek için, projemiz içerisinde yer alan Package.appxmanifest dosyasının içerisinde, Capabilities ve Declerations kısımlarında bir takım tanımlamalar yapmalıyız. Uygulamamıza arama özelliği katacak olan Search Contract için gerekli tanımlamayı da Declerations başlığı altından yapabiliriz.

                  Burada ornegin search var,  mesela bunu ekledigimiz zaman, (secip add diyerek ekleyebiliriz) Sectigimizde yeni ekran acilacak, burada calistiracagimiz parametrelerini girebiliriz.

                  Kaydedip f5 e basip calistiralim, yaptigimiz islem sonrasinda ne gibi bir degisiklik oldu bunu gorelim. Uygulamamız acildiktan sonra charms i acip search e tiklayalim.

                  Ve gordugunuz gibi su an application secili degil bizim asagidaki kendi yazdigimiz uygulama , yani su an aktif acik olan uygulama secili durumda.

                    Uygulamamız burada belirdi fakat biz hicbir tanimlama yapmadik. Search e herhangi birsey yazip enter a bastigimizda ya da arama simgesine tikladigimizda herhangi bir islem yapilamayacak. Bu isi yapacak bir metodun bizim tarafimizdan yazilmasi gerekiyor. Bunun icin projeye sag tiklayip add new item yapalim. Projeye sag tiklayip yeni bir search item ekleyelim. Bir search contract ekleyelim.

                  Searchresultpageurun diyelim isim olarak ekleyecegimiz item a. Burada hazir gelen bir gridview var. Bu gridview u kullanmak yerine.  daha onceden olusturdugum main page icerisindeki gridi kullaniyor olacagim. Bunun icin oncelikle projemizi build edelim ve ilgili xaml dosyasini cift tiklayarak tekrar acalim. Resultpage.xaml

                  Simdi, result page icerisinde document outline a gelelim ve bunun icerisindeki result grid i kaldirip, hatta diger filtreleri de kaldirabilirim.

                  Ayni sekilde gordugunuz gibi, snapped modda nasil goruntulenmesi gerektigine dair extradan bir bileşen var, bunu da kaldiralim.

                  Su anda gordugunuz gibi uygulama icerisinde yerini aldi, hizalamasini yapalim ve kod tarafinda icerigini verelim. Simdi result page in cs dosyasina gidelim. Burada gordugunuz gibi defaultview u kendimiz tanimlayabiliyoruz ve hazir bir sekilde geliyor. Ama bundan once bizim burada activated kismi var. Bu kisimda, biz burada gordugunuz gibi query yi alabiliyoruz. Ve query ile birlikte ayni sekilde, load state var.  Ve bu load state in de ozellikle, ilk defa arama yaptiginiz zaman enter a bastiginizda, direkt buraya dusuyor. Load state metoduna breakpoint koyalim. Build edip calistiralim projemizi. Sag dan charms i acip search e tiklayalim. Herhangi birsey yazip enter a basarak arama baslatalim. Break point koydugumuz satira dusecegiz. Buradan, ilgili quey metninin ne oldugunu gorebiliriz. Kutuya yazdigimiz deger aynen buraya iletiliyor. Simdi buraya kendi custom logic imizi koyacagiz yani methodu kodlayacagiz. Bu mothod icerisinde uygulamamizin sonuclari gostermesini saglayacagiz. Katalogdan arama yaparken öncelikle ürünlerimizin listesini oluşturmalıyız ve sonrada bu liste içerisinde verimizi aramalıyız.

SearchResultPageUrun.XAML.CS Kaynak Kodlari ;

public List<Urun> KatalogOlustur() { List<Urun> katalog = new List<Urun>(); Random r = new Random(); for (int i = 1; i <= 32; i++) { katalog.Add(new Urun() { Id = i, Ad = "Ürün " + i, Fiyat = r.Next(10, 51), Marka = "Marka " + i * i, Gorsel = "Images/" + r.Next(1, 4) + ".png" }); } return katalog; } public List<Urun> KatalogAra(string UrunAdi) { List<Urun> urunListesi = KatalogOlustur(); List<Urun> sonuc = (from urunler in urunListesi where urunler.Ad == UrunAdi select urunler).ToList<Urun>(); return sonuc; }   Sonrasında LoadState ‘ e grid içerisine bilgileri getirmesi için gerekli olan querytext ‘ i yönlendiriyoruz. Bunun için tek bir satır kod yazmamız yeterli olacaktır.

gridKatalog.ItemsSource = KatalogAra(queryText);

Simdi projeyi derleyip test edelim. Verleri getir e tıklayalım. Veriler servisten geldi. Simdi ben elimdeki data içerisinde Ürün 7 aramak istiyorum. Charms i acarlim vve search e tiklayalim. Uygulamamiz secili olarak gelecek. “Ürün 7” yazip enter a basalim.

                    Arama baslayacak. LoadState içerisindeki break point bizi durduracak. Vedevam edince katilimci 10 bize gelecek. Buradaki gorsel sunumun daha farkli tasarlanmasi da elinizde. Ben ornegi kisa tutmak icin eski tasarimin aynisini kullandim. Bu projeyi gelistirmeye devam ederken, arama sonuclari uzerine tiklandiginda, detay sayfasina gidilmesini saglayacan kodu yazarak ornegi biraz daha gelistirebiliriz. Bunu saglamak icin, mainpage.xaml icerisindeki selectionchanged metodunu ayni sekilde alabiliriz. Selectionchanged in icini aynen kopyalayalim ve resultpage in cs sayfasina gidelim. Sayfa yuklendiginde selection changed olay metodunun baglanmasini istiyoruz. Bunun icin resultpage in constructorina gidelim ve page’in loaded olayi icin bir olay yakalayici olusturalim. Bu metodun icinde de ihtiyacimiz olan seyi kodlayacagiz. Burada gridkatilimcinin selection changed eventine metot baglayalim. Bu metoda da, mainpage.xaml.cs icerisinden kopyalamis oldugumuz selection changed iverisinde yazili duran kodlari yapistiralim. Boylece tek bir detay sayfasi hem master sayfasina hem de arama sonuclari sayfasina hizmet edebiliyor oldu. Projeyi build edelim. public SearchResultsPageUrun() { this.InitializeComponent(); this.Loaded += SearchResultsPageUrun_Loaded; } void SearchResultsPageUrun_Loaded(object sender, RoutedEventArgs e) { gridKatalog.SelectionChanged += gridKatalog_SelectionChanged; } void gridKatalog_SelectionChanged(object sender, SelectionChangedEventArgs e) { Urun seciliUrun = gridKatalog.SelectedItem as Urun; if (seciliUrun != null) { DetailPage detaySayfasi = new DetailPage(); detaySayfasi.seciliUrun = seciliUrun; Window.Current.Content = detaySayfasi; } Ve calistiralim. Buraya kadarki bolumde varolan bir uygulamaya search entegrasyonunun nasil eklenebilecegini gormus olduk. Ve ilgili custom metodumuz ile birlikte de islevselligi zenginlestirmis olduk.

                    Ayrica Winkey+Q kombinasyonu ile de arama charm’ini acabiliriz. Diger windows 8 kısayollari icin bu linki ziyaret edebilirsiniz. Burada yine katilimci 10 u arayalim ve sonucu alalim. (Birden fazla sonuc dondurecek bir arama da yapabiliriz) sonuc uzerine tiklayalim ve detay sayfasina gelmis olduk gordugunuz gibi. Keyifli Calismalar Dilerim.