Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • 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

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. [Projekt] MDCSS v2: Material Design CSS Version 2

NEWS

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

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    1.9k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    15
    1
    2.2k

[Projekt] MDCSS v2: Material Design CSS Version 2

Geplant Angeheftet Gesperrt Verschoben Visualisierung
material uivismaterial css
717 Beiträge 74 Kommentatoren 177.7k Aufrufe 77 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • L lesiflo

    @Uhula
    Hi,
    wie verändere ich die Hintergrundfarbe bei einem Dialogfenster? Ich stelle gerade von der Version 1 auf 2 um und benutze das "Dark Design". Die Dialogfenster sind aber immer alle mit hellem Hintergrund.
    Dialog.JPG

    UhulaU Offline
    UhulaU Offline
    Uhula
    schrieb am zuletzt editiert von
    #481

    @lesiflo sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

    Dialogfenster sind aber immer alle mit hellem Hintergrund

    Ich vermute, dass du das dark-Theme zur Designzeit verwendest, aber zur Laufzeit nicht im mdui-config (im abar-View) den Wert von content-color auch auf dunkel gesetzt hast (zB #121212). Denn die Dialoge erben zur Laufzeit den dark-Theme daraus.

    Uhula - Leise und Weise
    Ex: ioBroker on Gigabyte NUC Proxmox

    L 1 Antwort Letzte Antwort
    0
    • A Offline
      A Offline
      ak1
      schrieb am zuletzt editiert von
      #482

      Ich möchte ein Widget mit mdui-state benutzen, und darin in Abhängigkeit eines Datenpunkts zwei alternative Icons anzuzeigen. Allerdings ist der Datenpunkt keine boolsche Variable sondern eine ganze Zahl. Ich möchte ein Icon anzeigen, wenn der Datenpunkt den Wert 0 hat und ein anderes Icon bei einem Wert <>0. Der Datenpunkt beinhaltet die Anzahl der angeschalteten Lampen oder in einem anderen Fall die Anzahl der offenen Fenster.
      Was für ein Widget ist hier geeignet?

      Danke!

      1 Antwort Letzte Antwort
      0
      • UhulaU Uhula

        @lesiflo sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

        Dialogfenster sind aber immer alle mit hellem Hintergrund

        Ich vermute, dass du das dark-Theme zur Designzeit verwendest, aber zur Laufzeit nicht im mdui-config (im abar-View) den Wert von content-color auch auf dunkel gesetzt hast (zB #121212). Denn die Dialoge erben zur Laufzeit den dark-Theme daraus.

        L Offline
        L Offline
        lesiflo
        Most Active
        schrieb am zuletzt editiert von lesiflo
        #483

        OK, aber wie und wo kann ich das anpassen?

        Dominik F.D 1 Antwort Letzte Antwort
        0
        • L lesiflo

          OK, aber wie und wo kann ich das anpassen?

          Dominik F.D Offline
          Dominik F.D Offline
          Dominik F.
          schrieb am zuletzt editiert von
          #484

          @lesiflo

          Entweder im Menü unter Einstellungen, wenn du das aus der Demo übernommen hast, oder in der abar mit eingeben

          L 1 Antwort Letzte Antwort
          0
          • Dominik F.D Dominik F.

            @lesiflo

            Entweder im Menü unter Einstellungen, wenn du das aus der Demo übernommen hast, oder in der abar mit eingeben

            L Offline
            L Offline
            lesiflo
            Most Active
            schrieb am zuletzt editiert von
            #485

            @Dominik-F: Hi, das ist wohl mein Problem. Ich versuche gerade mein altes v1 Projekt auf v2 umzustellen, habe aber keine abar benutzt. Hatte ich aus Platzgründen rausgeschmissen. Gibt es noch einen anderen Weg?

            Dominik F.D 1 Antwort Letzte Antwort
            0
            • L lesiflo

              @Dominik-F: Hi, das ist wohl mein Problem. Ich versuche gerade mein altes v1 Projekt auf v2 umzustellen, habe aber keine abar benutzt. Hatte ich aus Platzgründen rausgeschmissen. Gibt es noch einen anderen Weg?

              Dominik F.D Offline
              Dominik F.D Offline
              Dominik F.
              schrieb am zuletzt editiert von
              #486

              @lesiflo

              Erstelle am Besten eine View und nenn sie abar. Darin kopierst du folgende Widgets:

              [{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"html":"\"primary_color\":\"#000000\",\n\"abar_color\":\"#121212\",\n\"tnav_color\":\"#000000\",\n\"bnav_color\":\"#000000\",\n\"lnav_color\":\"#000000\",\n\"rnav_color\":\"#000000\",\n\"secondary_color\":\"amber\",\n\"content_color\":\"#121212\",\n\"lnav_fixed_width\":\"{demo_lnav_fixed_width}\",\n\"lnav_fixed_open\":\"true\"\n","class":"mdui-label xdui-config","visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide"},"style":{"left":"80px","top":"336px","width":"542px","height":""},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"html":"\"primary_color\":\"{demo_primary_color}\",\n\"abar_color\":\"{demo_abar_color}\",\n\"tnav_color\":\"{demo_tnav_color}\",\n\"bnav_color\":\"{demo_bnav_color}\",\n\"lnav_color\":\"{demo_lnav_color}\",\n\"rnav_color\":\"{demo_lnav_color}\",\n\"secondary_color\":\"{demo_secondary_color}\",\n\"content_color\":\"{demo_content_color}\",\n\"lnav_fixed_width\":\"{demo_lnav_fixed_width}\",\n\"lnav_fixed_open\":\"true\"\n","class":"mdui-label mdui-config"},"style":{"left":"80px","top":"192px","width":"542px","height":""},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"html":"\"primary_color\":\"\",\n\"abar_color\":\"\",\n\"tnav_color\":\"\",\n\"lnav_color\":\"\",\n\"rnav_color\":\"\",\n\"secondary_color\":\"\",\n\"content_color\":\"\",\n\"lnav_fixed_width\":\"{demo_lnav_fixed_width}\",\n\"lnav_fixed_open\":\"true\"\n","class":"mdui-label xdui-config"},"style":{"left":"80px","top":"80px","width":"542px","height":"","opacity":""},"widgetSet":"basic"}]
              

              Wenn das alleine noch nicht reicht(sollte es eigentlich), packst du in der contview in der css-klasse z.B. folgendes:

              {demo_card} {demo_card_title}
              
              L 1 Antwort Letzte Antwort
              0
              • Dominik F.D Dominik F.

                @lesiflo

                Erstelle am Besten eine View und nenn sie abar. Darin kopierst du folgende Widgets:

                [{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"html":"\"primary_color\":\"#000000\",\n\"abar_color\":\"#121212\",\n\"tnav_color\":\"#000000\",\n\"bnav_color\":\"#000000\",\n\"lnav_color\":\"#000000\",\n\"rnav_color\":\"#000000\",\n\"secondary_color\":\"amber\",\n\"content_color\":\"#121212\",\n\"lnav_fixed_width\":\"{demo_lnav_fixed_width}\",\n\"lnav_fixed_open\":\"true\"\n","class":"mdui-label xdui-config","visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide"},"style":{"left":"80px","top":"336px","width":"542px","height":""},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"html":"\"primary_color\":\"{demo_primary_color}\",\n\"abar_color\":\"{demo_abar_color}\",\n\"tnav_color\":\"{demo_tnav_color}\",\n\"bnav_color\":\"{demo_bnav_color}\",\n\"lnav_color\":\"{demo_lnav_color}\",\n\"rnav_color\":\"{demo_lnav_color}\",\n\"secondary_color\":\"{demo_secondary_color}\",\n\"content_color\":\"{demo_content_color}\",\n\"lnav_fixed_width\":\"{demo_lnav_fixed_width}\",\n\"lnav_fixed_open\":\"true\"\n","class":"mdui-label mdui-config"},"style":{"left":"80px","top":"192px","width":"542px","height":""},"widgetSet":"basic"},{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"html":"\"primary_color\":\"\",\n\"abar_color\":\"\",\n\"tnav_color\":\"\",\n\"lnav_color\":\"\",\n\"rnav_color\":\"\",\n\"secondary_color\":\"\",\n\"content_color\":\"\",\n\"lnav_fixed_width\":\"{demo_lnav_fixed_width}\",\n\"lnav_fixed_open\":\"true\"\n","class":"mdui-label xdui-config"},"style":{"left":"80px","top":"80px","width":"542px","height":"","opacity":""},"widgetSet":"basic"}]
                

                Wenn das alleine noch nicht reicht(sollte es eigentlich), packst du in der contview in der css-klasse z.B. folgendes:

                {demo_card} {demo_card_title}
                
                L Offline
                L Offline
                lesiflo
                Most Active
                schrieb am zuletzt editiert von
                #487

                @Dominik-F said in [Projekt] MDCSS v2: Material Design CSS Version 2:

                Hi, danke das hat geklappt. Welchen Wert muss ich jetzt verändern um den Hintergrund noch etwas dunkler zu bekommen?

                Dominik F.D 1 Antwort Letzte Antwort
                0
                • L lesiflo

                  @Dominik-F said in [Projekt] MDCSS v2: Material Design CSS Version 2:

                  Hi, danke das hat geklappt. Welchen Wert muss ich jetzt verändern um den Hintergrund noch etwas dunkler zu bekommen?

                  Dominik F.D Offline
                  Dominik F.D Offline
                  Dominik F.
                  schrieb am zuletzt editiert von
                  #488

                  @lesiflo

                  Versuche mal content color auf #000000

                  L 1 Antwort Letzte Antwort
                  0
                  • Dominik F.D Dominik F.

                    @lesiflo

                    Versuche mal content color auf #000000

                    L Offline
                    L Offline
                    lesiflo
                    Most Active
                    schrieb am zuletzt editiert von
                    #489

                    @Dominik-F: Ist dunkler geworden, allerdings noch nicht so wie unter v1. Geht jetzt aber erstmal so.

                    1 Antwort Letzte Antwort
                    0
                    • F Offline
                      F Offline
                      FrenkyIO
                      schrieb am zuletzt editiert von
                      #490

                      @Uhula
                      Ist es möglich mit mdui-click?action:setValue(stateid,value) auch gleichzeitig eine Popup showMessage(message, title) zu erzeugen?

                      UhulaU 1 Antwort Letzte Antwort
                      0
                      • F FrenkyIO

                        @Uhula
                        Ist es möglich mit mdui-click?action:setValue(stateid,value) auch gleichzeitig eine Popup showMessage(message, title) zu erzeugen?

                        UhulaU Offline
                        UhulaU Offline
                        Uhula
                        schrieb am zuletzt editiert von
                        #491

                        @FrenkyIO sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                        @Uhula
                        Ist es möglich mit mdui-click?action:setValue(stateid,value) auch gleichzeitig eine Popup showMessage(message, title) zu erzeugen?

                        Im Moment (noch) nicht, da man die Actions nicht verketten kann. Ich muss mal sehen, ob man das leicht integrieren könnte.

                        ... grübel ... grübel ...

                        mdui-click?action:setValue(demo_1,Zu+setzender+Wert)|showMessage(Wert+wurde+gesetzt!,Geklickt!)
                        

                        Ja, geht, ab v2.51 (dauert noch etwas bis ich die online stellen kann). Wenn du es vorher haben möchtest, musst du im Script in der function _click() ein paar Zeilen ändern:

                        Aus

                        if (opt.action) 
                             _executeAction(opt.action);
                        

                        wird

                            if (opt.action) 
                                opt.action.split('|').forEach((action,ix,arr)=>{ _executeAction(action); });
                        

                        Uhula - Leise und Weise
                        Ex: ioBroker on Gigabyte NUC Proxmox

                        F 1 Antwort Letzte Antwort
                        0
                        • A Offline
                          A Offline
                          ak1
                          schrieb am zuletzt editiert von
                          #492

                          Wie kann ich eigentlich die Größe eines (in diesem Projekt vorgesehenen) Material Icons ändern?

                          Ich habe für meinen HEOS Player ein "jqui - ctrl Icon State" Widget. CSS Klasse mdui-button.
                          Text ist

                          <i class="material-icons">play_arrow</i>
                          

                          Der Button selbst hat eine Größe von 48x48px. Allerdings ist mir das Icon selbst zu klein. Änderungen unter CSS Font & Text/font-size hatten keinerlei Effekt.

                          Kann mir jemand einen Tipp geben?

                          Danke und Gruß

                          UhulaU 1 Antwort Letzte Antwort
                          0
                          • A ak1

                            Wie kann ich eigentlich die Größe eines (in diesem Projekt vorgesehenen) Material Icons ändern?

                            Ich habe für meinen HEOS Player ein "jqui - ctrl Icon State" Widget. CSS Klasse mdui-button.
                            Text ist

                            <i class="material-icons">play_arrow</i>
                            

                            Der Button selbst hat eine Größe von 48x48px. Allerdings ist mir das Icon selbst zu klein. Änderungen unter CSS Font & Text/font-size hatten keinerlei Effekt.

                            Kann mir jemand einen Tipp geben?

                            Danke und Gruß

                            UhulaU Offline
                            UhulaU Offline
                            Uhula
                            schrieb am zuletzt editiert von
                            #493

                            @ak1 sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                            Kann mir jemand einen Tipp geben?

                            Die Icons werden praktisch als Font behandelt, so dass sich fontsize und color auswirken sollten. Über das Widget geht es nicht, da die material-icons Anweisung das zurücksetzt. Versuch es mal direkt in der <i> Anweisung:

                            <i class="material-icons" style="fontsize:2em;">play_arrow</i>
                            

                            Uhula - Leise und Weise
                            Ex: ioBroker on Gigabyte NUC Proxmox

                            A 1 Antwort Letzte Antwort
                            0
                            • UhulaU Uhula

                              @FrenkyIO sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                              @Uhula
                              Ist es möglich mit mdui-click?action:setValue(stateid,value) auch gleichzeitig eine Popup showMessage(message, title) zu erzeugen?

                              Im Moment (noch) nicht, da man die Actions nicht verketten kann. Ich muss mal sehen, ob man das leicht integrieren könnte.

                              ... grübel ... grübel ...

                              mdui-click?action:setValue(demo_1,Zu+setzender+Wert)|showMessage(Wert+wurde+gesetzt!,Geklickt!)
                              

                              Ja, geht, ab v2.51 (dauert noch etwas bis ich die online stellen kann). Wenn du es vorher haben möchtest, musst du im Script in der function _click() ein paar Zeilen ändern:

                              Aus

                              if (opt.action) 
                                   _executeAction(opt.action);
                              

                              wird

                                  if (opt.action) 
                                      opt.action.split('|').forEach((action,ix,arr)=>{ _executeAction(action); });
                              
                              F Offline
                              F Offline
                              FrenkyIO
                              schrieb am zuletzt editiert von
                              #494

                              @Uhula Klasse! Vielen Dank :)

                              1 Antwort Letzte Antwort
                              0
                              • UhulaU Uhula

                                @ak1 sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                                Kann mir jemand einen Tipp geben?

                                Die Icons werden praktisch als Font behandelt, so dass sich fontsize und color auswirken sollten. Über das Widget geht es nicht, da die material-icons Anweisung das zurücksetzt. Versuch es mal direkt in der <i> Anweisung:

                                <i class="material-icons" style="fontsize:2em;">play_arrow</i>
                                
                                A Offline
                                A Offline
                                ak1
                                schrieb am zuletzt editiert von
                                #495

                                @Uhula sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                                @ak1 sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                                Kann mir jemand einen Tipp geben?

                                Die Icons werden praktisch als Font behandelt, so dass sich fontsize und color auswirken sollten. Über das Widget geht es nicht, da die material-icons Anweisung das zurücksetzt. Versuch es mal direkt in der <i> Anweisung:

                                <i class="material-icons" style="fontsize:2em;">play_arrow</i>
                                

                                Danke! Das war es. Allerdings eine kleine Korrektur: Der Bindestrich gehört in "font-size" hinein.

                                <i class="material-icons" style="font-size:2em;">play_arrow</i>
                                
                                K 1 Antwort Letzte Antwort
                                0
                                • A ak1

                                  @Uhula sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                                  @ak1 sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                                  Kann mir jemand einen Tipp geben?

                                  Die Icons werden praktisch als Font behandelt, so dass sich fontsize und color auswirken sollten. Über das Widget geht es nicht, da die material-icons Anweisung das zurücksetzt. Versuch es mal direkt in der <i> Anweisung:

                                  <i class="material-icons" style="fontsize:2em;">play_arrow</i>
                                  

                                  Danke! Das war es. Allerdings eine kleine Korrektur: Der Bindestrich gehört in "font-size" hinein.

                                  <i class="material-icons" style="font-size:2em;">play_arrow</i>
                                  
                                  K Offline
                                  K Offline
                                  klausiob
                                  schrieb am zuletzt editiert von
                                  #496

                                  @ak1 Hier auch noch einige Tipps fürs Stylen: Material Icons Guide, z.B. Farbe

                                  Pi4B, Pi3B+, Master-Slave, EchoPlus, 3xEchoDot, FireTVstick, Xiaomi Sensoren, Fritzbox, DECT200, HS100, ZBT-ExtendedColor (ALDI), Shelly 2.5, 2xZigBee-Router-Plugs, Sileno 500 smart, Somfy switch, IONIQ5, tibber
                                  node.js: 22.21.0 - npm: 10.9.4 - linux: raspbian-trixie - admin 7.7.19 - vis 1.5.6 - js-controller: 7.0.7

                                  A 1 Antwort Letzte Antwort
                                  0
                                  • K klausiob

                                    @ak1 Hier auch noch einige Tipps fürs Stylen: Material Icons Guide, z.B. Farbe

                                    A Offline
                                    A Offline
                                    ak1
                                    schrieb am zuletzt editiert von
                                    #497

                                    @klausiob sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                                    Material Icons Guide

                                    Besten Dank!

                                    1 Antwort Letzte Antwort
                                    0
                                    • K Offline
                                      K Offline
                                      klausiob
                                      schrieb am zuletzt editiert von
                                      #498

                                      @Uhula ist hier vielleicht offtopic, aber ich stelle gerade alles auf MDCSS v2 um. Vorher alles auf einen Raspi4 geschoben. Habe jetzt ein Problem im V1 und V2, dass jqui-Radiobutton-Valuelist, auch jqui-Select-Valuelist keine Werte in einen selbstdefinierten Datenpunkt schreibt. Auf dem Raspi3 hat das noch funktioniert. Das merkwürdige ist, das wenn ich den Wert in den Datenpunkt schreibe, zeigt das Widget den an. Im Datenpunkt steht immer die gleiche Zahl. Hat jemand auch so ein Effekt mal gehabt?

                                      Pi4B, Pi3B+, Master-Slave, EchoPlus, 3xEchoDot, FireTVstick, Xiaomi Sensoren, Fritzbox, DECT200, HS100, ZBT-ExtendedColor (ALDI), Shelly 2.5, 2xZigBee-Router-Plugs, Sileno 500 smart, Somfy switch, IONIQ5, tibber
                                      node.js: 22.21.0 - npm: 10.9.4 - linux: raspbian-trixie - admin 7.7.19 - vis 1.5.6 - js-controller: 7.0.7

                                      UhulaU 1 Antwort Letzte Antwort
                                      0
                                      • K klausiob

                                        @Uhula ist hier vielleicht offtopic, aber ich stelle gerade alles auf MDCSS v2 um. Vorher alles auf einen Raspi4 geschoben. Habe jetzt ein Problem im V1 und V2, dass jqui-Radiobutton-Valuelist, auch jqui-Select-Valuelist keine Werte in einen selbstdefinierten Datenpunkt schreibt. Auf dem Raspi3 hat das noch funktioniert. Das merkwürdige ist, das wenn ich den Wert in den Datenpunkt schreibe, zeigt das Widget den an. Im Datenpunkt steht immer die gleiche Zahl. Hat jemand auch so ein Effekt mal gehabt?

                                        UhulaU Offline
                                        UhulaU Offline
                                        Uhula
                                        schrieb am zuletzt editiert von
                                        #499

                                        @klausiob sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                                        Hat jemand auch so ein Effekt mal gehabt?

                                        Nein, den Effekt kenne ich nicht. Das kann ich auch mit dem MDCSS nicht erklären, da es ja auf das Setzen der States keinen EInfluss nimmt, sondern nur auf die Darstellung. Hast du die States vielleicht mit "write=false" angelegt? Oder direkt unterhalb eines Adapters und nicht in 0_userdata? Ansonsten habe ich keine weitere Idee.

                                        Uhula - Leise und Weise
                                        Ex: ioBroker on Gigabyte NUC Proxmox

                                        K 1 Antwort Letzte Antwort
                                        0
                                        • UhulaU Uhula

                                          @klausiob sagte in [Projekt] MDCSS v2: Material Design CSS Version 2:

                                          Hat jemand auch so ein Effekt mal gehabt?

                                          Nein, den Effekt kenne ich nicht. Das kann ich auch mit dem MDCSS nicht erklären, da es ja auf das Setzen der States keinen EInfluss nimmt, sondern nur auf die Darstellung. Hast du die States vielleicht mit "write=false" angelegt? Oder direkt unterhalb eines Adapters und nicht in 0_userdata? Ansonsten habe ich keine weitere Idee.

                                          K Offline
                                          K Offline
                                          klausiob
                                          schrieb am zuletzt editiert von klausiob
                                          #500

                                          @Uhula Nee, glaube auch nicht, dass es an MDCSS liegt. Datenpunkt liegt unter javascript.0.Eigene_Datenpunkte usw. ist schreibbar. Gestern abend hat es mal kurz funktioniert, dann mal wieder nicht, heute früh wieder. Vielleicht hatte ich zu viele Browserfenster auf?

                                          Naja, mal beobachten. Habe noch ein anderes Problem:
                                          Dein Skript MduiLogTR064Devices wirft bei mir ständig errors:

                                          2020-05-25 00:00:11.843  - warn: javascript.0 (1017) getState "tr-064.0.devices.HTTP-ServerIPCam.lastIP" not found (3)
                                          2020-05-25 00:00:11.844  - warn: javascript.0 (1017)     at MduiLogTR064.updateHTML (script.js.common.MduiLogTR064Devices:306:20)
                                          2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at MduiLogTR064.onChangeReachable (script.js.common.MduiLogTR064Devices:295:14)
                                          2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Object.subscribe.obj (script.js.common.MduiLogTR064Devices:264:117)
                                          2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Object.callback (/opt/iobroker/node_modules/iobroker.javascript/lib/sandbox.js:1052:38)
                                          2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Object.stateChange (/opt/iobroker/node_modules/iobroker.javascript/main.js:451:25)
                                          2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at Immediate.setImmediate (/opt/iobroker/node_modules/iobroker.js-controller/lib/adapter.js:4851:37)
                                          2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at runCallback (timers.js:705:18)
                                          2020-05-25 00:00:11.845  - warn: javascript.0 (1017)     at tryOnImmediate (timers.js:676:5)
                                          2020-05-25 00:00:11.846  - warn: javascript.0 (1017)     at processImmediate (timers.js:658:5)
                                          2020-05-25 00:00:11.846  - error: javascript.0 (1017) script.js.common.MduiLogTR064Devices: [mduiLogTR064Devices] updateHTML: Cannot read property 'split' of null
                                          

                                          Mehrere Devices, die nicht mehr im Netz hängen.
                                          Irgendwas falsch konfiguriert?
                                          Im Skript habe ich einen roten Marker rechts:
                                          ![MduiLogTR06vDev.js](1eb106ba-0029-471b-8fc4-04820b436a0e-grafik.png Bild Link)

                                          Ist das evt. ein Grund?

                                          Und noch eine Frage. Kann man auch den Gerätenamen (Bezeichnungen) aus der Liste bei der Instanz anzeigen?
                                          VG klausiob

                                          Pi4B, Pi3B+, Master-Slave, EchoPlus, 3xEchoDot, FireTVstick, Xiaomi Sensoren, Fritzbox, DECT200, HS100, ZBT-ExtendedColor (ALDI), Shelly 2.5, 2xZigBee-Router-Plugs, Sileno 500 smart, Somfy switch, IONIQ5, tibber
                                          node.js: 22.21.0 - npm: 10.9.4 - linux: raspbian-trixie - admin 7.7.19 - vis 1.5.6 - js-controller: 7.0.7

                                          UhulaU 1 Antwort Letzte Antwort
                                          0
                                          Antworten
                                          • In einem neuen Thema antworten
                                          Anmelden zum Antworten
                                          • Älteste zuerst
                                          • Neuste zuerst
                                          • Meiste Stimmen


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          185

                                          Online

                                          32.4k

                                          Benutzer

                                          81.4k

                                          Themen

                                          1.3m

                                          Beiträge
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Anmelden

                                          • Du hast noch kein Konto? Registrieren

                                          • Anmelden oder registrieren, um zu suchen
                                          • Erster Beitrag
                                            Letzter Beitrag
                                          0
                                          • Home
                                          • Aktuell
                                          • Tags
                                          • Ungelesen 0
                                          • Kategorien
                                          • Unreplied
                                          • Beliebt
                                          • GitHub
                                          • Docu
                                          • Hilfe