basic.stateswitch - Treppenlichtfunktion - Icon Farbe

[Maexle]

Hallo zusammen,

ich habe ein Item für das Flur Licht angelegt --> schaltet das Licht wie gewünscht. Auch die Icon-Farbe ändert sich beim Ein/Ausschalten. Nur habe ich die Treppenlichtfunktion des Aktors aktiviert. Gibt es eine Möglichkeit, dass die Icon Farbe vom Status des Aktors abhängig ist.

Beispiele:
Licht ist aus
Hardware Taster --> Licht an --> Visu ändert Farbe nicht

Licht ist aus
Visu Taster --> Licht an --> Visu Farbe geändert --> Treppenlicht schaltet aus --> Visu Farbe bleibt "an"
---> erneutes Tasten mit Visu Taster --> Visu Farbe auf Aus / sonst kein Schaltvorgang


Danke euch

<div class="block">
<div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
<div data-role="collapsible" data-collapsed="false">
<h3>Licht Keller Flur</h3>

{{ basic.stateswitch('kg.licht.flur', 'kg.licht.flur', 'Flur KG', ['1', '0'], ['light_light_dim_100.svg', 'light_light_dim_100.svg'], 'Flur Keller', ['icon1', 'icon0']) }}


</div>
</div>
</div>

[Sipple]

Stichwort: Rückmeldung vom Aktor.
Musst du im Backend beim Item mit angeben. SHNG oder was du auch immer verwendest.

Beispiel:

Vorraum:
    Licht:
        Decke:
            Schalten:
                type: bool
                knx_dpt: 1
                knx_send: 2/2/0
               [COLOR=#e74c3c][B] knx_cache: 2/2/1[/B][/COLOR]

Rückmeldung/Statusobjekt vom Aktor in rot.

Gruß, Martin

EDIT: Dein basic.stateswitch sieht auch seltsam aus. Schau dir die inline Doku nochmal an.

{{ basic.stateswitch('', 'Vorraum.Licht.Decke.Schalten', 'icon', '', ['light_light_dim_00.svg', 'light_light_dim_100.svg']) }}

[Maexle]

Danke,

ich denke das "knx_cache" war die Lösung --> mal sehen, ob es noch eine "Schaltkombi" gibt die nicht richtig dargestellt wird.

basic.stateswitch sieht auch seltsam aus. Schau dir die inline Doku nochmal an.

Du meinst das " ' Flur KG ' " was in deinem Code dem " ' icon ' " entspricht?
Das scheint aber die "Schaltfläche" zu vergrößern -- keine Ahnung wo ich das herhabe...

	<div class="block">
		<div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
			<div data-role="collapsible" data-collapsed="false">
				<h3>Licht Keller Flur midi</h3>
				
				<!-- {{ basic.stateswitch('kg.licht.flur', 'kg.licht.flur', 'Flur KG', ['1', '0'], ['light_light_dim_100.svg', 'light_light_dim_100.svg'], 'Flur Keller', ['icon1', 'icon0']) }}		 -->
				
				
				{{ basic.stateswitch('', 'kg.licht.flur', 'midi', '', ['light_light_dim_00.svg', 'light_light_dim_100.svg'], 'Flur Keller') }}
				
				<!-- {{ basic.stateswitch(id, 	item, 		type, value, 				icon, text, color, indicator, item_longpress, value_longpress, value_longrelease) }} -->
			</div>
		</div>
	</div>

	<div class="block">
		<div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
			<div data-role="collapsible" data-collapsed="false">
				<h3>Licht Keller Flur micro</h3>
				
				<!-- {{ basic.stateswitch('kg.licht.flur', 'kg.licht.flur', 'Flur KG', ['1', '0'], ['light_light_dim_100.svg', 'light_light_dim_100.svg'], 'Flur Keller', ['icon1', 'icon0']) }}		 -->
				
				
				{{ basic.stateswitch('', 'kg.licht.flur', 'micro', '', ['light_light_dim_00.svg', 'light_light_dim_100.svg'], 'Flur Keller') }}
				
				<!-- {{ basic.stateswitch(id, 	item, 		type, value, 				icon, text, color, indicator, item_longpress, value_longpress, value_longrelease) }} -->
			</div>
		</div>
	</div>
	
		<div class="block">
		<div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
			<div data-role="collapsible" data-collapsed="false">
				<h3>Licht Keller Flur mini</h3>
				
				<!-- {{ basic.stateswitch('kg.licht.flur', 'kg.licht.flur', 'Flur KG', ['1', '0'], ['light_light_dim_100.svg', 'light_light_dim_100.svg'], 'Flur Keller', ['icon1', 'icon0']) }}		 -->
				
				
				{{ basic.stateswitch('', 'kg.licht.flur', 'mini', '', ['light_light_dim_00.svg', 'light_light_dim_100.svg'], 'Flur Keller') }}
				
				<!-- {{ basic.stateswitch(id, 	item, 		type, value, 				icon, text, color, indicator, item_longpress, value_longpress, value_longrelease) }} -->
			</div>
		</div>
	</div>
	
		<div class="block">
		<div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
			<div data-role="collapsible" data-collapsed="false">
				<h3>Licht Keller Flur icon</h3>
				
				<!-- {{ basic.stateswitch('kg.licht.flur', 'kg.licht.flur', 'Flur KG', ['1', '0'], ['light_light_dim_100.svg', 'light_light_dim_100.svg'], 'Flur Keller', ['icon1', 'icon0']) }}		 -->
				
				
				{{ basic.stateswitch('', 'kg.licht.flur', 'icon', '', ['light_light_dim_00.svg', 'light_light_dim_100.svg'], 'Flur Keller') }}
				
				<!-- {{ basic.stateswitch(id, 	item, 		type, value, 				icon, text, color, indicator, item_longpress, value_longpress, value_longrelease) }} -->
			</div>
		</div>
	</div>
	
		<div class="block">
		<div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
			<div data-role="collapsible" data-collapsed="false">
				<h3>Licht Keller Flur text</h3>
				
				<!-- {{ basic.stateswitch('kg.licht.flur', 'kg.licht.flur', 'Flur KG', ['1', '0'], ['light_light_dim_100.svg', 'light_light_dim_100.svg'], 'Flur Keller', ['icon1', 'icon0']) }}		 -->
				
				
				{{ basic.stateswitch('', 'kg.licht.flur', 'text', '', ['light_light_dim_00.svg', 'light_light_dim_100.svg'], 'Flur Keller') }}
				
				<!-- {{ basic.stateswitch(id, 	item, 		type, value, 				icon, text, color, indicator, item_longpress, value_longpress, value_longrelease) }} -->
			</div>
		</div>
	</div>


		<div class="block">
		<div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
			<div data-role="collapsible" data-collapsed="false">
				<h3>Licht Keller Flur Flur KG</h3>
				
				<!-- {{ basic.stateswitch('kg.licht.flur', 'kg.licht.flur', 'Flur KG', ['1', '0'], ['light_light_dim_100.svg', 'light_light_dim_100.svg'], 'Flur Keller', ['icon1', 'icon0']) }}		 -->
				
				
				{{ basic.stateswitch('', 'kg.licht.flur', 'Flur KG', '', ['light_light_dim_00.svg', 'light_light_dim_100.svg'], 'Flur Keller') }}
				
				<!-- {{ basic.stateswitch(id, 	item, 		type, value, 				icon, text, color, indicator, item_longpress, value_longpress, value_longrelease) }} -->
			</div>
		</div>
	</div>

F-KG.PNG

[wvhn]

Hi Maexle ,

ich habe Deinen Versuch einmal nachgestellt, weil mich die unterschiedlichen Größen der Buttons irritiert haben. Dann habe ich jeweils die Buttons ohne Text zum Vergleich daneben gestellt. Im Endeffekt sehe ich aber keinen Anpassungsbedarf in SV, weil man alle Effekte beim Testen der Seite sofort sieht und durch vernünftige Parametrierung vermeiden kann. Hier meine Ergebnisse mit Kommentaren.
Versuch_Maexle.png

Gruß
Wolfram

[Maexle]

Hallo Wolfram,

ich nutze also den „Interessanter Effekt bei falschen Parameter“

[wvhn]

Der falsche Parameter "Flur KG" wird im Widget zu einer nicht definierten css-Klasse ".ui-Flur KG" umgesetzt und an JQuery Mobile durchgereicht. Du hast "Glück", dass jQuery Mobile nicht mehr weiter entwickelt wird. Deshalb ist es unwahrscheinlich, dass sich an dem "hidden feature" nochmal etwas ändert. Wenn ich aber aus irgendwelchen (aktuell nicht absehbaren) Gründen gezwungen bin, die Parameter sauber abzufangen, dass ist das Feature weg.

Gruß
Wolfram