Balken & Slider: Unterschied zwischen den Versionen
Spiff (Diskussion | Beiträge) KKeine Bearbeitungszusammenfassung |
Spiff (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
| Zeile 1: | Zeile 1: | ||
{{SEITENTITEL:Balken & Slider}} | |||
{{Infobox Modul | |||
|ModPurpose=Erstellen von erweiterten Balken und Slidern als Widget | |||
|ModType=h | |||
|ModCmdRef=advancedSlider | |||
|ModForumArea=Frontends | |||
|ModTechName=fhemweb_advancedSlider.js | |||
|ModOwner=Spiff ({{Link2FU|1289|Forum}} / [[Benutzer Diskussion:Spiff|Wiki]])}} | |||
=== Info === | === Info === | ||
!!!Seite noch im Aufbau!!! | |||
Weitere Infos: | |||
https://forum.fhem.de/index.php?topic=28318.0 | https://forum.fhem.de/index.php?topic=28318.0 | ||
| Zeile 150: | Zeile 161: | ||
| Fügt einen Schatten hinter dem Balken hinzu (der Schatten verletzt den durch length und width definierten Bereich) | | Fügt einen Schatten hinter dem Balken hinzu (der Schatten verletzt den durch length und width definierten Bereich) | ||
| 0 | | 0 | ||
|} | |||
== Beispiele == | |||
=== Beispiel 1 === | |||
{| class="wikitable" | |||
! Definition !! Erläuterungen !! Aussehen | |||
|- | |||
| style="width:40%" |<code>state:adslider,width:30,length:200,color1:glossyGreen,borderSize:5,borderRadius:15,borderColor:999999, textSize:10,slider:1,sliderHandleDesign:0,setDevice:mp,setTarget:position,textValue:"",disableNotify:n_position_mp</code> | |||
| Der Slider macht ein "set mp position (Sliderwert)". | |||
| rowspan=3 | [[Datei:rgBattery.png|thumb]] | |||
|- | |||
| <code>define n_position_mp notify mp:position setreading slider1 $VALUE</code> | |||
| Das notify stellt den Slider immer auf den Wert des Devices ein. Über disableNotify wird das Notify für die Dauer des Slidens deaktiviert und danach wieder aktiviert. | |||
|- | |||
|} | |} | ||
Version vom 31. Dezember 2016, 19:09 Uhr
| advancedSlider | |
|---|---|
| Zweck / Funktion | |
| Erstellen von erweiterten Balken und Slidern als Widget | |
| Allgemein | |
| Typ | Hilfsmodul |
| Details | |
| Dokumentation | EN / DE |
| Support (Forum) | Frontends |
| Modulname | fhemweb_advancedSlider.js |
| Ersteller | Spiff (Forum / Wiki) |
| Wichtig: sofern vorhanden, gilt im Zweifel immer die (englische) Beschreibung in der commandref! | |
Info
!!!Seite noch im Aufbau!!! Weitere Infos: https://forum.fhem.de/index.php?topic=28318.0
Benutzung der Variablen
| Parameter | Werte | Zweck | Default |
|---|---|---|---|
| length | Zahl (Pixel) | Länge des Balkens | 300 |
| width | Zahl (Pixel) | Breite des Balkens | 30 |
| max | Zahl | maximal erreichbarer Wert des Readings | 100 |
| style | horizontal, vertical | Ausrichtung des Balkens | horizontal |
| swapDirection | 0,1 | Umkehren der Richtung horizontal: |
0 |
| offset1 | Zahl (Pixel) | Erzeugt einen Abstand links bzw. unten | 0 |
| offset2 | Zahl (Pixel) | Erzeugt einen Abstand rechts bzw. oben | 0 |
| color1 | glossyBlue, glossyRed, glossyCopper, glossyPink, glossyGreen, glossyYellow, glossyOrange, glossyBlack, glossyWhite gradient_RRGGBB_RRGGBB |
Farbe des linken/unteren Balkens | glossyBlue |
| color2 | glossyBlue, glossyRed, glossyCopper, glossyPink, glossyGreen, glossyYellow, glossyOrange, glossyBlack, glossyWhite gradient_RRGGBB_RRGGBB |
Farbe des rechten/oberen Balkens | glossyWhite |
| opacity1 | Zahl (0...1) 0=transparent |
Transparenz des linken/unteren Balkens | 1 |
| opacity2 | Zahl (0...1) 0=transparent |
Transparenz des rechten/oberen Balkens | 1 |
| textValue | (Textstring), Perl möglich | mittig angezeigter Text | $VALUE |
| textColor | RRGGBB (HEX-Format) | Farbe des Textes | 000000 |
| textSize | Zahl (Pixel) | Größe des Textes | 20 |
| overlay | Link | Overlay-Bild (Überdeckt Balken, nur sinnvoll mit Transparenz) | (leer) |
| overlayStyle | absolute, relative | Platzierung des Bildes mit Beachtung der Offsets (relative) oder über alles (absolute) | absolute |
| overlayRotate | 0,1 | Rotation des Overlay-Bildes horizontal: 90 Grad im Uhrzeigersinn |
0 |
| underlay | Link | Underlay-Bild (Hintergrundbild unter dem Balken) | (leer) |
| underlayStyle | absolute, relative | Platzierung des Bildes mit Beachtung der Offsets (relative) oder über alles (absolute) | absolute |
| underlayRotate | 0,1 | Rotation des Overlay-Bildes horizontal: 90 Grad im Uhrzeigersinn |
0 |
| borderRadius | Zahl (Pixel) | Verrundung der Ecken des Balkens | 0 |
| borderSize | Zahl (Pixel) | Rahmendicke um den Balken (der Balken bleibt immer in seinem durch length und width definierten Bereich) | 0 |
| borderColor | RRGGBB (HEX-Format) | Rahmenfarbe | 000000 |
| shadow | 0,1 | Fügt einen Schatten hinter dem Balken hinzu (der Schatten verletzt den durch length und width definierten Bereich) | 0 |
Beispiele
Beispiel 1
| Definition | Erläuterungen | Aussehen |
|---|---|---|
state:adslider,width:30,length:200,color1:glossyGreen,borderSize:5,borderRadius:15,borderColor:999999, textSize:10,slider:1,sliderHandleDesign:0,setDevice:mp,setTarget:position,textValue:"",disableNotify:n_position_mp
|
Der Slider macht ein "set mp position (Sliderwert)". | |
define n_position_mp notify mp:position setreading slider1 $VALUE
|
Das notify stellt den Slider immer auf den Wert des Devices ein. Über disableNotify wird das Notify für die Dauer des Slidens deaktiviert und danach wieder aktiviert. |
