Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. VIS eigenes Widget erstellen

    NEWS

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    • Minor js-controller 7.0.7 Update in latest repo

    VIS eigenes Widget erstellen

    This topic has been deleted. Only users with topic management privileges can see it.
    • CrunkFX
      CrunkFX Forum Testing @da_Woody last edited by CrunkFX

      @da_woody @MartinK

      Ich habe nun noch ein paar weitere Controls gebastelt. Solltet ihr noch wünsche haben, sagt bescheid.
      Hier könnt ihr das testen: https://iobroker.astoria-systems.de/vis/index.html?ShellyButons#Buttons

      Switch
      88efd492-02d7-46fc-ba83-5fce32e46c97-image.png
      Code: https://raw.githubusercontent.com/CrunkFX/IOBrokerCustomFiles/master/Switch

      Switch mit Power
      c4c860cd-b135-445d-a0cb-9468ea31c09e-image.png
      Code: https://raw.githubusercontent.com/CrunkFX/IOBrokerCustomFiles/master/Switch-Power

      Temperatur und Feuchtigkeit mit Batterie
      ce01d00a-4e7d-49c9-9c96-693c6d405493-image.png
      Code: https://raw.githubusercontent.com/CrunkFX/IOBrokerCustomFiles/master/Hum-Temp-Bat

      Temperatur und Feuchtigkeit
      999b8913-92c6-46ef-835c-83b1240b20af-image.png
      Code: https://raw.githubusercontent.com/CrunkFX/IOBrokerCustomFiles/master/Hum-Temp

      Energy
      604d323a-f82c-4364-91d0-b7d8cc52e531-image.png
      Code: https://raw.githubusercontent.com/CrunkFX/IOBrokerCustomFiles/master/Power

      Da Woody Spezial
      ce61f3a9-ec41-4887-911a-05bf54191cf1-image.png
      Code: https://raw.githubusercontent.com/CrunkFX/IOBrokerCustomFiles/master/DaWoody

      EDIT

      Falls möglich benutzt bitte die Hintergründe als PNG. Bei vielen Elementen kann es mit Base64 zu Problemen kommen. Die Assets findet ihr hier: https://github.com/CrunkFX/IOBrokerCustomFiles/tree/master/Images

      MartinK. da_Woody sigi234 5 Replies Last reply Reply Quote 2
      • MartinK.
        MartinK. @CrunkFX last edited by

        @crunkfx Meeega! Vielen vielen Dank für die Arbeit !!! 👍 👍 😊 👏 👏

        Jetzt weiß ich auch warum ich die letzten Objekte nicht mehr schalten konnte, ich habe den Klickschutz komplett über die ganze Gruppe gezogen 🤦‍♂️ Das ist wohl beim anpassen passiert 😉

        CrunkFX 1 Reply Last reply Reply Quote 0
        • CrunkFX
          CrunkFX Forum Testing @MartinK. last edited by

          @martink OK das macht natürlich Sinn. Ich konnte das nämlich nicht nachstellen. Ich lade sofort noch die Screenshots hoch. Das ist auf dauer besser damit zu Arbeiten als mit den Base64 Codierten Bildern.

          MartinK. 1 Reply Last reply Reply Quote 0
          • MartinK.
            MartinK. @CrunkFX last edited by

            @crunkfx said in VIS eigenes Widget erstellen:

            @martink OK das macht natürlich Sinn. Ich konnte das nämlich nicht nachstellen. Ich lade sofort noch die Screenshots hoch. Das ist auf dauer besser damit zu Arbeiten als mit den Base64 Codierten Bildern.

            Muss ich dann die "Gruppenwidgets" die ich bereits nutze nochmal mit den Screenshots anpassen ? Ich habe beim editieren der Gruppe auch mal das "Schalter Foto" welchen bei On + Off genutzt wird geschaut, aber da wird ja angezeigt, das dass Foto nicht hinterlegt ist ... 🤔 wie kann denn was angezeigt werden - was nicht hinterlegt ist?? Bzw. woher hat er denn das "Schalter Foto" ???
            0dd0616c-cab0-410e-ae48-e32e6527a5a0-image.png

            CrunkFX 1 Reply Last reply Reply Quote 0
            • CrunkFX
              CrunkFX Forum Testing @MartinK. last edited by

              @martink Das ist als Text Codiert. Es gibt die Möglichkeit Bilder komplett als Text zu Codieren und somit zu gewährleisten, dass der Endnutzer das Bild hat. In dem Link beginnend mit "data:image/jpeg" ist das Bild quasi Bit für Bit enthalten. Diesen Link kannst du z.B. hier: https://base64.guru/converter/decode/image zu einem Bild zurück wandeln.

              MartinK. 1 Reply Last reply Reply Quote 0
              • da_Woody
                da_Woody @CrunkFX last edited by

                @crunkfx said in VIS eigenes Widget erstellen:

                Da Woody Spezial

                boah, ey! doch nicht prinz, eher prinzessin! ausziehen.gif
                wenn du so weitermacht, wird da noch ein vis-abkömmling draus! respekt.gif

                CrunkFX 1 Reply Last reply Reply Quote 1
                • MartinK.
                  MartinK. @CrunkFX last edited by

                  @crunkfx said in VIS eigenes Widget erstellen:

                  @martink Das ist als Text Codiert. Es gibt die Möglichkeit Bilder komplett als Text zu Codieren und somit zu gewährleisten, dass der Endnutzer das Bild hat. In dem Link beginnend mit "data:image/jpeg" ist das Bild quasi Bit für Bit enthalten. Diesen Link kannst du z.B. hier: https://base64.guru/converter/decode/image zu einem Bild zurück wandeln.

                  Cooole Sache! 🕵 Also ich habe in den letzten 24 Std. viel dazugelernt! 🙂 ... und warum ist es besser das PNG zu nutzen ? Ist das performanter für die VIS ?

                  da_Woody CrunkFX 2 Replies Last reply Reply Quote 0
                  • da_Woody
                    da_Woody @MartinK. last edited by

                    @martink said in VIS eigenes Widget erstellen:

                    Bild quasi Bit für Bit enthalten

                    png -> komptimiert

                    1 Reply Last reply Reply Quote 0
                    • CrunkFX
                      CrunkFX Forum Testing @MartinK. last edited by

                      @martink Erstens muss er ständig Decodieren, zweitens ist die PNG Datei auf dem System Technisch nur 1 mal vorhanden und wird nur kopiert.

                      da_Woody 1 Reply Last reply Reply Quote 0
                      • CrunkFX
                        CrunkFX Forum Testing @da_Woody last edited by

                        @da_woody Wo kommen eigentlich die GIF´s immer her ? 😊

                        da_Woody 1 Reply Last reply Reply Quote 0
                        • da_Woody
                          da_Woody @CrunkFX last edited by

                          @crunkfx so kann mans auch sagen klugscheiss.gif

                          1 Reply Last reply Reply Quote 0
                          • da_Woody
                            da_Woody @CrunkFX last edited by

                            @crunkfx kristallkugel.gif
                            die sind aus meinem board und liegen da nur auf meiner SSD rum im backup

                            1 Reply Last reply Reply Quote 1
                            • MartinK.
                              MartinK. @CrunkFX last edited by

                              Falls möglich benutzt bitte die Hintergründe als PNG. Bei vielen Elementen kann es mit Base64 zu Problemen kommen. Die Assets findet ihr hier: https://github.com/CrunkFX/IOBrokerCustomFiles/tree/master/Images

                              Ich habe noch eine Frage zu den PNG's ... Der on + off Button ist doch immer der gleiche ? oder worin besteht der unterschied in den Button PNG'S ? 😀

                              CrunkFX 1 Reply Last reply Reply Quote 0
                              • CrunkFX
                                CrunkFX Forum Testing @MartinK. last edited by

                                Ich habe noch eine Frage

                                So viele du willst 😉

                                Der einzige Unterschied besteht in dem Blauen Teil

                                MartinK. da_Woody 2 Replies Last reply Reply Quote 0
                                • MartinK.
                                  MartinK. @CrunkFX last edited by

                                  @crunkfx said in VIS eigenes Widget erstellen:

                                  Ich habe noch eine Frage

                                  So viele du willst 😉

                                  Der einzige Unterschied besteht in dem Blauen Teil

                                  😉 .... Also diese 6 PNG's sind doch alle identisch oder? ist doch immer On / Off oder habe ich was übersehen ?

                                  33629663-ee95-46e5-bdcd-35a01bd6e782-image.png

                                  CrunkFX da_Woody 2 Replies Last reply Reply Quote 0
                                  • da_Woody
                                    da_Woody @CrunkFX last edited by

                                    @crunkfx said in VIS eigenes Widget erstellen:

                                    Der einzige Unterschied besteht in dem Blauen Teil

                                    dann fehlt aber noch einer. floet.gif
                                    wenn der SW kontakt verwendet wird!
                                    cc45e6bc-90c8-4315-b69f-6d70cfb4eee2-grafik.png 25491fcd-d74f-4418-a1fd-3cfa5bebb38c-grafik.png
                                    undweg.gif

                                    1 Reply Last reply Reply Quote 0
                                    • CrunkFX
                                      CrunkFX Forum Testing @MartinK. last edited by

                                      @martink 292f1edb-e7d0-4cd9-9ae3-89db9151df0a-image.png
                                      318ecd01-b933-4c95-9903-aad5ab0de000-image.png
                                      Darin liegt der Unterschied in den Dateien

                                      MartinK. 1 Reply Last reply Reply Quote 0
                                      • da_Woody
                                        da_Woody @MartinK. last edited by

                                        @martink nope, schau sie dir an!

                                        MartinK. 1 Reply Last reply Reply Quote 0
                                        • MartinK.
                                          MartinK. @da_Woody last edited by

                                          @da_woody Sorry.... meine Augen sind von den hier geleisteten ganzen technischen Raffinessen schon total blind.... 😎

                                          da_Woody 1 Reply Last reply Reply Quote 0
                                          • sigi234
                                            sigi234 Forum Testing Most Active @CrunkFX last edited by

                                            @crunkfx said in VIS eigenes Widget erstellen:

                                            Solltet ihr noch wünsche haben, sagt bescheid.

                                            Tolle Arbeit!👍

                                            Für Heizung wäre noch was Super.

                                            da_Woody 1 Reply Last reply Reply Quote 0
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            920
                                            Online

                                            31.6k
                                            Users

                                            79.5k
                                            Topics

                                            1.3m
                                            Posts

                                            vis
                                            7
                                            88
                                            8390
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo