TOOLBOX İÇİNDE EN SIK KULLANILANLAR

Container

Daha düzenli bir görünüm ve grup olmasını istediğimiz widget’lar için kullanılır. Bu gruplama ile ortak stiller uygulanabilir. Bu araç, belirli bir alanda daha düzgün bir görünüm sağlayan bir Html div öğesi oluşturur. Container içinde görünür ya da gizlenmek istenen içerikler oluşturulabilir. Sürükleyip bırakarak son kullanıcıya daha akıcı bir görünüm sağlanır.

Örneğin yukarıda container kullanmanın önemini görebiliriz. Burada arama ve sıralama kutuları oluşturulur, ancak container kullanılmadığı için dağınık görünür.

Ancak bir container kullanıldığında aşağıdaki gibi daha düzenli bir bölge ve belli bir tarza sahip bir görünüm elde edilir.

If

İçeriğin bir koşula göre görünmesini sağlar. Bu araç ile belirtilen durumun doğru veya yanlış olmak üzere 2 duruma göre farklı sonuçlar göstermesi sağlanır. Gösterilecek sonuçlar tasarım zamanında oluşturulur. Son kullanıcı, yalnızca yerine getirilen sonucu görecektir.

Örneğin, yukarıdaki uygulamanın siparişleri gösteren filtreleme bölümünde gönder seçeneği seçildiğinde uygun olanlar listeleniyor veya filtrelenen sonucun değeri yoksa ekranda olmadığını gösteren bir içerik görüntüleniyor. Bunlar if widget’ı ile sağlanır.

Bu koşulun oluşmasını sağlayan ‘’if widget’’ın Service Studio’da kullanımı şu şekildedir.

Text

Kullanıcı arayüzünde başlık, açıklama gibi metinler yazılmak istendiğinde kullanılan araçtır.

Aşağıda, Service Studio’da kullanımına bir örnek verilmiştir.

Expression

Hesaplanacak bir metin, ifade veya değer oluşturmak için çalışma zamanında kullanılır. Gösterilenler için karmaşık değerler oluşturulabilir. Diğer programlama dillerinde karşılığı’’ ‘’print’’ komutudur.

Bu araç kutusunun ne işe yaradığını anlamak için aşağıdaki örneğe bakabilirsiniz;

Son kullanıcıya açılan sipariş ekleme ekranında ürün fiyatını hesaplayan tutar alanı gelir. ‘’Expression’’ aracı ile bu alanın hesaplanması mümkündür.

Service Studio’da bu ifadenin değeri aşağıdaki gibidir.

Buradaki formülde de görüldüğü gibi ifade ile çarpma, para toplama gibi çeşitli işlemler yapılabilmektedir.

Table

Seçilen kaynaktan alınan verilere dayalı olarak tablo biçiminde hızlı bir liste oluşturmak için kullanılır. Bu widget ile sıralama ve sayfalandırma gibi özellikler hızla eklenir.

Reaktif Web uygulamalarında tablo olarak yer alan bu widget, traditional web uygulamalarında “Table Records” olarak karşımıza çıkmaktadır.

Reactive:

Traditional:

List

Tablodaki gibi sıralı bir veri listesi sunar. Bu pencere öğesi, Reactive ve mobil uygulamalarda mevcuttur, ancak Traditional uygulamalarda “List Records” olarak adlandırılır.

List item

Liste widget’ından farklı olarak “Action” widget’ı ile tam kaydırmalı liste oluşturulmak istendiğinde kullanılır.

Service Studio’da aşağıdaki gibi görünür.

Form

İstenildiği gibi düzenlenebilen entity veya structure’a ait kayıtların girildiği birden fazla alan veya boşluk içeren bölümdür. Sahip olduğu etiket ile son kullanıcıyı bilgilendirir.

Aşağıda bir hasta kayıt formu ekranı için Service Studio’da hazırlanmış bir form bulunmaktadır.

Label

Form gibi widget’larda kullanılan doldurulacak alan hakkında son kullanıcıya bilgi veren başlık bölümüdür.

Service Studio’da bu etiket bölümleri istenildiği gibi boyutlandırılabilir ve şekillendirilebilir.

Input

Son kullanıcının veri girişini sağlayan giriş alanı ile hem girilen verinin türü doğrulanabilir hem de bu veri, veri tabanında ilgili yere kaydedilir.

Bu alanın Service Studio’da etiketli görüntüsü aşağıdaki gibidir.

Text Area

Son kullanıcının bir veya birden fazla satır yazabileceği alanlardır.

Variable kısmı, yazılan metnin nerede tutulacağını gösterir. Aşağıda bir uygulamada, doktorun hastaları tarafından konulan tanıyı not almasına izin vermek için bir ‘’text area’’ kullanılır. Bu sayede doktorun bu hasta için yazdığı teşhis metin olarak veri tabanına kaydedilir.