Projemiz açıldıktan sonra karşımıza ilk çıkan App.cs classımız hakkında biraz detay vermek istiyorum.

App.cs

{

Projemizi çalıştırdığımızda ilk tetiklenecek olan sınıftır.

Droid projesini emulator yardımıyla çalıştırdığımızı düşünelim ve MainActivity class’inin içerisine bir göz gezdilerim.

Droid projesi çalıştığında uygulamamızın hangi kodları çalıştıracağını burada söylüyoruz. “LoadApplication (new SharedProject.App ());” dikkat çekmek isterim.

Bizim Shared Project katmanımızdaki App.cs dosyamızı işaret etmektedir. Yani App.cs içerisine nasıl bir kodlama yapıyorsak IOS, Android ve WinPhone projelerimizde bu kodlar çalışacaktır.

}

Not : Shared projemize Views ve Models adında 2 adet klasör oluşturuyoruz.

Views klasörüne sağ tıklayarak Add > New Item > Class seçerek Start.cs classımızı oluşturalım.

Start class’ımızı MasterDetailPage class’ından türetiyoruz. Aklınıza şu soruların geldiğini tahmin ediyorum.

MasterDetailPage nedir ve neden Start class’ımızı MasterDetailPage’den türetiyoruz. Bunları hızlı bir şekilde açıklığa kavuşturalım.

Uygulamamıza oluşturacağımız yapı itibariyle menü sayfamızın her sayfaya girildiğinde sol taraftan çıkmasını istediğimiz için master olarak belirlememiz gerekmektedir.

İçerik sayfamız değişken bir sayfa olacağı için detail olarak belirleyeceğiz. İşte Start.cs classımıza da bu yüzden ihtiyaç duyuyoruz ve uygulamamızın master ve detail sayfalarını belirleyeceği main sayfasını MasterDetailPage class’ından türeterek oluşturuyoruz.

Not : MasterDetailPage detaylı ayrıntı : https://developer.xamarin.com/api/type/Xamarin.Forms.MasterDetailPage/

Start.cs uygulamamızın Main sayfası olacaktır ve uygulamamızda açılacak olan menü ve diğer sayfalar Start.cs classımızdan oluşacaktır.

Views klasörümüze sağ tıklayarak > Add > New Item > Cross-Platform > Forms.Xaml Page Menu.cs ve Detail.cs ekliyoruz ve App.cs classımıza dönüyoruz.

Kodlarımızı okuyalım;

Hatırlatma : App.cs, uygulamamızın ortak kodlarının yazılacağı ve sayfalarının belirleneceği sınıf olduğunu yazımızın başında söylemiştik.

MasterDetailPage class’ından türettiğimiz Start class’ım benim uygulamamın main class’ıdır.

Main class’ımın Master sayfası Menu sayfamdır ve uygulamamın detay sayfası benim Detail sayfamdır.

Benim uygulamamın main sayfası ise applicationMainPage (Start.cs) ‘dir.

SharedProject.WinPhone projesine sağ tıklayarak “Set as StartUp Project” diyoruz ve uygulamamızı çalıştırıyoruz.

Uygulamamızı çalıştırdığımızda, “Title propert must be set on Master page” hatasını alacağız. Uygulamamız master sayfasının başlığının belirlenmek zorunda olduğunu söylüyor.

Menu sayfamıza gidip Title özelliğini belirliyoruz ve Detail.xaml sayfamızdaki Label’ın text özelliğini değiştirip uygulamamızı çalıştırıyoruz.

ViewModel klasörümüze sağ tıklıyoruz ve MenuModel adında bir class ekliyoruz ve 2 adet property tanımlıyoruz (int Id, string Title).

Menu.cs içerisinde modelimizi dolduruyoruz. (Önümüzdeki makalelerde veritabanı ve web servis olarak kullanacağız.)

Menu.xaml içerisine ListView atarak menü itemlarımızın listelenmesini sağlayacağız.

Burda dikkat edilmesi gereken nokta Label’ın text özelliği “{Binding Title}” hatırlayadığınız gibi MenuModel’imizde Title propertysine karşılık gelecektir. Yaptığınız örnek geliştirmelerde buna dikkat edilmesi gerekmektedir. Bir model üzerinden bind ettiğiniz bir item model property adı ile aynı olmalıdır!ListView içerisinde x:Name=”lstMenu” ile oluşturmuş olduğumuz ListView item’ına ID belirlemiş olduk.

Oluşturduğumuz modelimizin hemen altına oluşturduğumuz ListView item’ının ItemSource özelliğinie modelimizi set ediyoruz. ListView senin tekrar ederek göstereceğin model benim MenuModel’im demiş oluyoruz ve uygulamamızı çalıştırıyoruz.

Menu sayfasından diğer sayfalara geçişleri diğer makalemizde ayrıntılı bir şekilde inceleyeceğiz.

Detail.xaml sayfamız’a bir adet button ve bir adet label atıyoruz ve butonumuzun Clicked property’sine cs tarafından hangi metodu tetikleyeceğini belirtiyoruz. Clicked=”btnClicked”

Detail sayfamızın cs tarafına geçtiğimizde btnClicked event’ini yazıp içerisine yapacağımız işlemleri kodladık.

Uygulamamızı çalıştırıp butonumuza tıklıyoruz ve yaptığımız tüm kodlamanın sorunsuz çalıştığını görüyoruz!

Beraber yazdığımız tek kod ve multi-platform shared project örneğimizin sonuna geldik.

Umarım sizin için de keyifli bir uygulama olmuştur.

Kaynak kodlara github üzerinden ulaşabilirsiniz. xamarintr-git

Tek kod ile aynı anda android ortamında çalıştırdığımız videoyu izleyebilirsiniz.

Sevdiğiniz dili kullanın, tek kod yazın, her yerde çalışan mobil çözümler üretin.