Kuika’nın Divider elementi, uygulamanızda içerik alanlarını görsel olarak bölmek ve sayfa düzeninde hiyerarşi oluşturmak için kullanılır. Listeler, formlar, tablo grupları veya kartlar arasında düzenli bir yapı oluşturur. Divider, yalnızca çizgi olarak ya da başlık etiketiyle birlikte kullanılabilir.
Yalnızca web uygulamalarında desteklenir.
Kullanım Alanları
Kullanıcı listeleri, proje tabloları veya rapor ekranlarında grup ayrımı yapmak
Form adımlarını veya bilgi alanlarını görsel olarak bölmek
Dashboard kartlarında başlık veya kategori ayırmak
Uzun içeriklerde okunabilirliği artırmak
Farklı veri kümeleri veya kullanıcı rolleri arasında sınır çizmek
Kullanım Senaryosu – Ekip Üyeleri Yönetim Sayfası
Bir Yönetici Paneli uygulamasında, kullanıcılar ekip üyelerini “Admin User” ve “Account Users” olarak görüntüleyebilir. Divider elementi bu iki kullanıcı grubunu net bir biçimde ayırmak için kullanılır.
Senaryoda:
“Team Members” başlıklı bir tablo oluşturulur.
“Admin User” grubundaki kişiler üst bölümde, “Account Users” grubundakiler alt bölümde listelenir.
Aralarına bir Divider eklenerek gruplar arasında görsel bir ayrım sağlanır.
Divider, gerekirse bir başlık etiketi (“Admin User”, “Account Users”) ile birlikte gösterilir.
Sayfa düzeni daha anlaşılır ve profesyonel bir görünüme kavuşur.
Özelliklerin Senaryo Bağlamında Kullanılması
Label: Divider’ın ortasında gösterilen başlıktır.
Örnek: “Admin Users” veya “Account Users”
Statik değer olarak yazılabilir veya Symbol Picker ile dinamik hale getirilebilir.
Dashed: Divider çizgi stilini belirler.
Varsayılan: Düz çizgi
Alternatif: Kesik çizgi (daha hafif görsel vurgu için)
UI Design Modülü İşlemleri
UI Design modülüne gidin.
Sol panelden Elements > Special > Divider elementini seçin.
Divider’ı iki içerik bloğu (örneğin iki kullanıcı tablosu) arasına sürükleyip bırakın.
Properties panelinden aşağıdaki ayarları yapılandırın:
Label: “Account Users”
Dashed: False (düz çizgi)
Senaryo Tamamlandığında
“Admin User” ve “Account Users” grupları arasında net bir çizgi görünür.
Divider çizgisi içerik bloklarını düzenli biçimde ayırır.
Kullanıcılar farklı roller veya veri kümelerini kolayca ayırt edebilir.
Sayfa, daha düzenli ve profesyonel bir arayüze kavuşur.
Kısıtlamalar
Divider elementi veri bağlama veya etkileşim (action) desteklemez; yalnızca görsel amaçlıdır.
Aşırı sayıda Divider kullanımı sayfa yoğunluğunu artırabilir.
Mobil görünümde Divider genişliği, ekran boyutuna göre otomatik ölçeklenir.
İpuçları ve Best Practices
Divider rengini sayfanın kontrastına uygun seçin.
Label içeren Divider’larda metin uzunluğunu kısa tutun.
Formlarda bölümler arası geçişi vurgulamak için Divider altına kısa açıklama ekleyin.
Dashboard’larda Divider’ı kart arası beyaz boşlukla birlikte kullanarak görsel denge sağlayın.
Koyu temalarda Divider rengini #2D2D2D veya benzeri tonlarla düzenleyin.
