Pages
Sayfalar
Buton: Durum (State Button)
Açıklama
State Button, tanımlı koşullara göre etiketini (label), görüntüsünü (image) ve davranışını değiştiren dinamik bir UI öğesidir.
Statik butonların aksine, sistemdeki değişkenlere gerçek zamanlı olarak tepki verir.
JavaScript mantığı kullanarak birden fazla görsel ve işlevsel durum tanımlayabilirsin.
Temel Özellikler
Durum Tabanlı Davranış
- JavaScript ile çoklu koşullar tanımla
- Dinamik olarak şunları değiştir:
- Etiket (Label)
- Görsel (Image)
- Çalıştırılacak işlem (Execute)
Dinamik İşlem
- Her duruma özel işlem (aksiyon) atayabilirsin
- Örnek:
"Sistem çalışıyorsa → Durdur, değilse → Başlat"
Görsel Özelleştirme
- Her duruma göre farklı simgeler, renkler veya yazılar göster
- Kullanıcıya net ve bağlama uygun geri bildirim sağlar
Sorunsuz Entegrasyon
- Herhangi bir değişkene [code_block_0] üzerinden bağlanabilir
- HMI / SCADA sistemlerinde canlı veri ile çalışmak için idealdir
Kullanım Senaryoları
| Senaryo | Örnek Davranış |
|---|---|
| Durumlar Arasında Geçiş | [code_block_1] değişkenine göre Start ↔ Stop |
| Hata Yönetimi Arayüzü | [code_block_2] ise “Reset” butonu göster |
| Görsel Durum Göstergesi | Özellik aktif/pasif olduğunda simgeyi değiştir |
Minimal JavaScript Örneği
Butonun [code_block_1] adlı bir değişkenle bağlantılı olduğunu varsayalım:
Aşağıdaki betik iki durumu tanımlar:
[code_block_4]