Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[mickyboys]

Hallo,

Es gibt superviele funktionstuechtige Widgets. Leider sind viele von ihnen sehr limitiert mit fest vorgeschriebenen Bildern, etc. Ich moechte gerne selbst entscheiden wie es am Ende ausehen soll.

Als Beispiel, es gibt ein ctrl increment widget, genau was ich brauche, aber leider nur als viereckigen Button. Kann es nicht transparent stellen um mein eigenes png zu nehmen.

Deshalb, gibt es leere Widgets mit vielen Funktionen oder wisst ihr wie man die vorhandenen so aendert das man Spielraum hat?

Danke,

[arteck]

das geht alles… wo ist das Problem ??

[mickyboys]

@arteck:

das geht alles… wo ist das Problem ?? `

Hallo,

Das ist schoen, Danke fuer deine detailierte Antwort :?

Hast du auch etwas genaueres - Ich habe leider nichts passendes gefunden…

Danke

[arteck]

Beschreibe mal dein Problem genauer.. was willst du erreichen ??

[Jey Cee]

Ich denke er hat es schon genau genug beschrieben. Die vorhandenen Widgets entsprechen nicht dem aussehen das er sich wünscht und das lässt sich in bis nicht einfach anpassen.

Er könnte jetzt im Quellcode rum basteln was beim nächsten update verloren geht oder ein eigenes widget auf der Grundlage bauen.

Oder er versucht es mit einer user CSS.

Gesendet von meinem m8 mit Tapatalk

[Homoran]

Wenn ich es aber richtig verstanden habe, will er mit EINEM Widget auch alle möglichen Funktionen steuern können

• on/off

• Level

• button

…..

also alles, wofür bisher verschiedene Widgets gebraucht wurden.

nur das Design lässt sich bei einigen ändern und wenn es nur ein eigenes icon ist.

Gruß

Rainer

[arteck]

@Homoran:

Wenn ich es aber richtig verstanden habe, will er mit EINEM Widget auch alle möglichen Funktionen steuern können

• on/off

• Level

• button

…..

also alles, wofür bisher verschiedene Widgets gebraucht wurden.

nur das Design lässt sich bei einigen ändern und wenn es nur ein eigenes icon ist.

Gruß

Rainer `

genau das habe ich auch Verstanden.. aber .. warum ein Widget für ALLES ?? bissel unsinnig ..

ansonsten kann man alles über javascript und css regeln..

also nochmal was hast du vor ??

[mickyboys]

Moin,

Da ich noch recht neu bin kenn ich nicht alle Widgets, aber alle die ich getestet habe erlauben mir nicht das Design nach meinen Wuenschen zu aendern.

Im Anhang mal ein Screenshot von dem Design. Es ist sehr nahe dem Busch Jaeger Design - ich finde das einfach super, deshalb habe ich es mir nachgebaut.

Auf dem Bild zum Beispiel moechte ich das die Zeichen Plus/Minus animiert sind. Wie bei einigen anderen Widgets im STIL Aenderungseffekt.

Die Widgets mit dem STIL wiederum koennen kein Increment um per Druck schrittweise die Werte zu veraendern.

Und so zieht sich das durch die gesamte Palette.

Sliders sind sehr limitiert, kann nicht das Design aendern (ausser Farbe)

Danke fuer euren Support…

[arteck]

ahh na also…

es würde gehen .bis auf die slider meine ich.. du musst mit 2 ebenen arbeiten.. also musst dich trennen von einem widget .. sonder 2 widgets überlagern .. also ein image für das eigentliche Design und das was drüber liegt ist z.b.: das + wo du draufklickst.. fettisch

[mickyboys]

Klingt das nicht falsch nur weil es in den jetzigen Widgets nicht umgesetzt wurde?

Es muss doch moeglich sein ein Widget mit Increment Funktion ueber was auch immer (CSS, SCRIPT, etc.) das animieren beizubringen?

Oder noch besser aus einem Template einfach die Dinge die man braucht raussuchen und als Widget kompilieren lassen - bin ich wirklich soweit von der Realitaet enternt?

[Pman]

Also du müsstest schon konkreter werden, wie du dir die Animation vorstellst, damit dir geholfen werden kann. Grundsätzlich sind die Widgets ja auch nur so etwas wie vorgefertigte Knöpfe, die einem passen können oder eben nicht. Natürlich kann nicht jeder spezielle Wunsch als Widget umgesetzt werden, sonst gäbe wahrscheinlich allein 100 increment-Widgets. Genau deswegen gibt es ja auch den CSS und Script Tab, womit man dann jedes noch so kleine Detail ändern kann.

Schönes Design übrigens.

Nur mal so als Idee:

.ui-button:active {
  background-color: #ff0000;
  transition:all 0.1s ease;
}

.ui-button:not(:active) {
  background-color: transparent;
  transition:all 1s ease;
}

Farben und Animation kannst du natürlich beliebig anpassen. Man muss ja CSS nicht neu erfinden, wenn es schon eins gibt.

[htrecksler]

Ich häng mich mal ein, weil ich das mit dem Anpassen über CSS sehr interessant finde.

Allerdings fehlt mir der Einstieg um damit zu arbeiten.

Wo genau muss der Code dann geschrieben werden?

Wenn ich ihn bei markiertem Widget einfach in den Reiter CSS kopiere ändert sich dadurch garnichts. Muss im Kopf auf "Global" oder "Projekt" gestellt werden? Ich wäre für ein ganz einfach Beispiel dankbar.

Schönes Wochenende

[mickyboys]

Gibt es eine leicht zu verstehende Uebersicht der moeglichen Befehle im CSS Bereich?

Zum Beispiel, woher weisst du das ui.Button richtig waere, sprich woher kennst du den Namen? Und wo finde ich Namen der anderen Widgets sodass CSS auch nur auf den angesprochen wird?

Fragen ueber Fragen…

Danke,

[htrecksler]

https://www.w3schools.com/css/default.asp

Hier schau ich immer nach. Davon gibt es aber noch mehrere Seiten.

Aber das…
> woher weisst du das ui.Button richtig waere, sprich woher kennst du den Namen? Und wo finde ich Namen der anderen Widgets sodass CSS auch nur auf den angesprochen wird?
ist auch genau mein Problem :-)

[mickyboys]

Hi,

Ich habe zumindestens eine Moeglichkeit gefunden, keine Ahnung ob dies so der Standart ist.

Egal welches Widget du benutzt. Gebe ihm wenn du mit CSS etwas aendern willst einen Namen unter Widget Generell CSS Klasse. z.b. <u>Increment</u>

Gebe unter CSS ein Projekt an und schreib in das leere Feld den Namen den du vorher in der CSS Klasse vergeben hattest.

Nun sollten alle Aenderungen sich nur noch auf diese eine CSS Klasse beziehen. Natuerlich sollte dein Code mit <u>.Increment</u> anfangen.

.Increment {
    background: transparent;
}
.Increment {
    border: transparent;
}

[Pman]

Genau so machst du es, wenn du gezielt ein oder mehrere Widgets ändern willst.

Um ansonsten an die Klassen (in CSS mit "." davor) oder IDs (in CSS mit "#" davor) zu kommen, kann man die Debug-Tools der Browser verwenden.

In Chrome wäre das: Rechtsklick auf ein Element-><u>Untersuchen</u>

Das sieht dann in etwa so aus und man die Klassen / IDs usw. ablesen:

[Harry-IO-HM]

Ich will das Thema noch einmal aufwärmen.

Mir geht es genau so - es gibt sehr sehr viele Widgets - einige mit vielen Konfigurationsmöglichkeiten und andere mit wenig.

So z.B. hqwidgets On/Off - tolle Möglichkeit, unter der Kategorie "Stil" einen Änderungseffekt auszuwählen. Damit hat man bei einer Push-Button-Aktion ein schönes User-Feedback. Ich will ja wissen, ob ich mit meinem fetten Daumen die Taste getroffen habe oder nicht ;)

Wie kann man diesen Änderungseffekt - ohne ein zweites Widget drunterzulegen- zum Beispiel beim Increment-Widget umsetzen?