Windows 10 UWP Uygulamasında {x:Bind} Kullanarak Basit DataBinding

​Bu makaleyi okumadan önce Windows 10 UWP uygulamasında Page.Resources içinde Style kullanmak makalesini okumanızı tavsiye ederim.
En son geliştirdiğimiz hali ile ekranımız aşağıdaki şekilde gözüküyor olmalı:
Databinding yapabilmek için öncelikleMainPage.xaml.cs dosyasını açıp,binding yapacağımızproperty’leri vevarsavarsayılan değerlerini tanımlıyoruz.
Bu örnekte saat, dakika ve saniyenin her hanesini ayrı gösterebilmek için Hour1, Hour2, Minute1, Minute2, Second1 ve Second2 property’lerini aşağıdaki gibi tanımladım;
public string Hour1 { get; set; } = “0”;
public string Hour2 { get; set; } = “0”;
public string Minute1 { get; set; } = “0”;
public string Minute2 { get; set; } = “0”;
public string Second1 { get; set; } = “0”;
public string Second2 { get; set; } = “0”;
Artık ekrandakiTextblock nesnelerini güncelleyebiliriz, RefreshDisplay() methodunu tanımlayıp, içerisinde yukarıda tanımladığımız property’lere değer ataması yapıyoruz;
private void RefreshDisplays()
{
var now = DateTime.Now;

var hour = now.Hour.ToString(“00”);
var minute = now.Minute.ToString(“00”);
var second = now.Second.ToString(“00”);

Hour1 = hour.Substring(0, 1);
Hour2 = hour.Substring(1, 1);

Minute1 = minute.Substring(0, 1);
Minute2 = minute.Substring(1, 1);

Second1 = second.Substring(0, 1);
Second2 = second.Substring(1, 1);
}
Sayfa açıldığında RefreshDisplays() methodunu çağırabilmek için sayfanın açıldığı anı bilmemiz ve tam orada RefreshDisplays() methodunu çağırmamız lazım.
Windows 10 UWP uygulamalarında bir sayfanın açıldığı anıPage sınıfında tanımlı olanOnNavigatedTo() methodunda yakalayabiliyoruz.
MainPage sınıfımızın base class’ı olan Page sınıfında tanımlı olan OnNavigatedTo() methodunda kod çalıştırabilmek için OnNavigatedTo methodunu override etmemiz lazım;
protected override void OnNavigatedTo(NavigationEventArgs e)
{
base.OnNavigatedTo(e);

RefreshDisplays();
}
override ettiğimiz OnNavigatedTo() methodunun içerisinde RefreshDisplays() methodunu çağırıyoruz.
Databinding için code-behind tarafında yapmamız gereken tüm hazırlıkları yaptık, şimdi MainPage.xaml dosyasını açarak binding kodlarını tamamlayalım.
MainPage.xaml dosyasında yeralan nesnelerden binding yapmak istediklerimizin, binding yapmak istediğimiz property’lerine değer olarak {x:Bind} ataması yapmalıyız.
Bu örnekte, Textblock nesnelerinin Text property’lerine binding yapmak istiyoruz, MainPage.xaml dosyasındakiGrid elementini aşağıdaki kodlara dönüştürüyoruz;

MainPage.xaml dosyasında sayfamızın ön izlemesi aşağıdaki gibi gözükmeli:
Eğer uygulamayı çalıştıracak olursakzaman bilgisi aşağıdaki şekilde ekranda gözüküyor olmalı:
​