Ankündigung
Einklappen
Keine Ankündigung bisher.
Hintergrund bei der Bildauswahl
Einklappen
X
-
Und was ist dann mit Bildern, die "leicht grau" sind?Aber ich verstehe schon...
Ich wollte ursprünglich ohnehin ein Streifenmuster machen (wie im Visueditor), aber da das Bild als Hintergrund dargestellt wird (wegen der Skalierung) habe ich aus Faulheit darauf verzichtet... Kommt dann demnächst
EDOMI - Intelligente Steuerung und Visualisierung KNX-basierter Elektro-Installationen (http://www.edomi.de)
-
Bitte
So sieht's dann jetzt aus (die Streifen sind der Hintergrund, die Kugel ist teilweise transparent - meine Testkugel...):
Bildschirmfoto 2016-03-07 um 17.40.37.png
EDOMI - Intelligente Steuerung und Visualisierung KNX-basierter Elektro-Installationen (http://www.edomi.de)
Kommentar
-
...und in der Konfiguration habe ich den Hintergrund auch ergänzt:
Bildschirmfoto 2016-03-07 um 17.47.16.pngEDOMI - Intelligente Steuerung und Visualisierung KNX-basierter Elektro-Installationen (http://www.edomi.de)
Kommentar
-
Christian, wenn du schon bei den Grafiken bist...
Wirst du für Hintergrundbilder (in Elementen) oder Kamerabilder auch eine proportional korrekte Skalierung einbauen? Klar kann ich die Dimensionen des Elements an die des Bildabmessungen anpassen, aber das ist doch jeweils recht mühsam. Und spätestens, wenn Bildnamen dynamisch per KO kommen, geht das nicht mehr.
Und schön wäre es, wenn du SVG so "halboffiziell" (Import möglich) unterstützen würdest. Ich habe unterdessen sicher 3/4 aller Bilder im Edomi als SVG und alles funktioniert bis jetzt völlig normal. Ich weiss, du hast davor gewarnt, weil gewisse Funktionen auf die Bildabmessungen zurückgreifen. (Scheinbar bin ich diesen noch nicht begegnet...hehe).
Auf einem Retina Screen (z.B. iPad Pro) sehen SVG-Grafiken einfach gestochen scharf aus. (Und passen somit besser zu den ebenfalls gestochen scharfen Fonts).
Könntest es ja mit einem Vorbehalt unterstützen. Quasi auf eigene Gefahr. (Wäre noch nützlich, welche Funktionen denn Probleme kriegen könnten, damit man dies besser selber einschätzen könnte.)
Kommentar
-
Zu spät... Update ist schon draußen
Die automatische Skalierung steht schon länger auf meiner Liste - ist aktuell noch nicht fertig (aber in Arbeit): Ich überarbeite zur Zeit sämtliche Visuelemente hinsichtlich diverser Einstellungen, daher dauert's noch etwas.
SVG schaue ich mir mal an (auch wenn ich SVG als gescheitert bewerten würde - spielt im Internet eigentlich keine Rolle mehr). Unabhängig davon: Warum speicherst Du Deine Bitmaps nicht einfach in 2/4-facher Auflösung (Retina)? Dann ist nämlich auch alles gestochen scharfEDOMI - Intelligente Steuerung und Visualisierung KNX-basierter Elektro-Installationen (http://www.edomi.de)
Kommentar
-
Zitat von gaert Beitrag anzeigenZu spät... Update ist schon draußen
Bezüglich automatischer Skalierung evtl. noch eine Idee. Manchmal möchte man es evtl. auch gestreckt (so gross wie das Element) haben und oft eher nicht. Wenn man wählen könnte, wärs natürlich (wieder mal) am Perfektesten. Aber damit dann nicht in allen verschiedenen Dialogen noch ein neues Checkbox-Feld erstellt werden müsste, dachte ich mir, warum nicht deine wachsende Formelsammlung auch für sowas verwenden?
Also überall, wo man ein Bildname/Pfad angeben könnte, könnte man diesen z.B. als {autoscale(#)} definieren. Hätte den Vorteil, dass die Dialoge nicht mit weiteren Eingabeelementen überfrachtet werden, für dich evtl. einfacher umzusetzen wäre (GUI-Programmierung ist ja oft mehr Overhead für die Bedienung als für die eigentliche Funktion) und vorallem wäre es flexibel, weil es (vermutlich) an allen Stellen eingesetzt werden könnte, wo ein Bild angezeigt würde. Abgesehen davon, kann man so nicht so gebräuchliche Funktionen etwas verstecken. (Eine Art Experten-Funktion)
Ich zweifle, ob SVG im Internet als gescheitert betrachtet werden kann. Es ist sicher nicht das zukünftige Browser-Grafikformat geworden, wie es vielleicht von ein paar Jahren erklärt wurde. Aber es ist meiner Meinung nach das verbreiteste VEKTOR-Format in Browsern. Und gerade im CSS-Bereich ist es immer noch sehr beliebt und es gibt sehr viele tolle Anwendungsbeispiele.
Und gerade für Symbole/Icons (wie sie halt in einer Visu oft vorkommen) mag ich ein schlankes, auflösungsunabhängiges Format. Ich muss mich nicht am grösstmöglichen Display orientieren und alles darauf ausrichtet, sondern kümmere mich einfach nicht drum, da ich weiss, dass es (fast) überall sehr gut aussieht.
Ich arbeite sowohl vektor- und auch pixelorientiert. Bin also kein SVG-Fanatiker. Aber wenn ich im Internet eine lizenzfreie Grafik suche, dann ziehe ich ein Vektorformat immer einem Bitmap vor. (Aber wie so oft, das sind halt auch persönliche Vorlieben und/oder Gewohnheiten.)
Kommentar
-
Die Skalierung wird sich in etwa so verhalten, wie bei "Webseite/Bild-URL" - also alle möglichen Kombinationen.
Deine Idee mit der "Funktion" ist zwar ganz nett, aber so nicht umsetzbar - diese Funktionen beziehen sich ausschließlich auf den KO-Wert. Daher wird es auf eine Selectbox hinauslaufen, nach dem Motto "Skalierung des Hintergrundbildes". Dies wird allerdings nicht bei allen Visuelementen verfügbar sein (Z.B. Nicht beim Dimmer), da dies nicht ohne weiteres möglich ist. Alternativ könnte ich auch einfach ein neues Visuelement "Bild" einführen, so dass nur hier spezielle Bildeinstellungen vorgenommen werden können (Skalierung und evtl. auch noch andere Dinge).
Ich persönlich habe übrigens nichts gegen SVG (prinzipiell zumindest), es geht mir nur darum, dass Vektorformate generell eher aussterben im Browser... Heute macht man große Bitmaps oder zeichnet auf einem canvas vor sich hin. Aber wie gesagt: Ist uff Liste und ich werde mich damit beschäftigen - versprochenEDOMI - Intelligente Steuerung und Visualisierung KNX-basierter Elektro-Installationen (http://www.edomi.de)
Kommentar
-
Zwischenstand: SVG wird demnächst offiziell unterstützt - auch animierte SVGs. Einschränkungen sind mir in Safari/Chrome/iOS bislang nicht aufgefallen - mit einer Ausnahme: Die SVGs werden nicht in die Größe des Visuelements eingepasst, bzw. behalten dabei das Seitenverhältnis bei (was ja durchaus sinnvoll ist). Dies liegt in der Macht der SVG-Datei selbst, d.h. wenn dort eine "absolute" Größe angegeben wurde, wird dieses Seitenverhältnis beibehalten. Es ist also nicht möglich, ein SVG zu "stretchen" ohne die SVG-Datei entsprechend zu modifizieren. Aber dies dürfte in den meisten Fällen ohnehin nicht erwünscht seinEDOMI - Intelligente Steuerung und Visualisierung KNX-basierter Elektro-Installationen (http://www.edomi.de)
Kommentar
-
Für dich schnell rausgesucht... ;-)
https://knx-user-forum.de/forum/proj...179#post907179
Ich pass das bei jedem Update an. (Und hatte bis jetzt noch keine Probleme damit.)
Aber wie gaert es schon damals erwähnt hat: Zurzeit noch völlig unsupported. Auf eigene Gefahr!
Kommentar
-
Im nächsten Update wird SVG wie gesagt offiziell unterstützt. Dann kann man übrigens auch Gradienten als Hintergrund verwenden und gleichzeitig ein Bild (Bitmaps oder SVG) anzeigen lassen. Dies funktionierte bislang nicht mit Gradienten, sondern nur mit Einzelfarben:
(oben: PNG, unten: animiertes transparentes SVG mit Gradient-Hintergrund)
Bildschirmfoto 2016-03-08 um 14.23.25.pngEDOMI - Intelligente Steuerung und Visualisierung KNX-basierter Elektro-Installationen (http://www.edomi.de)
Kommentar
-
Very nice!
An den Gradienten ("Dynamischer Verlauf") selber hat sich aber nichts geändert? (betrifft also nur das Verhalten bei darüberliegenden Grafiken?)
Eine Frage hätte ich passend zu diesem Thema:
Ich würde gerne mit CSS einen dynamischen Kreis (Ring) erzeugen. Wieweit der Kreis geschlossen ist, hängt vom Wert eines KO's ab. (Am liebsten auch animiert, dass z.B. beim Laden der Seite sich der Kreis von 0° bis zum KO-Wert aufbaut.)
Zerbreche mir dabei die ganze Zeit den Kopf, wie man dies (mit um die Ecke denken) mit Edomi Bordmitteln lösen könnte. In der dynamischen Hintergrundfarbe und bei den Animationen stehen ja CSS-Eingabemöglichkeiten zur Verfügung. Aber mir ist nicht so klar, wieweit man dort gehen kann. Bei den Animationen akzeptiert er recht viel (Mehrzeiler), bei der Hintergrundfarbe ist es offenbar eher eingeschränkt.
Hatte da so Ideen, dass ich zum Beispiel auf Z-0 einen 360° RING mit tollem Farbverlauf lege. Und auf Z-1 dann einen schwarz (oder weiss) gefüllten KREIS (wie Kuchendiagramm) lege, dessen Öffnungswinkel nun animiert durch den KO-Wert kontrolliert würde. Dieses Z-1 Element wäre dann eine Alphamaske. Also alles schwarz lässt das darunterliegende Element durch und weiss wäre undurchsichtig. (Das Z-1 Element würde ich noch unscharf setzen).
Mir wäre es egal, ob ich da ein kompliziertes Konstrukt mit mehreren Elementen zusammenbastle, Hauptsache, es käme dann ein völlig frei definierbarer Kreis/Ring raus. Wäre auch cool, um bisschen die Möglichkeiten von Edomi (und CSS) auszureizen. Halt ein Eye-Catcher. (Geht in die Richtung deines animierten Lade-Symbols in Form von rotierenden Kreisen)
Vielleicht hast du meine Screenshots zu meinem LBS für den Fronius Wechserichter gesehen. Hab das im Moment mit 10 Bitmap-Bildern gelöst, was ich nicht so prickelnd finde. CSS (und sogar animiert) wäre wesentlich cooler...
Also mir gehts im Moment eher darum, wie weit Edomi schon jetzt mit CSS gefüttert werden kann und ob du später vielleicht mal bei den Visu-Elementen mehr CSS-Freiheiten erlaubst? (Einfach nur CSS pur, also kein JS.)
So für die Experimentierfreudigen...
Kommentar
Kommentar