Pages
Özel Kaydırıcı (Custom Slider)
Custom Slider (Özel Kaydırıcı), kullanıcıların bir değer üzerinde kaydırıcıyı hareket ettirerek görsel olarak ayarlama yapmasını sağlayan etkileşimli bir bileşendir.
CODESYS, MQTT vb. bağlantılarla bir değişkene bağlanarak sistem parametrelerini gerçek zamanlı olarak etkileyebilir.
Genel Bakış
Custom Slider, sayısal değerleri doğrudan arayüz üzerinden sezgisel bir şekilde değiştirmeyi sağlar.
Gerçek zamanlı veri bağlantısı sayesinde kullanıcılar hız, parlaklık veya sıcaklık gibi parametreleri hassas biçimde ve anında ayarlayabilir.
Temel Özellikler
Değişken Bağlantısı
- Gerçek zamanlı veri kaynaklarına (ör. CODESYS, MQTT) bağlanabilir
- Kullanıcı etkileşimi sırasında güncellenmiş değerler otomatik olarak gönderilir
Etkileşimli Kaydırıcı Kontrolü
- Kaydırıcı ucunu (thumb) sürükleyerek değer ayarlanabilir
- Adım adım hizalama (opsiyonel) ile tutarlı değerler seçilebilir
Canlı Değer Görüntüleme
- Anlık değer, kaydırıcının yanında veya üzerinde gösterilebilir
- % , °C , rpm gibi birim ekleri desteklenir
Özelleştirilebilir Aralık ve Adımlar
- Minimum, maksimum ve adım değerleri tanımlanabilir
- Veriler üzerinde ince ayar yapılmasını sağlar
Etiketler ve Ölçek Göstergeleri
- Görsel referans noktaları sağlamak için etiketler veya işaretler eklenebilir
- Kullanıcının ölçeği anlamasını kolaylaştırır
Özelleştirilebilir Görünüm
- Renkler, boyut, yön (yatay/dikey) ve çizgi stili ayarlanabilir
Kullanım Senaryoları
Parametre Ayarı
- Örnek: Otomasyon sisteminde motor hızı veya kazanç değeri ayarlama
Ortam Kontrolü
- Örnek: HVAC sisteminde sıcaklık ayarını değiştirme
Kullanıcı Tercihleri
- Örnek: Ekran parlaklığı veya ses seviyesi ayarı
SVG ID Referans Tablosu
[img_1]
Aşağıdaki SVG ID’lerini kullanarak Custom Slider öğelerine dinamik değerler bağlayabilirsiniz:
| # | Eleman | SVG ID |
|---|---|---|
| 1 | Çubuk Doldurma (Sol) | [code_block_0] |
| 2 | Çubuk Yolu | [code_block_1] |
| 3 | Kaydırıcı Başlığı (Thumb) | [code_block_2] |
Example:
[code_block_3]