Screens (Ekranlar)
Kuika ile geliştirilen uygulamalarda ekran oluşturarak uygulamada bulunan ekranları çoğaltabilirsin. Ekran oluşturmak için Screens Paneli başlığındaki + ikon butonu ile açılan menüden New Screen’e tıklayın. Açılan New Screen modal da boş bir ekran (Blank) oluşturabileceğiniz gibi şablon ekranlarla da başlayabilirsiniz. CRUD Wizard ve From Excel ile de birkaç tıklamayla ekranlar oluşturabilirsiniz.
Eğer Screen paneli açık durumdayken ekrana veya ekrandaki elementlere tıklandığında otomatik olarak Elements paneline yönlendirme yapılmaktadır.
1. CREATE
1.1. Blank Screen
Blank ekran şablonları boş ekranlardır. Blank, Blank with header ve Blank with header for mobile olmak üzere üç çeşidi vardır.
Blank: Tamamen boş yani üzerinde herhangi bir element bulunmayan bir ekrandır. Bu ekrana erişim kontrollerini Anonymous Access ve All Roles Access ile yapabilirsin.
Blank With Header: Üzerinde sadece Header elementi bulunan ve sadece web uygulamalarında çalışan bir ekrandır.
Blank With Header For Mobile: Üzerinde sadece Header elementi bulunan ve sadece mobil uygulamalarda çalışan bir ekrandır.
Blank ekran oluşturmak için Screens → + ikonu → New Screen → Blank’e tıklayın. Blank çeşidini seçin ve ekran ismi verip CREATE butonuna tıklayın.
1.2. CRUD Wizard
CRUD Wizard, veritabanınıza bağlı Create (Oluştur) Read (Oku), Update (Güncelle) ve Delete(Sil) fonksiyonlarını kullanarak saniyeler içerisinde kolay ekran oluşturan bir yapıdır.
CRUD Wizard ekran oluşturmak için Screens → + ikonu → Screen → CRUD Wizard’a tıklayın.
Datasources: Ekrana Datasource bağlantısının yapıldığı kısımdır.
Screen Type: Oluşturulacak ekranın nasıl görüntüleneceği Screen type ile belirlendiği kısımdır.
Drawer: Sayfanın sağdan, soldan, yukarıdan aşağıdan gelecek navigate edilip o şekilde görüntülenmesini sağlayan ekran tipi’dir.
Modal Box: Sayfanın ortada kutu şeklinde navigate edilip görüntülenmesini sağlayan ekran tipidir.
Current Page: Sayfanın bütün ekranı kaplayacak şekilde navigate edilip görüntülenmesini sağlayan ekran tipidir.
Layout Design: Ekranın görüntülenmesinde kolon düzeninin seçildiği kısımdır.
Choose screen and properties: Oluşturulan ekranda verilerin görünüm ayarlarının belirtildiği kısımdır.
List screen: Datasource içerisinden seçilen tablo bir ekran içerisinde liste olarak oluşturulur.
Create: Veri tablosuna kayıt ekleyebilmek için veri tablosunda yer alan kolonların veri tipine göre veri giriş alanlarından oluşan ekran yapısıdır.
View: Verinin tabloda görüntülenip görüntülenmemesini sağlar. Oluşturulan tabloda göz ikonu ile gösterilir.
Search: Oluşturulan ekran içerisinde search elementini aktifleştirir. Veriler üzerinde search sağlanır. Oluşturulan ekranda arama çubuğu şeklinde görüntülenir.
Pagination: Eklenen veri içeriğine göre sayfalandırılmasını sağlar. Oluşturulan tablo sonunda >,>| şeklinde gösterilir.
Update: Verilerin Güncellemesini sağlar. Oluşturulan tabloda Kalem ikonu ile belirtilir.
Delete: Veri silmeyi sağlar. Oluşturulan tabloda çöp kutusu ikonu ile belirtilir.
Screen name: Oluşturulan ekranın isimlendirildiği alandır. Ardından CREATE butonuna tıklayarak ekran oluşturulur.
1.3. From Excel
Cihazınızda yer alan excel dosyalarını uygulama içerisindeki Database içerisine tablo olarak excel'e import ile ekleyebilirsiniz. Excel import kategorisinde yüklediğiniz Excel dosyasının her bir sayfası bir tablo olarak, her bir kolon başlığı tablo kolonu olarak ve kolon altındaki veriler tabloya yazılacak şekilde Database’e eklenir. Bu tablo ile istenilen seçeneklerle CRUD ekranları oluşturulmaktadır.
From Excel screen oluşturmak için Screens → + ikonu → Screen → From Excel’e tıklayın.
Datasources: Oluşturulacak ekranlarda Choose from computer’a tıklayarak cihazınız içerisinde bulunan Excel dosyalarını entegre edebilirsiniz.
Screen name: Oluşturulan ekranın isimlendirildiği alandır. Ardından CREATE butonuna tıklayarak ekran oluşturulur.
2.ŞABLON (TEMPLATE)
Kuika, uygulama geliştirme sürecini hızlandırmak ve kullanıcıya kolaylık sağlayabilmek için hazır ekran şablonları (Template) sunmaktadır.
2.1. Dashboard templates
Dashboard: Hazır Header yapısı bulunmaktadır. Kalan alanda 1 Row ve bir Table elementi bulunmaktadır. Row içerisinde iki kolon yapısı bulunmaktadır. Kolon yapısı içerisinde Bar Chart ve Donut Chart yapısının ve bir tablonun bulunduğu şablondur.
Card and List: Hazır Header yapısı bulunmaktadır. Kalan alanda 1 Row ve 1 Table elementi yer almaktadır. Row elementinin yapısı 1 kolondan oluşmaktadır.
Two Col: Hazır Header yapısı bulunmaktadır. Kalan alan iki kolondan oluşmaktadır. Birinci kolonda tablo elementi yer alırken ikinci kolon iki Rowdan oluşmuştur. İlk Rowda Bar Chart elementi yer almaktadır. İkinci rowda ise donut chart elementi yer almaktadır.
Three Col : Hazır Header yapısı bulunmaktadır. Kalan alanda 1 Row ve bir Tablo elementi bulunmaktadır. Row içerisinde üç kolon yapısı bulunmaktadır.
Screen name: Oluşturulan ekranın isimlendirildiği alandır. Ardından CREATE butonuna tıklayarak ekran oluşturulur.
2.2. Form templates
Single Column: Form yapısı tek kolondan oluşmaktadır.
Two Columns: Form yapısı iki kolondan oluşmaktadır.
Image Gallery: Form yapısı iki kolondan oluşmaktadır. İkinci kolon yapısında Image Gallery elementi yer almaktadır.
Location Picker: Form yapısı iki kolondan oluşmaktadır. İkinci kolon yapısında Google maps elementi yer almaktadır.
Screen name: Oluşturulan ekranın isimlendirildiği alandır. Ardından CREATE butonuna tıklayarak ekran oluşturulur.
2.3. List templates
Two Columns: Form yapısı iki kolondan oluşmaktadır. Birinci kolon yapısı tablodan oluşmaktadır.
Detailed : Form yapısı tablo, search ve selectbox elementinden oluşmaktadır.
Detailed and Search: Form yapısı tablo, ve selectbox elementinden oluşmaktadır.
Detailed with Location Picker: Form yapısı tablo ve Google Maps elementinden oluşmaktadır.
Screen name: Oluşturulan ekranın isimlendirildiği alandır. Ardından CREATE butonuna tıklayarak ekran oluşturulur.
2.4. Authentication templates
Kuika'da Authentication ekran şablonlarını öğrenin.
Kuika, uygulama geliştirme sürecini hızlandırmak için çeşitli ekran şablon türlerini sunmaktadır. Uygulama geliştirme sürecinde şablon ekranları, uygulamanın ihtiyacına uygun olarak kullanabilirsin. Kullanabileceğin şablon ekran türlerinden biri de Authentication ekranlarıdır.
Şablon Authentication Ekranı Ekleme:
Geliştirdiğin uygulamaya Authentication ekran şablonu ekleyebilir, düzenleme ve güncelleme işlemlerini yapabilirsin.
Authentication Ekranı şablonu eklemek için şu adımları izleyin:
Authentication ekran şablonu eklemek için sol kenardan Screens (Ekranlar) panelini açın.
Açılan Screens panelinde yer alan +New Screen ikonuna tıkla.
Açılan pop-up sol menüde Authentication öğesine tıkla.
Şablon Authentication Ekranları:
Authentication ekran şablonları çeşitli tiplerde bulunmaktadır. Bu noktada geliştirmekte olduğun uygulamaya uygun Authentication ekranı tipini seçebilirsin.
Uygulamanın ihtiyacına uygun olarak Authentication ekran şablonlarını ve tüm elementleri düzenleyebilirsin.
Authentication ekranları varsayılan metin içerikleri ile birlikte gelmektedir. Metin içeriklerinde güncelleme ve düzenlemeleri uygulaman özelinde gerçekleştirebilirsin.
Progressive user: Kullanıcı listesinin yer aldığı hazır bir şablonlar sunulmuştur.
Reset Password: Reset password hazır şablonlar sunulmuştur.
Sign In: Sign In hazır şablonlar sunulmuştur.
Sign Up: Sign Up hazır şablonlar sunulmuştur.
User Template: Kullanıcı için gerekli olabilecek bilgilerin alınabileceği bir şablonlar sunulmuştur.
Verification Code: Reset password işleminde Verification Code’un alınabileceği bir şablonlar sunulmuştur.
Screen name: Oluşturulan ekranın isimlendirildiği alandır. Ardından CREATE butonuna tıklayarak ekran oluşturulur.
2.5. Screen Group
Grid Card with Search: Grid kart yapısının ve search’ın yer aldığı şablonlardır.
Personal Grid Card with search: Kişisel Grid Kart yapısının ve search’ın yer aldığı şablonlardır.
Screen name: Oluşturulan ekranın isimlendirildiği alandır. Ardından CREATE butonuna tıklayarak ekran oluşturulur.
Last updated
