Text Input

Text Input elementinin işlevine göz atın.

Text Input Elementi, Alfanümerik değerlerin girişi veya düzenlenmesi için kullanılan elementtir. Email veya Number Input gibi farklı elementler olduğu için sadece metin ağırlıklı girişler için kullanılır.

Text Input Ekleme

Elements panelinden Text Input elementini ekrana sürükle bırak ile ekleyebilirsiniz. Eğer ekranda boş bir alana sürüklerseniz Row elementi ile eklenir. Bir Column içine sürüklerseniz sadece Text Input elementi eklemiş olursunuz.

Text Input, web ve mobil uygulamaları desteklemektedir.

Text Input elementi için value, placeholder,ve formatter gibi farklı ayarları ihtiyacınıza göre kullanabilirisniz. Elemente role bağlı yetkilendirmeler verebileceğiniz gibi görünürlüğünü de göster/gizle/koşullu seçenekleriyle ayarlayabilirsiniz.

Value (Değer)

Value alanına statik bir değer ekleyebileceğiniz gibi Symbol Picker aracılığıyla bir durumu, Input element içeriğini veya bir aksiyon sonucuna ait bir değerin dinamik olarak gelmesini sağlayabilirsiniz.

Placeholder

İçeriğine bir değer girilene kadar gösterilecek yer tutucu metindir. Placeholder alanına sstatik bir değer ekleyebileceğiniz gibi Symbol Picker aracılığıyla bir durumu, Input element içeriğini veya bir aksiyon sonucuna ait bir değerin dinamik olarak gelmesini sağlayabilirsiniz.

Max Lenght

İçeriğinde gösterilecek veya giriş yapılacak değer uzunluğunu ayarlayabilirsiniz.

Allow Clear

Veri giriş yapıldığında elementin sağ kenar içine, girilen değerleri tek tıklama ile silmenize yarayan bir Delete(X) ikonu eklenebilir.

Mask

Girilen/görünen verilerin özel olarak maskelenmesini sağlayabilirsiniz.

Formatter

Uygulama geliştirme sürecinde Formatter (biçimleyici), verilerin belirli bir formata veya düzenlemeye getirilmesini sağlayan bir Property’dir. Formatter'lar, genellikle metin, sayılar, tarih ve saat gibi veri türlerini düzenler ve belirli bir görünüm veya format elde etmek için kullanılırlar.

TextInput elementi seçili iken properties paneli içerisinde Formatter açılır pencere ile gelmektedir.

Açılır pencere içerisinde Lowercase, Uppercase property’leri ile birlikte gelmektedir.

  • Lowercase: TextInput içerisinde harflerin küçük harflerle yazılmasını sağlar.

  • Uppercase : TextInput içerisinde harflerin büyük harflerle yazılmasını sağlar.

Büyük, Küçük, cümle tipi gibi seçenekler ile girilen içeriğin yazım tipini ayarlayabilirsiniz.

Char Only

Sayısal değer girmeyi engelleyebilirsiniz. Böylece, giriş için sadece harfler mevcut olacaktır.

Allowed Chars

Giriş yapılabilecek ve izin verilen karakterleri burada belirtebilirsiniz. Böylece bu bölümde eklenen karakterler dışında herhangi bir karakter yazımı mümkün olmayacaktır.

Authorization (Yetkilendirme)

Text Input elementi için yetkilendirme seçeneklerini kullanabilirsiniz.

Visibility (Görünürlük)

Elemente role bağlı yetkilendirmeler verebileceğiniz gibi visibility'i (görünürlüğünü) de always visible (göster)/ hidden (gizle) / sometimes visible (koşullu görünürlük) seçenekleriyle ayarlayabilirsiniz.

Text Input elementine ekleyebileceğiniz aksiyonları Add Actions ile ekleyebilirsiniz.

Text Input elementine layout (düzen), text (metin), fill (dolgu), border (kenarlık) veya shadow (gölge) ekleyerek ek düzenlemeler yapabilirsiniz.

Çevresel iç boşluklar ve boyutlandırma gibi görsel düzenlemeleri yapabilirsiniz. Text Input boyutuna bağlı olarak içerisinde bulunan elementlerin hizalamasını yapabilirsiniz.

Text Input' a girilecek metine ait renk ve boyut gibi özellikleri text (metin) bölümü ile ayarlayabilirsiniz.

Text Input gövdesine renk veya görsel ekleyebilirsiniz.

Text Input'un dış kenarlarına çizgi ekleyebilir, radius (köşe eğimleri) verebilirsiniz.

Text Input elementine gölge efekti ekleyebilirsiniz.

Last updated