Row
Row elementinin işlevine göz atın.
Row elementi genellikle verileri veya içeriği bir sıra veya satır halinde düzenlemek için kullanılan elementtir. Genellikle tablo benzeri düzenlerde veya liste biçimlerinde kullanılır.
Row, 24 farklı kolona bölünebilen yatay bir bloktur. Ön tanımlı olarak tarayıcı penceresi genişliğine göre uyarlanabilir bir genişliğe sahiptir. Değişmez tam bir genişlik ölçüsüne (1200px) sahip olabileceği gibi max (0-1600px) genişlik değeri de alabilir. Row ve içindeki kolonlara farklı ölçülerde padding ile boşluk eklenebilir. Tüm elementler için kapsayıcı (Container) bir elementtir.
Row elementinin temel işlevi ekrana eklediğiniz elementler için yer tutucu bir yapı sağlamasıdır. Bu işlev sayesinde ekrana sürükleyip bıraktığınız elementlerin tasarımsal organizasyonunu yapmaktadır.
Row elementi temel olarak aşağıdaki işlevlerde kullanılmaktadır.
Stil ve Tasarım: Her satırın görünümü, renkleri, yazı tipi boyutları ve arka planı gibi özelliklerle özelleştirilebilir.
Duyarlılık (Responsive Design): Row elementleri, web sitelerinin ve uygulamalarının duyarlı tasarımını desteklemek için kullanılabilir. Bu, farklı ekran boyutlarına ve cihaz türlerine uyum sağlama kapasitesini ifade eder.
Row elementini geliştireceğiniz web veya mobil uygulamalar da kullanabilirsiniz.
Row Ekleme
Row elementini uygulamanız içerisine eklemeniz oldukça kolay. Row elementini eklemek için aşağıdaki adımları izlemeniz gerekmektedir.
Row elementini ekrana sürükleyin ve bırakın.
Row elementini Properties paneli içerisinden özelleştirebilirsiniz.
Row elementini ekran içerisinde dilediğiniz miktarda kullanabilirsiniz. Kullanım sınırı yoktur.
Row, Horizontal Stack, Vertical Stack, Label, Button, Text Input, Number Input, Icon, Panel, Image, MDViewer, Video Player,Progress Bar, Progress Circle, Badge, Location Search, Email, Text Area, Auto Complete, Select Box, Slider, Range Slider, Check Box, Switch, Date, Date Time, Year Picker, Countdown , Area Chart, Donut Chart, Line Chart, Pie Chart, Bar Chart, Rate, Web View, Signature, Chat , Table, Gallery View , Carausel, Pagination, Flex Grid ve google maps elementlerini Row elementi içerisinde Child element olarak kullanabilirsiniz.
Row elementi içerisine Panel elementi Child element olarak eklenebildiğinden dolayı arkaplanın dinamik olarak değişimini sağlayabilirsiniz. Bu doğrultuda arkaplana dinamik renk ve/veya görüntü ekleyebilirsiniz.
Row elementi seçildiğinde, Properties panelinde Row içinde bulunan kolonların masaüstü, telefon ve tabletlerdeki davranışlarını ayarlayabilir ve Authorization (Yetkilendirme) ve Visibility (Görünürlük) parametrelerini görüntüleyebilirsin.
Bu parametre alanları, Row elementi ile ilgili özel yetkilendirme ayarlarını ve görünürlük tercihlerini düzenlemenizi sağlar.
Column Customize (Sütun Özelleştir)
Bir Row elementini 24 farklı kolona bölebilirsiniz. Temelde arayüz tasarımında 1, 2, 3, 4 gibi daha düşük kolon sayısına sahip Row'lar kullanılır.
Kolonlarını yönetmek istediğiniz Row elementini seçin. Properties (Özellikler) paneli desktop altında ön tanımlı kolon yapılarından birini seçebilirsiniz. Customize ile özel kolon genişlikleri ve sayısını hazırlayabilirsiniz.
Tablet ve telefonlarda kolonların sıralanma düzenini ayarlayabilirsiniz. Tablette 2 kolon halinde görüntülenen Row, telefonda tek kolon halinde sıralanabilir.
Row içinde bulunan kolonların hizalamasını yapabilirsiniz.
Row elementi için yetkilendirme seçeneklerini kullanabilirsiniz.
Elementlerde Authorization ekleme işlemlerini detaylı incelemek için tıklayın.
Kullanıcı rollerine göre veya ekran rollerine göre Authorization işlemlerini detaylı incelemek için tıklayın.
Elementler de visibility yani görünürlük, belirli bir durumda görünürlük veya erişilebilirliğini düzenlemenizi sağlar. olduğunu kontrol etmek için kullanılan bir özelliktir. Bu özellik genellikle uygulama tasarımında veya işlevselliğinde kullanılır.
Row elementi için her zaman görünür olmasını, gizli olmasını veya bir koşula bağlı olarak görünüp gizlenmesini visibility seçeneklerini kullanabilirsiniz.
Elementlerde Visibility ekleme ile ilgili detaylı bilgi edinmek için tıklayın.
Seçimler doğrultusunda Row'un görünürlüğü ayarlanmış olacaktır.
Kuika, Arithmetic, Authorization, Condition, Device, Export, GeoLocation, Invers, Local Storage, Multi Language, Navigation , Notification, Payment Stripe, UI Control, Trigger ve Process Automation, Process Administration, String Operations gibi sistem aksiyonlarını barındırmaktadır.
Row veya column'a ekleyebileceğiniz aksiyonları +Add actions ile ekleyebilirsiniz.
Row elementine veya diğer elementlere aksiyon ekleme ile ilgili detaylı bilgi edinmek için tıklayın.
Row elementini Styling paneli ile özelleştirebilirsiniz.
Row ve içinde bulunan Column'lar ayrı ayrı seçilerek farklı stil düzenlemeleri yapılabilir. Row elementine Layout (Düzen),Text (Metin), Border (Kenarlık), Fill (Dolgu) veya Shadow (Gölge) ekleyerek ek düzenlemeler yapabilirsiniz.
Çevresel iç boşluklar ve boyutlandırma gibi görsel düzenlemeleri yapabilirsiniz. Parent element olan Row veya column'lar için verilecek hizalama komutlarında ise altında bulunan child elementler etkilenir.
Row elementinde Size, Align ve Display ayarları yapılamamaktadır. Row içerisine eklenen element ile birlikte Layout ayarları değişebilmektedir.
Row ve Row'un içerisine eklenen elementlerde Layout ayarları hakkında detaylı bilgi için tıklayın.
Row elementinde Text alanı sınırlandırılmıştır. Text alanına ait sadece Options alanında Mobil sistemlerin yazı tipi boyutundan etkilenmemesini sağlayan alan desteklenmektedir.
Row elementi, Text içerisinde yer alan Family, Style, Size/Color, Spacing alanlarını desteklememektedir.
Row ve Row’un içerisine eklenebilecek elementlerde Text ayarları ile ilgili detaylı bilgi edinmek için tıklayın.
Row elementinin arka planına (background) renk veya görseli Fill (Dolgu) ile ekleyebilirsiniz.
Elementlere Fill (Dolgu) ekleme ile ilgili detaylı bilgi edinmek için tıklayın.
Row’un dış kenarlarına Border (kenarlık) ekleyebilir, köşe eğimleri (Radius) verebilirsiniz.
Elementlere Border (Kenarlık) ekleme ile ilgili detaylı bilgi edinmek için tıklayın.
Web uygulamalar içerisinde Row element kullanımında Shadow (Gölge) ile gölge efekti ekleyebilirsiniz. Mobil uygulamalar içerisinde Shadow (Gölge) görüntülenmemektedir. Dolayısıyla Shadow (Gölge) eklenmemektedir.
Row elementine Shadow (Gölge) ekleme ile ilgili detaylı bilgi edinmek için tıklayın.
Last updated
