Skip to content
  • 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
  1. ioBroker Community Home
  2. Deutsch
  3. Tester
  4. Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread)

NEWS

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

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

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

Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread)

Geplant Angeheftet Gesperrt Verschoben Tester
appdark-modeiqontrolresponsivevisvisualisierungvisualizationwidget
7.6k Beiträge 296 Kommentatoren 7.0m Aufrufe 201 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.
  • M muuulle

    @Kueppert
    Zunächst brauchst du den Adapter Tankerkönig. Die angelegten Datenpunkte sind die Grundlage für die hier dargestellten Werte.

    In iQontrol werden die einzelnen Datenpunkte als zusätzliche Information A und B eingetragen. Den Status der Kachel selbst ausblenden.

    C Offline
    C Offline
    CrazyFloyd
    schrieb am zuletzt editiert von
    #3723

    @muuulle sagte in Test Adapter iQontrol 1.4.x:

    @Kueppert
    Zunächst brauchst du den Adapter Tankerkönig. Die angelegten Datenpunkte sind die Grundlage für die hier dargestellten Werte.

    In iQontrol werden die einzelnen Datenpunkte als zusätzliche Information A und B eingetragen. Den Status der Kachel selbst ausblenden.

    Bei mir kommt nie die Infozeile in der 2ten Hälfte der Kachel. Alle Infos sind immer nur in der ersten Hälfte sichtbar. Die 2te Hälfte der Kachel bleibt leer. Hast du einen Tipp...

    M 1 Antwort Letzte Antwort
    0
    • C CrazyFloyd

      @muuulle sagte in Test Adapter iQontrol 1.4.x:

      @Kueppert
      Zunächst brauchst du den Adapter Tankerkönig. Die angelegten Datenpunkte sind die Grundlage für die hier dargestellten Werte.

      In iQontrol werden die einzelnen Datenpunkte als zusätzliche Information A und B eingetragen. Den Status der Kachel selbst ausblenden.

      Bei mir kommt nie die Infozeile in der 2ten Hälfte der Kachel. Alle Infos sind immer nur in der ersten Hälfte sichtbar. Die 2te Hälfte der Kachel bleibt leer. Hast du einen Tipp...

      M Offline
      M Offline
      muuulle
      schrieb am zuletzt editiert von
      #3724

      @CrazyFloyd
      Der eigentliche State ist ausgeblendet. Die beiden Zeilen sind INFO_A und B.

      PNG-Bild.png

      s.bormannS 1 Antwort Letzte Antwort
      0
      • E eMd

        Kann man eigentlich auch seine komplette View exportieren um sie anderen zur Verfügung zu stellen?

        Mit Bildern usw.?

        MfG
        eMd

        s.bormannS Offline
        s.bormannS Offline
        s.bormann
        Most Active
        schrieb am zuletzt editiert von
        #3725

        @eMd sagte in Test Adapter iQontrol 1.4.x:

        Kann man eigentlich auch seine komplette View exportieren um sie anderen zur Verfügung zu stellen?

        Mit Bildern usw.?

        MfG
        eMd

        Einzelne Views kann man exportieren - aber leider ohne Bilder (der Import von großen Zip-Dateien hat bei mir zum Absturz von ioBroker geführt - hier muss ich noch nach einer anderen Lösung suchen).

        LG

        1 Antwort Letzte Antwort
        1
        • B blackeagle998

          @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

          @s-bormann
          1f14d1b5-0c28-4e77-afb5-4c617c00a211-image.png

          d5fbb3df-f413-4868-82ee-24e5c5ca1cea-image.png
          Kannst du dir das mal bitte anschauen?
          Die ENLARGE Funktion per Button funktioniert bei mir aktuell nicht mehr...

          @s-bormann
          Der Fehler tritt auf, wenn die zugehörige Kachel ausgeblendet (inaktiv) ist. Ist sie eingeblendet, geht alles.

          EDIT (noch ein Hinweis):
          Der Fehler tritt nur auf, wenn bei Browser Start die zugehörige Kachel bereits ausgeblendet ist,
          Ist Sie eingeblendet, wird irgendwo im Cache was hinterlegt, was auch bei Reload der Seite dazu führt, das alles funktioniert.
          Starte ich aber den Browser neu (Kachel ist ausgeblendet/inaktiv), kommt der Fehler.

          s.bormannS Offline
          s.bormannS Offline
          s.bormann
          Most Active
          schrieb am zuletzt editiert von
          #3726

          @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

          @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

          @s-bormann
          1f14d1b5-0c28-4e77-afb5-4c617c00a211-image.png

          d5fbb3df-f413-4868-82ee-24e5c5ca1cea-image.png
          Kannst du dir das mal bitte anschauen?
          Die ENLARGE Funktion per Button funktioniert bei mir aktuell nicht mehr...

          @s-bormann
          Der Fehler tritt auf, wenn die zugehörige Kachel ausgeblendet (inaktiv) ist. Ist sie eingeblendet, geht alles.

          EDIT (noch ein Hinweis):
          Der Fehler tritt nur auf, wenn bei Browser Start die zugehörige Kachel bereits ausgeblendet ist,
          Ist Sie eingeblendet, wird irgendwo im Cache was hinterlegt, was auch bei Reload der Seite dazu führt, das alles funktioniert.
          Starte ich aber den Browser neu (Kachel ist ausgeblendet/inaktiv), kommt der Fehler.

          Hi,
          danke für die ausführliche Beschreibung. Ich konnte den Fehler nachstellen, er wird in der nächsten Version gefixed (kommt nachher).
          Danke und VG!

          1 Antwort Letzte Antwort
          0
          • F FuXXz2

            @eMd
            ahh super, Danke.

            Dadurch kommt direkt noch eine Frage 🙂

            Ich sehe nun eine Einstellung für Value-List, Option to enter free Text usw.
            Da passiert nur leider nichts. Ich bekomme beim Dimmer kein Feld für "Freitext"
            Auch eine definierte Value-List erscheint nicht.

            Ich wollte gerne im Dimmer Popup definierte Werte (30/60/100) als Button einblenden. Oder bin ich hier auf dem Holzweg und kann ich das damit nicht machen?

            s.bormannS Offline
            s.bormannS Offline
            s.bormann
            Most Active
            schrieb am zuletzt editiert von
            #3727

            @FuXXz2 sagte in Test Adapter iQontrol 1.4.x:

            @eMd
            ahh super, Danke.

            Dadurch kommt direkt noch eine Frage 🙂

            Ich sehe nun eine Einstellung für Value-List, Option to enter free Text usw.
            Da passiert nur leider nichts. Ich bekomme beim Dimmer kein Feld für "Freitext"
            Auch eine definierte Value-List erscheint nicht.

            Ich wollte gerne im Dimmer Popup definierte Werte (30/60/100) als Button einblenden. Oder bin ich hier auf dem Holzweg und kann ich das damit nicht machen?

            Hallo,
            die Freitexteingabe gilt nur für Auswahllisten, für Slider, Buttons u.s.w. ist sie nicht vorgesehen. Aber Du könntest über ADDITIONAL_CONTROLS Deine Favoriten-Werte als Buttons anlegen. Schreibe mir auch mal auf, dass Favoriten für Slider ein nettes Feature für die Zukunft wären.
            LG!

            1 Antwort Letzte Antwort
            0
            • F FuXXz2

              Weiß jemand, ob ich in einem Dimmer Popup Buttons für feste Dimmwerte rein bekommen kann?

              s.bormannS Offline
              s.bormannS Offline
              s.bormann
              Most Active
              schrieb am zuletzt editiert von
              #3728

              @FuXXz2 Witzig, die gleiche Anfrage kam jetzt kurz hintereinander zwei mal. Aktuell geht es nur über die ADDITIONAL_CONTROLS, hier kannst Du Favoriten als Buttons anlegen.
              VG

              F 1 Antwort Letzte Antwort
              0
              • M muuulle

                @CrazyFloyd
                Der eigentliche State ist ausgeblendet. Die beiden Zeilen sind INFO_A und B.

                PNG-Bild.png

                s.bormannS Offline
                s.bormannS Offline
                s.bormann
                Most Active
                schrieb am zuletzt editiert von
                #3729

                @muuulle sagte in Test Adapter iQontrol 1.4.x:

                @CrazyFloyd
                Der eigentliche State ist ausgeblendet. Die beiden Zeilen sind INFO_A und B.

                PNG-Bild.png

                Das habe ich irgendwann mal angepasst, hast Du vielleicht eine ältere Version oder Stable? Ggf. mal die aktuelle Version von Github installieren, möglicherweise liegt es ja daran. VG

                1 Antwort Letzte Antwort
                0
                • E eMd

                  @dslraser

                  Ich habe Fernzugriff erstanden. Musste selber erstmal schauen 😃

                  MfG
                  eMd

                  s.bormannS Offline
                  s.bormannS Offline
                  s.bormann
                  Most Active
                  schrieb am zuletzt editiert von
                  #3730

                  @eMd sagte in Test Adapter iQontrol 1.4.x:

                  @dslraser

                  Ich habe Fernzugriff erstanden. Musste selber erstmal schauen 😃

                  MfG
                  eMd

                  Könnt Ihr den devices-Adapter und den Scenes-Adapter über iobroker.pro nutzen?
                  Habe es jetzt gerade noch mal getestet - alles läuft, bis auf diese beiden Adapter.

                  dslraserD E 2 Antworten Letzte Antwort
                  0
                  • s.bormannS s.bormann

                    @eMd sagte in Test Adapter iQontrol 1.4.x:

                    @dslraser

                    Ich habe Fernzugriff erstanden. Musste selber erstmal schauen 😃

                    MfG
                    eMd

                    Könnt Ihr den devices-Adapter und den Scenes-Adapter über iobroker.pro nutzen?
                    Habe es jetzt gerade noch mal getestet - alles läuft, bis auf diese beiden Adapter.

                    dslraserD Offline
                    dslraserD Offline
                    dslraser
                    Forum Testing Most Active
                    schrieb am zuletzt editiert von dslraser
                    #3731

                    @s-bormann sagte in Test Adapter iQontrol 1.4.x:

                    Könnt Ihr den devices-Adapter und den Scenes-Adapter über iobroker.pro nutzen?
                    Habe es jetzt gerade noch mal getestet - alles läuft, bis auf diese beiden Adapter.

                    Die nutze ich beide nicht 🤷‍♂️, kann ich Dir also nicht sagen.

                    1 Antwort Letzte Antwort
                    0
                    • s.bormannS s.bormann

                      @FuXXz2 Witzig, die gleiche Anfrage kam jetzt kurz hintereinander zwei mal. Aktuell geht es nur über die ADDITIONAL_CONTROLS, hier kannst Du Favoriten als Buttons anlegen.
                      VG

                      F Offline
                      F Offline
                      FuXXz2
                      schrieb am zuletzt editiert von
                      #3732

                      @s-bormann
                      Ok danke! Das klappt erstmal super.
                      Direkten Einfluss auf die Anordnung hat man nicht oder? Außer CSS meine ich jetzt?
                      Dort fehlen mir nämlich im DIV ID DialogAdditionalControlsContent weitere klassen.
                      Schön wäre, wenn die Additional_Controls nebeneinander wären, zumindest die Dimmwerte.
                      Screenshot 2020-11-07 141103.jpg

                      s.bormannS 1 Antwort Letzte Antwort
                      0
                      • s.bormannS s.bormann

                        @eMd sagte in Test Adapter iQontrol 1.4.x:

                        @dslraser

                        Ich habe Fernzugriff erstanden. Musste selber erstmal schauen 😃

                        MfG
                        eMd

                        Könnt Ihr den devices-Adapter und den Scenes-Adapter über iobroker.pro nutzen?
                        Habe es jetzt gerade noch mal getestet - alles läuft, bis auf diese beiden Adapter.

                        E Offline
                        E Offline
                        eMd
                        schrieb am zuletzt editiert von
                        #3733

                        @s-bormann

                        Geht bei mir auch nicht über .pro

                        Master: Intel NUC 16GB/500GB
                        Slave: Raspberry Pi 3 + Homematicmodul
                        Shelly, Google Home, Zigbee Aqara, Sonoff

                        Meine VIS: https://youtu.be/JMYr2KYlpME

                        s.bormannS 1 Antwort Letzte Antwort
                        0
                        • F FuXXz2

                          @s-bormann
                          Ok danke! Das klappt erstmal super.
                          Direkten Einfluss auf die Anordnung hat man nicht oder? Außer CSS meine ich jetzt?
                          Dort fehlen mir nämlich im DIV ID DialogAdditionalControlsContent weitere klassen.
                          Schön wäre, wenn die Additional_Controls nebeneinander wären, zumindest die Dimmwerte.
                          Screenshot 2020-11-07 141103.jpg

                          s.bormannS Offline
                          s.bormannS Offline
                          s.bormann
                          Most Active
                          schrieb am zuletzt editiert von
                          #3734

                          @FuXXz2 sagte in Test Adapter iQontrol 1.4.x:

                          @s-bormann
                          Ok danke! Das klappt erstmal super.
                          Direkten Einfluss auf die Anordnung hat man nicht oder? Außer CSS meine ich jetzt?
                          Dort fehlen mir nämlich im DIV ID DialogAdditionalControlsContent weitere klassen.
                          Schön wäre, wenn die Additional_Controls nebeneinander wären, zumindest die Dimmwerte.
                          Screenshot 2020-11-07 141103.jpg

                          Hi,
                          das wurde schon gefragt und steht auch auf meiner Liste, habe ich bislang aber noch nicht geschafft. Ein paar zusätzliche Klassen einfügen wäre aber ja vermutlich schnell erledigt, was bräuchtest Du denn genau?
                          LG

                          1 Antwort Letzte Antwort
                          0
                          • E eMd

                            @s-bormann

                            Geht bei mir auch nicht über .pro

                            s.bormannS Offline
                            s.bormannS Offline
                            s.bormann
                            Most Active
                            schrieb am zuletzt editiert von
                            #3735

                            @eMd Danke für die Rückmeldung, dann weiß ich bescheid! LG

                            1 Antwort Letzte Antwort
                            0
                            • s.bormannS Offline
                              s.bormannS Offline
                              s.bormann
                              Most Active
                              schrieb am zuletzt editiert von s.bormann
                              #3736

                              Hallo,

                              es gibt eine neue Github-Version zum testen. Es wäre toll, wenn das einige mal testen und Rückmeldung geben könnten, ob noch alles passt, denn ich musste viele CSS-Eigenschaften anpassen. Das ganze hat erst ganz locker angefangen - aber egal, wo ich was gedreht habe, ging irgendwo eine neue Baustelle auf... Nach viel Frust und vielen Änderungen passt es jetzt bei mir zumindest wieder alles, aber das heißt ja noch nichts 🙂

                              Das ganze war notwendig, weil ich ein Panel eingebaut habe, so dass man sich eine zweite Ansicht links neben die Hauptansicht schieben kann. Quasi eine Art Split-Screen wie auf dem iPad:
                              9ac48f14-c627-4f43-a7eb-0f4a5a1f65f8-image.png

                              Man kann das Panel bzw. den Split-Screen umfassend konfigurieren (z.B. ob er ab einer gewissen Bildschirmgröße automatisch eingeblendet werden soll, wie er geöffnet, wie geschlossen wird etc.).

                              Befüllen kann man das Panel mit HTML, also auch Widgets - oder einer eigenen View (auch bei den Gerätekacheln kann man jetzt Views als Hintergrund einfügen - wie auf dem Bild schon zu sehen).

                              Solche Background-Views sind ganz normal angelegte Ansichten in iQontrol. Es gibt aber ein paar Besonderheiten: Neben geringfügig anderem Styling, ist z.B. Swiping, die Toolbar und Panels deaktiviert. Außerdem, und das ist glaube ich wichtig, kann man bei den einzelnen Gerätekacheln jetzt die Option aktivieren Die verknüpfte Ansicht in der Haupt-Instanz öffnen, wenn diese Ansicht als BACKGROUND_VIEW verwendet wird. Das bedeutet, dass die Links zu anderen Ansichten, nicht im Split-Screen, sondern auf der Haupt-Ansicht geöffnet werden. Man kann sich somit also eine schöne Navigation in die Seitenleiste bauen:
                              b1124213-a8c2-47fe-b4c0-1b17d0fab81d-image.png

                              Ein paar Kleinigkeiten gibts noch, z.B. die optionale Anzeige von Swipe-Goals ganz oben in der Ecke:
                              26b5f194-e681-4f2f-b63a-5b31ba064966-image.png

                              Und ein paar Verbesserungen bei den Widgets. So wird jetzt beim Hinzufügen von Widgets ein Konfigurationsdialog gezeigt:
                              3fab3f6f-aeff-450b-95dc-b809c630a218-image.png

                              Lieb gewonnen habe ich die FLOT-Charts als Hintergrund in den Kacheln:
                              9e9a3c5f-90db-4b9b-b92e-17bc8d58657b-image.png

                              So dann, ich hoffe, alles läuft!!
                              Viel Spaß damit!

                              LG

                              V S B B M 5 Antworten Letzte Antwort
                              6
                              • dslraserD dslraser

                                @blackeagle998

                                hier noch mal das aktuelle Script für diese Ansicht

                                
                                const DP_Uhr_digital 				= '0_userdata.0.Uhr.Digital_Uhr_HTML_Uhrzeit_und_Datum_V7_neu';
                                const DP_Wetter_Vorschau 			= '0_userdata.0.Uhr.Wetter_Vorschau';
                                const DP_Wetter_Vorschau_Trigger	= '0_userdata.0.Uhr.Wetter_Vorschau_Trigger';
                                
                                fctInit();
                                
                                on({id:DP_Wetter_Vorschau_Trigger, val:true} , function (dp) {
                                  if (getState(DP_Wetter_Vorschau).val){
                                      setState(DP_Wetter_Vorschau, false);
                                  }else{
                                      setState(DP_Wetter_Vorschau, true);
                                  }
                                });
                                
                                function fctInit(){
                                if(!existsState(DP_Uhr_digital)) {
                                    createState(DP_Uhr_digital,
                                        {type: 'string', name: 'iQontrol Uhr', role: 'value', read: true , write: true}
                                    );
                                }
                                if(!existsState(DP_Wetter_Vorschau_Trigger)) {
                                    createState(DP_Wetter_Vorschau_Trigger,
                                        {type: 'boolean', name: 'Wetter Vorschau Trigger', role: 'button', read: false , write: true}
                                    );
                                }
                                if(!existsState(DP_Wetter_Vorschau)) {
                                    createState(DP_Wetter_Vorschau,
                                        {type: 'boolean', name: 'Wetter Vorschau', role: 'switch', read: true , write: true, def: false}
                                    );
                                }
                                setStateDelayed(DP_Uhr_digital, fctUhrzeitDatumWetter_V7(), 1000);
                                schedule("*/10 * * * * *", function () {
                                    setState(DP_Uhr_digital, fctUhrzeitDatumWetter_V7());
                                })
                                }
                                
                                function fctUhrzeitDatumWetter_V7() {
                                let str_Uhrzeit         = String(formatDate(new Date(), "hh:mm"));
                                let str_Datum           = String(formatDate(new Date(), "DD.MM.YYYY"));
                                let str_Wochentag       = String(formatDate(new Date(), "WW", "de"));
                                
                                let str_color_body      = 'rgba(66, 66, 66, 1)';
                                let str_color_cell      = 'rgba(71, 87, 92, 0)';
                                let str_color_font      = 'rgba(255, 255, 255, 1)';
                                
                                
                                let str_position_font   = 'left'
                                let str_Tageszeit       = 'Tag';
                                let str_html            = '';
                                let str_html_head       = '';
                                let image_Wetter_Pfad   = './../iqontrol.meta/userimages/usericons/wetter/';
                                
                                // ##########################################################################
                                // CSS Style (Formatierung der HTML Elemente)
                                // ##########################################################################
                                str_html_head = str_html_head + '<head><meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">';
                                str_html_head = str_html_head + '<style>';
                                str_html_head = str_html_head + 'body {';
                                str_html_head = str_html_head + 'overflow:hidden;'; //Scrollbalken ausgeblendet
                                str_html_head = str_html_head + 'background-color:' + str_color_body + ';';
                                str_html_head = str_html_head + '}'; 
                                
                                
                                
                                str_html_head = str_html_head + 'span {';
                                //Rahmen: abgerundete Ecken (5px), Strichstärke (0px = aus) und Farbe
                                //str_html_head = str_html_head + 'border-radius:5px;border-collapse:separate;border:1px solid gainsboro;border-color:White;';
                                //Textausrichtung
                                str_html_head = str_html_head + 'text-align:' + str_position_font + ';';
                                //Schriftfarbe
                                str_html_head = str_html_head + 'color:' + str_color_font + ';';
                                //Wer keine Hintergrundfarbe für die Boxen will, kommentiert die nachfolgende Zeile aus oder löscht sie.
                                //str_html_head = str_html_head + 'background-color:' + str_color_cell + ';';
                                str_html_head = str_html_head + '}';
                                
                                str_html_head = str_html_head + 'td {';
                                str_html_head = str_html_head + 'border-width:1px;';
                                str_html_head = str_html_head + 'border-style:solid;';
                                str_html_head = str_html_head + 'border-color:silver;';
                                str_html_head = str_html_head + '}';
                                
                                str_html_head = str_html_head + '.container_column {';
                                str_html_head = str_html_head + 'display:flex;';
                                //Elemente werden untereinander dargestellt
                                str_html_head = str_html_head + 'flex-direction: column;';
                                str_html_head = str_html_head + 'justify-content: flex-start;';
                                //Rahmen: abgerundete Ecken (5px), Strichstärke (0px = aus) und Farbe
                                //str_html_head = str_html_head + 'border-radius:5px;border-collapse:separate;border:2px solid gainsboro;border-color:yellow;';
                                str_html_head = str_html_head + '}';
                                
                                str_html_head = str_html_head + '.container_row {';
                                str_html_head = str_html_head + 'display: flex;';
                                //Elemente werden untereinander dargestellt
                                str_html_head = str_html_head + 'flex-direction: row;';
                                str_html_head = str_html_head + 'justify-content: space-between;';
                                //Rahmen: abgerundete Ecken (5px), Strichstärke (0px = aus) und Farbe
                                //str_html_head = str_html_head + 'border-radius:5px;border-collapse:separate;border:2px solid gainsboro;border-color:yellow;';
                                str_html_head = str_html_head + '}';
                                
                                str_html_head = str_html_head + 'input {';
                                str_html_head = str_html_head + 'height:10vw;';
                                str_html_head = str_html_head + 'width:10vw;';
                                str_html_head = str_html_head + '}';
                                
                                str_html_head = str_html_head + '.img_wetter {';
                                str_html_head = str_html_head + 'height:15vw;';
                                str_html_head = str_html_head + 'width:15vw;';
                                str_html_head = str_html_head + '}';
                                
                                //Hier habt ihr die Möglichkeit, CSS Eigenschaften für jede Box einzeln einzutragen.
                                //Bspw. könnt ihr hier eine separate Hintergrundfarbe einstellen.
                                //Außerdem steuert ihr hier die Schriftgrößen der einzelnen Boxen
                                str_html_head = str_html_head + '.box_uhr {font-size:14vmax;}';
                                str_html_head = str_html_head + '.box_datum {font-size:4vmax;text-align:center;}';
                                str_html_head = str_html_head + '.box_wetter {font-size:4vmax;margin-right:1.5vw;text-align:center;}';
                                
                                str_html_head = str_html_head + '.table_Wettervorschau {';
                                str_html_head = str_html_head + 'margin-top:4vw;';
                                str_html_head = str_html_head + 'border-collapse: collapse;';
                                str_html_head = str_html_head + 'font-size:3vmax;';
                                str_html_head = str_html_head + 'color:' + str_color_font + ';';
                                str_html_head = str_html_head + '}';
                                str_html_head = str_html_head + '</style>';
                                str_html_head = str_html_head + '<script type="text/javascript">';
                                str_html_head = str_html_head + 'function setState(stateId, value){';
                                str_html_head = str_html_head + 'sendPostMessage("setState", stateId, value);';
                                str_html_head = str_html_head + '}';
                                str_html_head = str_html_head + 'function sendPostMessage(command, stateId, value){';
                                str_html_head = str_html_head + 'message = { command: command, stateId: stateId, value: value};';
                                str_html_head = str_html_head + 'window.parent.postMessage(message, "*");';
                                str_html_head = str_html_head + '}';
                                str_html_head = str_html_head + '</script>';
                                str_html_head = str_html_head + '</head>';
                                
                                // ##########################################################################
                                // Prüfen ob Tag oder Nacht um Sonne oder Mond Icons anzuzeigen
                                // ##########################################################################
                                //Wenn ihr den nachfolgenden Datenpunkt 'javascript.0.Astro.Tageszeit.current' auch habt, könnt ihr das einkommentieren --> /* und */ löschen
                                //--> dafür gibt es ein ASTRO Skript hier im Forum
                                /*
                                switch (getState('javascript.0.Astro.Tageszeit.current').val){
                                    case "Sonnenuntergang":
                                    case "Abenddämmerung":
                                    case "Nacht":
                                    case "Morgendämmerung":
                                        str_Tageszeit = 'Nacht';
                                        break;
                                    default:
                                        break;
                                }
                                */
                                
                                // ##########################################################################
                                // Ab hier werden die verschiedenen HTML Flex Container zusammengebaut
                                // ##########################################################################
                                //Box 1 = Uhrzeit und Wettersymbol
                                str_html = str_html + str_html_head + '<div class="container_row">';
                                str_html = str_html + '<span class="box_uhr"><b>' + str_Uhrzeit + ' Uhr</b></span>';
                                if (str_Tageszeit == 'Tag'){
                                      str_html = str_html + '<input type="image" class="img_wetter" onclick="setState(\'' + DP_Wetter_Vorschau_Trigger + '\', true)" src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_1.current.symbol_value').val + '.png' + '" />';
                                }else{
                                      str_html = str_html + '<input type="image" class="img_wetter" onclick="setState(\'' + DP_Wetter_Vorschau_Trigger + '\', true)" src="' + image_Wetter_Pfad + 'mond/' + getState('daswetter.0.NextHours.Location_1.Day_1.moon_symbol').val + '.png' + '" />';
                                }
                                str_html = str_html + '</div>';
                                
                                //Box 2 = Wochentag/Datum, Abfallentsorgung und aktuelle Wetterdaten
                                str_html = str_html + '<div class="container_row">';
                                str_html = str_html + '<div class="container_column">';
                                str_html = str_html + '<span class="box_datum"><b><i>' + str_Wochentag + ', ' + str_Datum + '</i></b></span>';
                                str_html = str_html + '</div>';
                                str_html = str_html + '<div class="container_column">';
                                str_html = str_html + '<span class="box_wetter"><b><i>' + Math.round(getState('hm-rpc.0.0010D8A98AD4AC.1.ACTUAL_TEMPERATURE'/*Temperatursensor aussen ACTUAL TEMPERATURE*/).val) + '°C</i></b></span>';
                                if (str_Tageszeit == 'Tag'){
                                    str_html = str_html + '<span class="box_wetter"><i>' + getState('daswetter.0.NextHours.Location_1.Day_1.current.symbol_desc').val + '</i></span>';
                                }else{
                                    str_html = str_html + '<span class="box_wetter"><i>' + str_Tageszeit + '</i></span>';
                                }
                                
                                str_html = str_html + '</div>';
                                str_html = str_html + '</div>';
                                
                                //Box 3 = Wettervorschau
                                str_html = str_html + '<div class="container_column">';
                                str_html = str_html + '<table class="table_Wettervorschau">';
                                
                                str_html = str_html + '<tr>';
                                str_html = str_html + '<td>heute</td>';
                                str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_1.symbol_value').val + '.png' + '"/></td>';
                                str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_1.tempmin_value').val + '°C bis ';
                                str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_1.tempmax_value').val + '°C</td>';
                                //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_1.humidity_value').val + '%</td>';
                                str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_1.symbol_desc').val + '</td>';
                                str_html = str_html + '</tr>';
                                
                                str_html = str_html + '<tr>';
                                str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_2.day_name').val + '</td>';
                                str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_2.symbol_value').val + '.png' + '"/></td>';
                                str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_2.tempmin_value').val + '°C bis ';
                                str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_2.tempmax_value').val + '°C</td>';
                                //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_2.humidity_value').val + '%</td>';
                                str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_2.symbol_desc').val + '</td>';
                                str_html = str_html + '</tr>';
                                
                                str_html = str_html + '<tr>';
                                str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_3.day_name').val + '</td>';
                                str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_3.symbol_value').val + '.png' + '"/></td>';
                                str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_3.tempmin_value').val + '°C bis ';
                                str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_3.tempmax_value').val + '°C</td>';
                                //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_3.humidity_value').val + '%</td>';
                                str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_3.symbol_desc').val + '</td>';
                                str_html = str_html + '</tr>';
                                
                                str_html = str_html + '<tr>';
                                str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_4.day_name').val + '</td>';
                                str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_4.symbol_value').val + '.png' + '"/></td>';
                                str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_4.tempmin_value').val + '°C bis ';
                                str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_4.tempmax_value').val + '°C</td>';
                                //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_4.humidity_value').val + '%</td>';
                                str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_4.symbol_desc').val + '</td>';
                                str_html = str_html + '</tr>';
                                
                                str_html = str_html + '<tr>';
                                str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_5.day_name').val + '</td>';
                                str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_5.symbol_value').val + '.png' + '"/></td>';
                                str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_5.tempmin_value').val + '°C bis ';
                                str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_5.tempmax_value').val + '°C</td>';
                                //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_5.humidity_value').val + '%</td>';
                                str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_5.symbol_desc').val + '</td>';
                                str_html = str_html + '</tr>';
                                
                                str_html = str_html + '</table>';
                                str_html = str_html + '</div>';
                                
                                return str_html;
                                }
                                
                                
                                

                                EDIT: so ist es nun fertig.

                                Screenshot_20201103-153131_Chrome.jpg

                                Hier habe ich das angepasst, nun ist es perfekt.

                                Bildschirmfoto 2020-11-03 um 15.24.37.png

                                Bildschirmfoto 2020-11-03 um 15.24.46.png

                                C Offline
                                C Offline
                                CrazyFloyd
                                schrieb am zuletzt editiert von CrazyFloyd
                                #3737

                                @dslraser sagte in Test Adapter iQontrol 1.4.x:

                                @blackeagle998

                                hier noch mal das aktuelle Script für diese Ansicht

                                Erstmal herzlichen Dank für dein Script. Ich brauche eine kurze Hilfe bezüglich der Moon Icons. In welchem Pfad müssen diese genau liegen. Da ich leider trotz durchforsten des Scripts keine Pfadangabe finden konnte. Oder müssen die PNG Bilder eine besondere Namensgebung bekommen? Danke.

                                dslraserD B 2 Antworten Letzte Antwort
                                0
                                • s.bormannS s.bormann

                                  Hallo,

                                  es gibt eine neue Github-Version zum testen. Es wäre toll, wenn das einige mal testen und Rückmeldung geben könnten, ob noch alles passt, denn ich musste viele CSS-Eigenschaften anpassen. Das ganze hat erst ganz locker angefangen - aber egal, wo ich was gedreht habe, ging irgendwo eine neue Baustelle auf... Nach viel Frust und vielen Änderungen passt es jetzt bei mir zumindest wieder alles, aber das heißt ja noch nichts 🙂

                                  Das ganze war notwendig, weil ich ein Panel eingebaut habe, so dass man sich eine zweite Ansicht links neben die Hauptansicht schieben kann. Quasi eine Art Split-Screen wie auf dem iPad:
                                  9ac48f14-c627-4f43-a7eb-0f4a5a1f65f8-image.png

                                  Man kann das Panel bzw. den Split-Screen umfassend konfigurieren (z.B. ob er ab einer gewissen Bildschirmgröße automatisch eingeblendet werden soll, wie er geöffnet, wie geschlossen wird etc.).

                                  Befüllen kann man das Panel mit HTML, also auch Widgets - oder einer eigenen View (auch bei den Gerätekacheln kann man jetzt Views als Hintergrund einfügen - wie auf dem Bild schon zu sehen).

                                  Solche Background-Views sind ganz normal angelegte Ansichten in iQontrol. Es gibt aber ein paar Besonderheiten: Neben geringfügig anderem Styling, ist z.B. Swiping, die Toolbar und Panels deaktiviert. Außerdem, und das ist glaube ich wichtig, kann man bei den einzelnen Gerätekacheln jetzt die Option aktivieren Die verknüpfte Ansicht in der Haupt-Instanz öffnen, wenn diese Ansicht als BACKGROUND_VIEW verwendet wird. Das bedeutet, dass die Links zu anderen Ansichten, nicht im Split-Screen, sondern auf der Haupt-Ansicht geöffnet werden. Man kann sich somit also eine schöne Navigation in die Seitenleiste bauen:
                                  b1124213-a8c2-47fe-b4c0-1b17d0fab81d-image.png

                                  Ein paar Kleinigkeiten gibts noch, z.B. die optionale Anzeige von Swipe-Goals ganz oben in der Ecke:
                                  26b5f194-e681-4f2f-b63a-5b31ba064966-image.png

                                  Und ein paar Verbesserungen bei den Widgets. So wird jetzt beim Hinzufügen von Widgets ein Konfigurationsdialog gezeigt:
                                  3fab3f6f-aeff-450b-95dc-b809c630a218-image.png

                                  Lieb gewonnen habe ich die FLOT-Charts als Hintergrund in den Kacheln:
                                  9e9a3c5f-90db-4b9b-b92e-17bc8d58657b-image.png

                                  So dann, ich hoffe, alles läuft!!
                                  Viel Spaß damit!

                                  LG

                                  V Offline
                                  V Offline
                                  vepman
                                  schrieb am zuletzt editiert von vepman
                                  #3738

                                  @s-bormann
                                  Also vorweg, das Panel funktioniert super.
                                  Wie kann ich z.B. die Hauptansicht mit dem Panel steuern?
                                  Wenn ich "Verknüpfung zu anderer Ansicht" wähle, wechselt die Ansicht im Panel und nicht in der Hauptansicht.
                                  Wo liegt mein Gedankenfehler?

                                  s.bormannS 1 Antwort Letzte Antwort
                                  0
                                  • C CrazyFloyd

                                    @dslraser sagte in Test Adapter iQontrol 1.4.x:

                                    @blackeagle998

                                    hier noch mal das aktuelle Script für diese Ansicht

                                    Erstmal herzlichen Dank für dein Script. Ich brauche eine kurze Hilfe bezüglich der Moon Icons. In welchem Pfad müssen diese genau liegen. Da ich leider trotz durchforsten des Scripts keine Pfadangabe finden konnte. Oder müssen die PNG Bilder eine besondere Namensgebung bekommen? Danke.

                                    dslraserD Offline
                                    dslraserD Offline
                                    dslraser
                                    Forum Testing Most Active
                                    schrieb am zuletzt editiert von
                                    #3739

                                    @CrazyFloyd sagte in Test Adapter iQontrol 1.4.x:

                                    @dslraser sagte in Test Adapter iQontrol 1.4.x:

                                    @blackeagle998

                                    hier noch mal das aktuelle Script für diese Ansicht

                                    Erstmal herzlichen Dank für dein Script. Ich brauche eine kurze Hilfe bezüglich der Moon Icons. In welchem Pfad müssen diese genau liegen. Da ich leider trotz durchforsten des Scripts keine Pfadangabe finden konnte. Oder müssen die PNG Bilder eine besondere Namensgebung bekommen? Danke.

                                    Kann ich Dir gar nicht sagen, da ich keine Moon Icons nutze. Dazu kann @blackeagle998 Dir bestimmt helfen.

                                    1 Antwort Letzte Antwort
                                    1
                                    • C CrazyFloyd

                                      @dslraser sagte in Test Adapter iQontrol 1.4.x:

                                      @blackeagle998

                                      hier noch mal das aktuelle Script für diese Ansicht

                                      Erstmal herzlichen Dank für dein Script. Ich brauche eine kurze Hilfe bezüglich der Moon Icons. In welchem Pfad müssen diese genau liegen. Da ich leider trotz durchforsten des Scripts keine Pfadangabe finden konnte. Oder müssen die PNG Bilder eine besondere Namensgebung bekommen? Danke.

                                      B Offline
                                      B Offline
                                      blackeagle998
                                      schrieb am zuletzt editiert von blackeagle998
                                      #3740

                                      @CrazyFloyd
                                      Die mond Icons müssen in folgendem Ordner liegen:

                                      ./../iqontrol.meta/userimages/usericons/wetter/mond/
                                      

                                      Darin befinden sich die einzelnen x.png Dateien durchnummeriert von 0.png bis 28.png glaube ich.

                                      Du kannst natürlich auch einen anderen Ordner verwenden, dann muss der Pfad im Skript aber angepasst werden.

                                      C dslraserD 3 Antworten Letzte Antwort
                                      0
                                      • V vepman

                                        @s-bormann
                                        Also vorweg, das Panel funktioniert super.
                                        Wie kann ich z.B. die Hauptansicht mit dem Panel steuern?
                                        Wenn ich "Verknüpfung zu anderer Ansicht" wähle, wechselt die Ansicht im Panel und nicht in der Hauptansicht.
                                        Wo liegt mein Gedankenfehler?

                                        s.bormannS Offline
                                        s.bormannS Offline
                                        s.bormann
                                        Most Active
                                        schrieb am zuletzt editiert von
                                        #3741

                                        @vepman sagte in Test Adapter iQontrol 1.4.x:

                                        @s-bormann
                                        Also vorweg, das Panel funktioniert super.
                                        Wie kann ich z.B. die Hauptansicht mit dem Panel steuern?
                                        Wenn ich "Verknüpfung zu anderer Ansicht" wähle, wechselt die Ansicht im Panel und nicht in der Hauptansicht.
                                        Wo liegt mein Gedankenfehler?

                                        Du musst diese Option in der Kachel mit der Verknüpfung zur anderen Ansicht aktivieren:
                                        d5daab42-4fb4-4e47-8214-e2d429ec3cc9-image.png

                                        LG

                                        V 1 Antwort Letzte Antwort
                                        0
                                        • B blackeagle998

                                          @CrazyFloyd
                                          Die mond Icons müssen in folgendem Ordner liegen:

                                          ./../iqontrol.meta/userimages/usericons/wetter/mond/
                                          

                                          Darin befinden sich die einzelnen x.png Dateien durchnummeriert von 0.png bis 28.png glaube ich.

                                          Du kannst natürlich auch einen anderen Ordner verwenden, dann muss der Pfad im Skript aber angepasst werden.

                                          C Offline
                                          C Offline
                                          CrazyFloyd
                                          schrieb am zuletzt editiert von
                                          #3742

                                          @blackeagle998
                                          Prima. Danke. Werde es heute Abend sehen.

                                          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

                                          332

                                          Online

                                          32.4k

                                          Benutzer

                                          81.4k

                                          Themen

                                          1.3m

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

                                          • Du hast noch kein Konto? Registrieren

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