Bu eğitim içeriğinde, Master Screen'lerin nasıl oluşturulacağını ve bu ekranların avantajlarından nasıl faydalanabileceğinizi keşfedeceksiniz. Web uygulamanızın tasarımında tutarlılık, hız ve verimlilik sağlamak için kritik bir yöntemi öğrenmiş olacaksınız. 

Master Screen'ler, web uygulamanızın çeşitli ekranlarında tekrarlanan layout ve tasarım ögeleri - örneğin, üstbilgi, altbilgi ve menü çubukları gibi - için merkezi bir tanım sunar. Bu yapı, geliştiricilere ekran düzeni ve tasarımının tutarlılığını kolay bir şekilde yönetme ve güncelleme fırsatı verir. Master Screen yapısının nasıl işlediğini merak ediyor musunuz? Gelir detaylara birlikte göz atalım. 

İlk olarak, Kuika Low-code platformu üzerinde bir Master Screen nasıl oluşturulur bunu öğreneceğiz. Kuika ile, ekranlarınızda kullanabileceğiniz ortak ögeleri barındıracak tasarımları Master Screens kullanarak hazırlayabilirsiniz.

Şimdi gelin bir Master Screen oluşturalım.

Screens paneli üzerinden yeni bir Master Screen oluşturduğunuzda üst, sol ve alt kenarlara ait sabit Layout'lar varsayılan olarak açık gelir.

Properties paneli ile Layout'ların yerleşimini, durumunu ve biçimini ihtiyacınıza uygun olarak yönetebilir ve farklı kombinasyonlar oluşturabilirsiniz.

Örneğin sadece üst ya da sadece Sol Layout'un yer alacağı bir yerleşim veya Üst ve Sol Layout'un açık olacağı bir yerleşim yapabilirsiniz. 

Layout yapısına karar verdikten sonra, Master Screen'de yer alacak elementleri sürükle bırak ile ekleyebilirsiniz.

Örneğin, Master Screen ile bir Header yani üstbilgi tasarımı hazırlayacağınız senaryoyu düşünelim.

1. Üst Layout açık kalacak şekilde Layout yerleşiminizi düzenledikten sonra üstte yer alan Layout'ta bulunan Row’u tek kolona dönüştürün. 
2. Kolon içerisine bir Horizontal Stack ekleyin.
3. Horizontal Stack içerisine bir Image bir de Label sürükleyin.
4. Image için örnek bir logo görseli seçin. ImageFit ve Stil düzenlemelerini gerçekleştirin.
5. Label’i seçin ve örnek bir ekran ismi girip, Stil düzenlemelerini yapın.
6. Horizontal Stack’i seçin ve hizalamaya yönelik düzenlemeleri gerçekleştirin.

Master Screen kullanarak basit bir Header tasarımı hazırladık. Şimdi bu tasarımı farklı ekranlarda nasıl kullanacağımıza bir bakalım.

7. Master Screen kullanacağınız örnek ekranı açın.
8. Ekranın Properties panelini kullanarak Master Screen seçimini yapın.

Böylece örnek bir Master Screen çalışmasını tamamladınız.

Master Screen kullanımı, uygulama geliştirme sürecinde tasarım tutarlılığını sağlar, süreci hızlandırır ve gelecekteki değişikliklerin kolay yönetimini mümkün kılar.