[FHEM-Tablet-UI] User-Demos

[hsepm]

die Button die du im ersten Bild darstellst sehen Klasse aus, kannst du sagen wie du sie erstellt hast.?

Die Buttons sind von pixabay unter CC0 Lizenz (https://pixabay.com/de/service/terms/#usage). Ich habe sie für meine Zwecke ein wenig mit Photoshop nachbearbeitet.

Einbindung über CSS:

Code Auswählen Erweitern


.blue-boxh {
            background: url(../images/Box_Blue.png) no-repeat;
            width: 256px;
            height: 256px;
            background-size: contain;
        }


und dann im HTML-Code:

Code Auswählen Erweitern


<div data-type="symbol" class="great"
data-device="HomeStatus"
data-background-icons='["blue-boxh myshadow2","black-boxh myshadow2","gray-boxh myshadow2","gray-boxh myshadow2"]'
data-icons='["fa-home","fa-bed","fa-automobile","fa-bug"]'
data-states='["Zuhause","Schlafen","Abwesend", ".*"]'
data-color="white">
</div>


EDIT:

Bevor jemand fragt, was myshadow2 ist. Der Name ist historisch, da ich hier mit CSS-Schatten experimentiert habe. Schatten ist aber SEHR CPU-lastig, das kann ich mir bei meinem Trekstor Tablet nicht leisten.

Derzeit ist myshadow2 ein leichter Transparenz-Effekt, d.h. der Hintergrund scheint dezent durch.

Code Auswählen Erweitern


.myshadow2 {
  opacity: .85 !important;
}


[moonsorrox]

OK vielen Dank, da bin ich dann aber erst mal raus. Habe kein Photoshop und kenne mich auch nicht damit aus.
Die Button habe ich dort auch nicht gefunden, da muss man wohl angemeldet sein..!?

Vielleicht kannst du mal einen Button hier einstellen, denn kann man dann sicher mit Inkscape bearbeiten, dass Programm habe ich aber muss auch damit lernen 

[hsepm]

Grauer Button: https://pixabay.com/de/button-dr%C3%BCcken-digital-push-3d-1363283/

Verschiedene Farben:
https://pixabay.com/de/button-quadrat-gl%C3%A4nzend-149480/

Ob Photoshop oder Gimp oder anderes, Hauptsache, es geht vom Funktionsumfang über Microsoft Paint hinaus.

[tj23]

@Andre0909: Deine FTUI gefällt mir sehr gut, gibt es irgendwo den html als download bzw würdest du ihn zur Verfügung stellen?

[andies]

Das ist ja ein Tablet UI und hier sind auch viele schöne Tablets zu sehen. Ich arbeite fast nur mit dem iPhone (6), weil mein Tablet zu alt ist. Gibt es da vergleichbare Sachen von jemandem? Der Bildschirm ist ja um einiges kleiner!

[AET_FHEM]

Im wesentlichen sind das nur Kleinigkeiten, aber falls Interesse besteht, kann ich meine html-Dateien noch mal posten.

Hey, ich hab die alte Version schon etwas für mich angepasst die neue sieht noch eine Nummer schärfer aus SUPER, ich fände es klasse wenn du deine HTML bereit stellen würdest

[hsepm]

Hey, ich hab die alte Version schon etwas für mich angepasst die neue sieht noch eine Nummer schärfer aus SUPER, ich fände es klasse wenn du deine HTML bereit stellen würdest

Hallo AET_FHEM,

Ich hoffe, dass ich das am Wochenende schaffe.

Gruß,
Holger

[Eisix]

Hallo,

habe mal meine Monitoring-Seite überarbeitet.

Gruß
Eisix

[SirMarco]

Hallo,

habe mal meine Monitoring-Seite überarbeitet.

Gruß
Eisix

Das ja mal genial:-)

Was machst du mit dem fhem rollback Button?

[Octopus180]

Konntest du uns die HTML Daten zu Verfügung stellen.

Danke

Gruß Peter

[Eisix]

@SirMarco
führt ein Shell-Script aus welches das letzte Update zurück kopiert.

@Octopus
Kann ich Anfang nächster Woche machen

Gruß
Eisix

[hsepm]

Hallo AET_FHEM,

Ich hoffe, dass ich das am Wochenende schaffe.

Gruß,
Holger

Here we go. Du musst dir nur eigene 3D-Button-Icons bauen und per CSS einhängen.

Viele Grüße,
Holger
 

[Eisix]

Hallo,

wie zugesagt meine Monitoring-Seite. Bei vielen Sachen sind noch Popups mit Zusatzinformationen.
Bei mir auf dem Mac wird es entpackt. Habe das gleiche nochmals als .zip drangehängt.

export ist ein Ordner der 1_Settings.html enthält und einen Ordner templates mit den Subpages.

Gruß
Eisix

[moonsorrox]

da stimmt irgend etwas nicht mit, wenn du die entpackst zeigt er nur ein export ohne Endung, evtl. sollte Eisix noch etwas dazu schrieben

[SirMarco]

@Eisix:

Das mal echt Klasse Verrätst du uns mehr über das data-device "UPDATE"?