FTUI Widget Slider - Versionsgeschichte

Pahenning am 3. August 2024 um 08:43 Uhr

2024-08-03T08:43:59Z

← Nächstältere Version		Version vom 3. August 2024, 10:43 Uhr
Zeile 1:		Zeile 1:
	Das [[{{PAGENAME}}\|Slider Widget]] ist ein Widget für [[FHEM Tablet UI]] in Form eines Schiebereglers, mit dem ein beliebiger Wert zwischen zwei festgelegten Grenzwerten auswählen lässt. Es eignet sich zum Beispiel zum Einstellen der Lautstärke eines Audio-Gerätes oder der Helligkeit einer Lampe.		Das [[{{PAGENAME}}\|Slider Widget]] ist ein Widget für [[FHEM Tablet UI V2]] in Form eines Schiebereglers, mit dem ein beliebiger Wert zwischen zwei festgelegten Grenzwerten auswählen lässt. Es eignet sich zum Beispiel zum Einstellen der Lautstärke eines Audio-Gerätes oder der Helligkeit einer Lampe.

	<gallery>		<gallery>
Zeile 326:		Zeile 326:
	Wird in der Klasse "awning" statt "blind" gesetzt, so wird eine Markisendarstellung erzeugt.		Wird in der Klasse "awning" statt "blind" gesetzt, so wird eine Markisendarstellung erzeugt.

	[[Kategorie:FHEM Tablet UI\|Slider]]		[[Kategorie:FHEM Tablet UI V2\|Slider]]

2022-01-18T10:54:49Z

Steuer-Attribute: data-lock ergänzt

← Nächstältere Version		Version vom 18. Januar 2022, 12:54 Uhr
Zeile 56:		Zeile 56:
	\|-		\|-
	\|\|'''data-timer-interval'''\|\|Timer-Intervall in Millisekunden\|\|1000\|\|		\|\|'''data-timer-interval'''\|\|Timer-Intervall in Millisekunden\|\|1000\|\|
			\|-
			\|'''data-lock'''\|\|Reading, mit dem das Element für eine Bedienung gesperrt wird. Die Sperre greift, wenn das Reading den Wert 'true', '1' oder 'on' hat. Hiervon abweichend ist auch eine Definition mittels data-lock-on und data-lock-off möglich.\|\|\|\|
			\|-
			\|'''data-lock-on'''\|\|Wert des Readings, bei dem die Sperre (vgl. data-lock) aktiviert wird\|\|\|\|
			\|-
			\|'''data-lock-off'''\|\|Wert des Readings, bei dem die Sperre (vgl. data-lock) aufgehoben wird\|\|\|\|
			\|-
	\|}		\|}

2019-08-23T06:40:49Z

Anpassung der Beschreibung für Darstellung von Slidern für Fenster/Rolläden an neuere FTUI Versionen

@@ Zeile 146: / Zeile 146: @@
 Folgende Anpasssungen sind zu machen:
-im file fhem-tablet-ui-user.css (falls das noch nicht verwendet wird, muss es natürlich noch in das html file, das aufgerufen wird, eingetragen werden) folgende Zeilen einfügen:
+im file fhem-tablet-ui-user.css (falls das noch nicht verwendet wird, muss es natürlich noch in das html file, das aufgerufen wird, eingetragen werden) müssen zusätzliche Zeilen eingefügt werden. In älteren Versionen von FTUI (vor 2.7) müssen folgende Zeilen eingefügt werden:
 <syntaxhighlight lang="css">
@@ Zeile 203: / Zeile 203: @@
 .awning> .vertical .range-handle {
 	margin-left: 52% !important;
+}
 </syntaxhighlight>

2018-12-18T06:58:38Z

Vertikaler Schieberegler

← Nächstältere Version		Version vom 18. Dezember 2018, 08:58 Uhr
Zeile 79:		Zeile 79:
	class="cell" >		class="cell" >
	</div>		</div>
	<div ~~data-type="label"~~ class="cell">Light1</div>		<div class="cell">Light1</div>
	</syntaxhighlight>		</syntaxhighlight>

2018-11-29T12:19:20Z

Klasse readonly hinzugefügt

← Nächstältere Version		Version vom 29. November 2018, 14:19 Uhr
Zeile 62:		Zeile 62:
	!Klasse		!Klasse
	!Beschreibung		!Beschreibung
	{{FTUI Klasse\|mini}}{{FTUI Klasse\|big}}{{FTUI Klasse\|bigger}}{{FTUI Klasse\|large}}{{FTUI Klasse\|horizontal}}{{FTUI Klasse\|right}}{{FTUI Klasse\|negated}}{{FTUI Klasse\|value}}{{FTUI Klasse\|FS20}}{{FTUI Klasse\|tap}}		{{FTUI Klasse\|mini}}{{FTUI Klasse\|big}}{{FTUI Klasse\|bigger}}{{FTUI Klasse\|large}}{{FTUI Klasse\|horizontal}}{{FTUI Klasse\|right}}{{FTUI Klasse\|negated}}{{FTUI Klasse\|value}}{{FTUI Klasse\|FS20}}{{FTUI Klasse\|tap}}{{FTUI Klasse\|readonly}}
	\|}		\|}

2018-09-19T10:16:24Z

Retro-Schieberegler mit Skala und rechteckigem Riffelknopf

← Nächstältere Version		Version vom 19. September 2018, 12:16 Uhr
Zeile 115:		Zeile 115:
	data-colors='["green","#FFBF00","#EF0002"]'		data-colors='["green","#FFBF00","#EF0002"]'
	data-limits='["1","50","75"]'></div>		data-limits='["1","50","75"]'></div>
	<div class = "value left-narrow"		<div class = "retro value left-narrow"
	data-type="slider"		data-type="slider"
	data-height="150"		data-height="150"
Zeile 126:		Zeile 126:
	Eintrag in fhem-tablet-ui-user.css:		Eintrag in fhem-tablet-ui-user.css:
	<syntaxhighlight lang="html">		<syntaxhighlight lang="html">
	.vertical .range-handle {		.retro .vertical .range-handle {
	left: -17px !important;		left: -17px !important;
	}		}

	.range-handle {		.retro .vertical .range-handle {
	width: 35px !important;		width: 35px !important;
	height: 15px !important;		height: 15px !important;

2018-09-18T14:46:09Z

Anpassung der Rolladendarstellung aufgrund von Änderungen in FTUI 2.7.2

← Nächstältere Version		Version vom 18. September 2018, 16:46 Uhr
Zeile 151:		Zeile 151:
	/* Definition for styles to be used for extension of slider widget for display of blinds, awnings etc. */		/* Definition for styles to be used for extension of slider widget for display of blinds, awnings etc. */
	/* normal lines */		/* normal lines */

			.blind .vertical.range-container {
			width: 100%;
			}

	.blind> .vertical .range-bar {		.blind> .vertical .range-bar {
Zeile 159:		Zeile 163:
	background-blend-mode: multiply;		background-blend-mode: multiply;
	background-size: cover;		background-size: cover;
			background-color: rgb(150,150,150) !important;
	}		}

Zeile 176:		Zeile 181:
	background-size: cover;		background-size: cover;
	background-blend-mode: difference;		background-blend-mode: difference;
			background-color: rgb(64,64,64) !important;
			}

			.awning .vertical.range-container {
			width: 100%;
	}		}

2018-03-20T09:17:08Z

← Nächstältere Version		Version vom 20. März 2018, 11:17 Uhr
Zeile 146:		Zeile 146:
	Folgende Anpasssungen sind zu machen:		Folgende Anpasssungen sind zu machen:

	im file fhem-tablet-ui-user.css (falls das noch nicht verwendet wird, muss es natürlich noch in das html file, das aufgerufen wird eingetragen werden) folgende Zeilen einfügen:		im file fhem-tablet-ui-user.css (falls das noch nicht verwendet wird, muss es natürlich noch in das html file, das aufgerufen wird, eingetragen werden) folgende Zeilen einfügen:

	<syntaxhighlight lang="css">		<syntaxhighlight lang="css">

2018-03-20T09:11:58Z

← Nächstältere Version		Version vom 20. März 2018, 11:11 Uhr
Zeile 142:		Zeile 142:
	===Darstellungsmöglichkeit bei Nutzung des Schiebereglers für Rolladen-/Jalousien-/Markisensteuerung===		===Darstellungsmöglichkeit bei Nutzung des Schiebereglers für Rolladen-/Jalousien-/Markisensteuerung===

	[[File:blindsslider.png\|~~200x100px~~]][[File:DarstellungSliderRolladenBunt.png\|~~200x100px~~]]		[[File:blindsslider.png\|200px]] [[File:DarstellungSliderRolladenBunt.png\|240px]]

	Folgende Anpasssungen sind zu machen:		Folgende Anpasssungen sind zu machen:

2018-03-20T09:08:03Z

← Nächstältere Version		Version vom 20. März 2018, 11:08 Uhr
Zeile 142:		Zeile 142:
	===Darstellungsmöglichkeit bei Nutzung des Schiebereglers für Rolladen-/Jalousien-/Markisensteuerung===		===Darstellungsmöglichkeit bei Nutzung des Schiebereglers für Rolladen-/Jalousien-/Markisensteuerung===

	[[File:blindsslider.png]][[File:DarstellungSliderRolladenBunt.png]]		[[File:blindsslider.png\|200x100px]][[File:DarstellungSliderRolladenBunt.png\|200x100px]]

	Folgende Anpasssungen sind zu machen:		Folgende Anpasssungen sind zu machen: