Skip to content
  • Home
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Material Design Widgets: Checkbox, Switch Widget

NEWS

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    22
    1
    1.1k

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    9.1k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    14
    1
    2.4k

Material Design Widgets: Checkbox, Switch Widget

Scheduled Pinned Locked Moved Visualisierung
vis
33 Posts 16 Posters 5.6k Views 19 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • K K_o_bold

    Hallo @Scrounger ,

    vielen Dank für die Widgets. Ich arbeite mich gerade ein bisschen ein und habe als erstes einen einfachen Switch in meine VIS integriert.
    Allerdings ist mir das Widget zu klein. Wie kann ich es denn in der Größe ändern ?

    ScroungerS Offline
    ScroungerS Offline
    Scrounger
    Developer
    wrote on last edited by
    #3

    @K_o_bold

    Das geht nicht, haben eine fixe Größe laut Material Design Guidlines.
    Mit css klasse überschreiben müsste das trotzdem gehen

    1 Reply Last reply
    0
    • 0 Offline
      0 Offline
      0018
      wrote on last edited by
      #4

      Gibt es eine Möglichkeit bei der Checkbox eine unterscheidliche Randfarbe zuzuweisen? Die Angabe "Kontrollkästchenfarbe" im Widget kommt bei mir leider nur zum tragen wenn der Wert auf true geht. bei false bleibt der Rand immer schwarz.

      Kannst du genauer beschreiben wie css Klasse für die Größe aussehen muss?

      Mfg
      0018

      ScroungerS 1 Reply Last reply
      0
      • M Offline
        M Offline
        mctom
        wrote on last edited by
        #5

        Ich würde gerne auch die Farbe des Rahmens anpassen. Gibt es hierzu schon eine Lösung ?

        1 Reply Last reply
        0
        • 0 0018

          Gibt es eine Möglichkeit bei der Checkbox eine unterscheidliche Randfarbe zuzuweisen? Die Angabe "Kontrollkästchenfarbe" im Widget kommt bei mir leider nur zum tragen wenn der Wert auf true geht. bei false bleibt der Rand immer schwarz.

          Kannst du genauer beschreiben wie css Klasse für die Größe aussehen muss?

          ScroungerS Offline
          ScroungerS Offline
          Scrounger
          Developer
          wrote on last edited by
          #6

          @0018 sagte in Material Design Widgets: Checkbox, Switch Widget:

          Kannst du genauer beschreiben wie css Klasse für die Größe aussehen muss?

          @mctom sagte in Material Design Widgets: Checkbox, Switch Widget:

          Ich würde gerne auch die Farbe des Rahmens anpassen. Gibt es hierzu schon eine Lösung ?

          .mdc-checkbox__background {
              border-color: red !important;
          }
          
          1 Reply Last reply
          0
          • FoodFighterF Offline
            FoodFighterF Offline
            FoodFighter
            wrote on last edited by
            #7

            Gibt es eine Möglichkeit einen Switch so oder ähnlich zu verriegeln, wie es bei z.B. dem Button-State der Fall ist?

            Ich mag diese kleinen Slider-Switches, es gibt aber ein paar Schaltstellen (z.B. die Steckdose vom 3D-Drucker) bei denen ich gerne eine zweite Sicherheit einbauen würde um ein versehentliches Ausschalten zu vermeiden, falls man mal mal mit den Wurstfingern daneben toucht.

            ScroungerS 2 Replies Last reply
            0
            • FoodFighterF FoodFighter

              Gibt es eine Möglichkeit einen Switch so oder ähnlich zu verriegeln, wie es bei z.B. dem Button-State der Fall ist?

              Ich mag diese kleinen Slider-Switches, es gibt aber ein paar Schaltstellen (z.B. die Steckdose vom 3D-Drucker) bei denen ich gerne eine zweite Sicherheit einbauen würde um ein versehentliches Ausschalten zu vermeiden, falls man mal mal mit den Wurstfingern daneben toucht.

              ScroungerS Offline
              ScroungerS Offline
              Scrounger
              Developer
              wrote on last edited by
              #8

              @FoodFighter
              Müsste ich extra einbauen. Schreib bitte nen Feature Request (issue) auf github.

              1 Reply Last reply
              0
              • ScroungerS Scrounger

                Checkbox Widget | Switch Widget

                switch.gif
                checkbox.gif

                Sämtliche Fragen zu Einstellungen (VIS Editor, Bedienung, JSON strings, etc.) des Widgets hier stellen

                Das ist sicher besser für die Übersichtlichkeit und Dokumentation.

                • Dokumentation Checkbox
                • Dokumentation Switch
                • Online Beispiel

                Themen zu anderen Widgets findest du hier!

                E Offline
                E Offline
                el_rob
                wrote on last edited by el_rob
                #9

                @Scrounger Vielen Dank für die Widgets. Wäre es möglich beim Switch Widget eine Wahlmöglichkeit hinzuzufügen, so dass man entweder den Zustand, wenn der Wert nicht der Bedingung "Ein" oder alternativ nicht der Bedingung "Aus" entspricht, wählen kann? Ich würde das Widget gerne mit Z-Wave-Dimmern verwenden. Der Wert für "Aus" ist 0 und der Wert für "Ein" 255 (damit wird der letzte Dimmwert wiederhergestellt und der Datenpunkt nach 255 auf den entsprechenden Wert gesetzt). Ich würde deshalb gerne den "Zustand, wenn der Wert nicht der Bedingung 'Aus' entspricht" auf "Ein" stellen können, damit der Switch "Ein" anzeigt, wann immer der Wert >0 ist...

                Sorry, man sollte zuerst zu Ende denken... :man-facepalming: Natürlich bekomme ich das was ich möchte, wenn ich "Zustand, wenn der Wert nicht der Bedingung 'Ein' entspricht" auf "An" stelle :face_with_rolling_eyes:

                1 Reply Last reply
                0
                • FoodFighterF FoodFighter

                  Gibt es eine Möglichkeit einen Switch so oder ähnlich zu verriegeln, wie es bei z.B. dem Button-State der Fall ist?

                  Ich mag diese kleinen Slider-Switches, es gibt aber ein paar Schaltstellen (z.B. die Steckdose vom 3D-Drucker) bei denen ich gerne eine zweite Sicherheit einbauen würde um ein versehentliches Ausschalten zu vermeiden, falls man mal mal mit den Wurstfingern daneben toucht.

                  ScroungerS Offline
                  ScroungerS Offline
                  Scrounger
                  Developer
                  wrote on last edited by
                  #10

                  @FoodFighter sagte in Material Design Widgets: Checkbox, Switch Widget:

                  Gibt es eine Möglichkeit einen Switch so oder ähnlich zu verriegeln, wie es bei z.B. dem Button-State der Fall ist?

                  Hab es eingebaut, wenn du testen magst, aktuelle version von github ziehen.

                  checkbox.gif

                  FoodFighterF 1 Reply Last reply
                  0
                  • ScroungerS Scrounger

                    @FoodFighter sagte in Material Design Widgets: Checkbox, Switch Widget:

                    Gibt es eine Möglichkeit einen Switch so oder ähnlich zu verriegeln, wie es bei z.B. dem Button-State der Fall ist?

                    Hab es eingebaut, wenn du testen magst, aktuelle version von github ziehen.

                    checkbox.gif

                    FoodFighterF Offline
                    FoodFighterF Offline
                    FoodFighter
                    wrote on last edited by
                    #11

                    @Scrounger
                    Funktioniert, sehr geil!
                    Vielen Dank :)

                    1 Reply Last reply
                    0
                    • S Offline
                      S Offline
                      sk8er-boi
                      wrote on last edited by
                      #12

                      Hey @Scrounger ,

                      ich habe einen Switch und einen Slider parallel laufen für einen Rolladen.
                      Der Switch soll zwischen 0 und 0.8 hin und her schalten.
                      Allerdings funktioniert es nicht so richtig. Ich kann ihn einmal auf 0.8 fahren lassen. Jedoch steht der Rolladen dann bei 0.800004 ( was ja ungleich 0.8 ist), so kann ich nicht wieder auf 0 umschalten. Hast du eine Idee das zu umgehen ?

                      Gruß Daniel

                      Unbenannt.JPG

                      S 1 Reply Last reply
                      0
                      • K Offline
                        K Offline
                        killroy2
                        wrote on last edited by
                        #13

                        Hallo, ich verwende das Checkbox widget. Ich habe einen Wert zum Stellen und einen Wert zum anzeigen. Beide sind unterschiedlich weil von verschiedenen Stellen auch setzbar. Lässt sich das Widget mit 2 Werten kombinieren bzw. gibt es ein besseres UI um Schalten/Anzeigen in einem Element zu vereinen?
                        Danke

                        1 Reply Last reply
                        0
                        • S sk8er-boi

                          Hey @Scrounger ,

                          ich habe einen Switch und einen Slider parallel laufen für einen Rolladen.
                          Der Switch soll zwischen 0 und 0.8 hin und her schalten.
                          Allerdings funktioniert es nicht so richtig. Ich kann ihn einmal auf 0.8 fahren lassen. Jedoch steht der Rolladen dann bei 0.800004 ( was ja ungleich 0.8 ist), so kann ich nicht wieder auf 0 umschalten. Hast du eine Idee das zu umgehen ?

                          Gruß Daniel

                          Unbenannt.JPG

                          S Offline
                          S Offline
                          sk8er-boi
                          wrote on last edited by
                          #14

                          @sk8er-boi sagte in Material Design Widgets: Checkbox, Switch Widget:

                          Hey @Scrounger ,

                          ich habe einen Switch und einen Slider parallel laufen für einen Rolladen.
                          Der Switch soll zwischen 0 und 0.8 hin und her schalten.
                          Allerdings funktioniert es nicht so richtig. Ich kann ihn einmal auf 0.8 fahren lassen. Jedoch steht der Rolladen dann bei 0.800004 ( was ja ungleich 0.8 ist), so kann ich nicht wieder auf 0 umschalten. Hast du eine Idee das zu umgehen ?

                          Gruß Daniel

                          Unbenannt.JPG

                          Unbenannt.JPG

                          Ich habs jetzt einfach mit zwei Buttons gelöst. Ist warscheinlich auch schlauer.

                          1 Reply Last reply
                          0
                          • Daniel ZenkerD Offline
                            Daniel ZenkerD Offline
                            Daniel Zenker
                            wrote on last edited by
                            #15

                            Hi,

                            erst mal Hut ab! Tolle Widgets! Dennoch habe ich eine Frage:

                            Ich habe mehrere Aktoren die unterschiedliche MQTT Topics für Status und Command nutzen. z.B. Shellys und Sonoffs, die ein STAT-Topic und ein COMMAND-Topic nutzen. Für deinen Switch müsste ich also das COMMAND-Topic eintragen, damit ich die Aktoren schalten kann. Allerdings habe ich hier das Problem, dass dieses Topic nicht immer dem STATE entspricht. Sprich, wenn sich der Status ausserhalb von ioBroker ändert (z.B. wenn der verkabelte Wandschalter gedrückt wird).

                            Bei einigen anderen Windgets wird das durch die Einstellung "Extrasteuerung" gelöst. Dort kann ich das STATE-Topic fürs Widget und das COMMAND Topic zum Schalten eintragen.

                            Diese Einstellung finde ich leider in keinem deiner Widgets... Hast du da eine Lösung für mich?

                            1 Reply Last reply
                            0
                            • S Offline
                              S Offline
                              saeft_2003
                              Most Active
                              wrote on last edited by
                              #16

                              Kann mir einer von euch sagen wo ich die Rahmenfarbe von einem nicht aktiven checkbox widget umstellen kann?

                              Im Moment ist diese bei mir schwarz und da ich einen fast schwarzen Hintergrund habe sieht man dieses kaum.

                              2020-06-23_07h43_57.png

                              0 1 Reply Last reply
                              0
                              • S saeft_2003

                                Kann mir einer von euch sagen wo ich die Rahmenfarbe von einem nicht aktiven checkbox widget umstellen kann?

                                Im Moment ist diese bei mir schwarz und da ich einen fast schwarzen Hintergrund habe sieht man dieses kaum.

                                2020-06-23_07h43_57.png

                                0 Offline
                                0 Offline
                                0018
                                wrote on last edited by 0018
                                #17

                                @saeft_2003 Schau mal weiter oben bei Post6, ich denke das sollte dir helfen oder?

                                Mfg
                                0018

                                S 2 Replies Last reply
                                1
                                • 0 0018

                                  @saeft_2003 Schau mal weiter oben bei Post6, ich denke das sollte dir helfen oder?

                                  S Offline
                                  S Offline
                                  saeft_2003
                                  Most Active
                                  wrote on last edited by
                                  #18

                                  @0018

                                  Danke das hatte ich überlesen!

                                  1 Reply Last reply
                                  0
                                  • 0 0018

                                    @saeft_2003 Schau mal weiter oben bei Post6, ich denke das sollte dir helfen oder?

                                    S Offline
                                    S Offline
                                    saeft_2003
                                    Most Active
                                    wrote on last edited by
                                    #19

                                    @0018 sagte in Material Design Widgets: Checkbox, Switch Widget:

                                    @saeft_2003 Schau mal weiter oben bei Post6, ich denke das sollte dir helfen oder?

                                    Weißt du zufällig ob das ganze so, auch hier funktioniert?

                                    https://forum.iobroker.net/topic/29666/material-design-widgets-input-select-autocompl/81

                                    1 Reply Last reply
                                    0
                                    • D3ltoroxpD Offline
                                      D3ltoroxpD Offline
                                      D3ltoroxp
                                      wrote on last edited by D3ltoroxp
                                      #20

                                      Hätte eine Frage zu den Checkboxen ? Diese sieht wie folgt aus.

                                      270d92ce-89c1-49e2-a1e2-5bf9df7aa541-image.png

                                      Mein Datenpunkt so ::

                                      4e3dd065-8ee0-4dc8-bbf5-e7280344966b-image.png

                                      Nun sollte sich das ja im DP ändern true / false, Häckchen drin true / Häckchen raus false. Tut es aber nicht. Entweder mein DP falsch, oder bei ein / aus Wert falsch ?

                                      Hatte vorher die normale Checkbox, damit gings.

                                      EDIT::::

                                      Habs, hab jetzt true / false durch 0 / 1 getauscht.

                                      Johannes BauerstatterJ ScroungerS 2 Replies Last reply
                                      0
                                      • D3ltoroxpD D3ltoroxp

                                        Hätte eine Frage zu den Checkboxen ? Diese sieht wie folgt aus.

                                        270d92ce-89c1-49e2-a1e2-5bf9df7aa541-image.png

                                        Mein Datenpunkt so ::

                                        4e3dd065-8ee0-4dc8-bbf5-e7280344966b-image.png

                                        Nun sollte sich das ja im DP ändern true / false, Häckchen drin true / Häckchen raus false. Tut es aber nicht. Entweder mein DP falsch, oder bei ein / aus Wert falsch ?

                                        Hatte vorher die normale Checkbox, damit gings.

                                        EDIT::::

                                        Habs, hab jetzt true / false durch 0 / 1 getauscht.

                                        Johannes BauerstatterJ Offline
                                        Johannes BauerstatterJ Offline
                                        Johannes Bauerstatter
                                        wrote on last edited by
                                        #21

                                        Hallo,

                                        kann ich diese Buttons auf Taster umstellen oder müssen diese mittels script zurück gesetzt werden:

                                        a1179485-b0c3-44e9-8f1a-72737e451eaa-image.png

                                        Ich benötige teilweise nur einen kurzen Impuls um Aktionen oder Szenen zu starten.

                                        liv-in-skyL 1 Reply Last reply
                                        0
                                        • Johannes BauerstatterJ Johannes Bauerstatter

                                          Hallo,

                                          kann ich diese Buttons auf Taster umstellen oder müssen diese mittels script zurück gesetzt werden:

                                          a1179485-b0c3-44e9-8f1a-72737e451eaa-image.png

                                          Ich benötige teilweise nur einen kurzen Impuls um Aktionen oder Szenen zu starten.

                                          liv-in-skyL Offline
                                          liv-in-skyL Offline
                                          liv-in-sky
                                          wrote on last edited by liv-in-sky
                                          #22

                                          @Johannes-Bauerstatter

                                          edit: war falsche info - gelöscht

                                          nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                                          1 Reply Last reply
                                          0
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          802

                                          Online

                                          32.5k

                                          Users

                                          81.6k

                                          Topics

                                          1.3m

                                          Posts
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Home
                                          • Recent
                                          • Tags
                                          • Unread 0
                                          • Categories
                                          • Unreplied
                                          • Popular
                                          • GitHub
                                          • Docu
                                          • Hilfe