Layout (Düzen)
Elementlere Layout (Düzen) ekleyin.
Elementin çevresel boşluk ve boyutlandırma gibi özelliklerini Layout (düzen) aracılığıyla ayarlayabilirsiniz. Row veya Column'lar için verilen hizalama komutlarında, bunların içindeki elementler etkilenir.
Custom Style bölümünde oluşturduğunuz Layout stilini kaydederek, farklı ekranlarda veya aynı ekranda yer alan farklı elementlerde Load Style aracılığıyla kaydettiğiniz stili kullanabilirsiniz. Oluşturduğunuz Layout stillerini istediğiniz zaman düzenleyebilir, çoğaltabilir ve silebilirsiniz.
Padding (İç Boşluk)
Elementinize iç boşluklar ekleyebilirsiniz. Bu alanda bulunan top (üst), bottom (alt), right (sağ) ve left (sol) seçenekleri sayesinde kullandığınız elemente ihtiyacınız olan yönde belirlediğiniz değerleri girerek tasarımınızı güçlendirebilirsiniz.
UI (Kullanıcı Arayüzü) tasarımında Margin bir elementin (örneğin, bir buton, label) çevresindeki boşluğu veya uzaklığı belirlemeyi sağlamaktadır. Kuika’da Margin yoktur. Fakat Margin kullanmadan elementler veya nesneler arasındaki boşluk yapısını Padding yapısı ile kolaylıkla yapabilirsiniz.
Size (Boyut)
Workspace'e (Çalışma alanına) eklediğiniz elemetlerin boyutlandırmalarını düzenlerken witdh (genişlik) ve height (yükseklik) alanlarını kullanabilirsiniz.
Kullanacağınız değerleri piksel (px) ve % seçeneklerine göre ayarlayabilirsiniz. PX birimi ile girmiş olduğunuz boyutlarda tam olarak uygulanır. Örneğin 200px genişlik ölçüsü tüm cihazlarda aynı görünecektir. Ancak 20% değeri ekran genişliğini (tarayıcı) temel alarak kendini boyutlandırır. Browser genişliğine veya yüksekliğine göre tam olarak görünmesini istediğiniz elementler için 100% değerini kullanabilirsiniz.
Max Size (Maksimum boyut)
Workspace'e (Çalışma alanına) elementin alabileceği en yüksek genişlik/yükselik değerini girebileceğiniz alanlardır. Bir Image elementine max 480 genişlik değeri girdiğinizde (padding değerleri de göz önünde bulundurularak) cihaz veya browser genişliğine göre en fazla 480px genişliğinde olacak daha düşük genişliklerde genişlik daralacaktır.
Min Size (Minimum boyut)
Min size (Minimum Boyut), bir elementin alabileceği en küçük genişlik veya yükseklik değerini belirten bir özelliktir. Bu özellik, elementin küçültülebileceği en küçük boyutu ifade eder. Max width veya max height gibi, min size da genellikle elementin boyutunu kontrol etmek ve belirli bir düzeni korumak için kullanılır.
Align (Hizalama)
Elementin kendi içeriği (button elementinin label'ı) veya container elementlerinde çocuk element olarak altında bulunan elementlerin hizalamasını ayarlayabilirsiniz. Dikeyde yukarı, aşağı veya ortalı olabileceği gibi yatayda ortalı, sağa veya sola hizalı olarak istediğiniz gibi ayarlayabilirsiniz.
Display (Gösterim tipi)
Aynı column içine eklediğiniz elementler (ön tanımlı bir ayarlama yoksa) yan yana gelecek şekilde eklenir. Bir elementin bulunduğu container içinde satırda tek başına kalmasını istiyorsanız block seçeneğini kullanabilirsiniz.
Inline da ise alt alta duran elementleri yan yana gelecek şekilde ayarlamanız mümkündür. Bazı elementleri yan yana ekleyemezsiniz.
Elementlerde Layout Ayarları yapma:
Elementlerde Layout ile çevresel iç boşluklar (Padding) ve boyutlandırma (Size) gibi görsel düzenlemeleri yapabilirsiniz.
Elementlerde iç boşluklar ve boyutlandırma ayarlarını yapmak için şu adımları izleyin:
Ekrandaki Elemente tıklayarak seçili hale getirin.
Styling panelini açın.
Layout alanından iç boşluklandırma ayarlarını yapmak için Padding alanına değer girin.
Layout alanından boyutlandırma ayarları yapmak için Size alanına değer girin ve px veya % biçiminde değerlerin birimlerini seçin.
Layout alanında elementin alabileceği en düşük genişlik/yükselik ayarlarını yapmak için Min Size ile değerler girin ve px veya % biçiminde değerlerin birimlerini seçin.
Layout alanında elementin alabileceği en yüksek genişlik/yükselik ayarlarını yapmak için Max Size ile değerler verin ve px veya % biçiminde değerlerin birimlerini seçin.
Layout alanında Align ile elementin hizalama biçimini Align seçeneklerinden birini seçerek belirleyebilirsin.
Layout alanında Display ile bir elementin bulunduğu Container içinde tek satırda alt alta görüntülenmesini istiyorsanız block seçeneğini seçebilir, Elementlerin yan yana gelerek görüntülenmesini istiyorsanız inline seçeneğini seçebilirsiniz.
Layout içerisinde yer alan özellikler elementlere göre değişmektedir. Bazı elementlerde Layout içerisinde yer alan bütün özellikleri kullanabilirken bazı elementlerde ise sınırlı özellikler kullanılmaktadır.
Last updated
