Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Grösste Probleme mit Auflösung, Widget-Breiten usw.

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    Grösste Probleme mit Auflösung, Widget-Breiten usw.

    This topic has been deleted. Only users with topic management privileges can see it.
    • D
      Delphinis @Homoran last edited by Delphinis

      @homoran
      Vis 1.5.4
      jqui weiss ich nicht wo nachschauen.
      Firefox ist doch nach W3C? Aber das Verhalten ist ja im Edit: IE (Edge) genau gleich.

      Homoran 1 Reply Last reply Reply Quote 0
      • OliverIO
        OliverIO @Delphinis last edited by

        @delphinis sagte in Grösste Probleme mit Auflösung, Widget-Breiten usw.:

        und wenn ich mal was ändere ist das Verhalten wieder anders:

        das sollte natürlich nicht so sein. Leider sind die layout-regeln von css nicht immer ganz zu durchschauen. ich bekomme da auch viel nur durch ausprobieren hin.
        wobei durch das box-model schon vieles besser geworden ist.

        ganz am Anfang hast du was geschrieben das du es im IE getestet hast.
        Wenn du tatsäcghlich den alten Internet-Explorer damit meinst. Den bitte nicht mehr verwenden.
        Der ist so ziemlich das schlechteste Beispiel was einen Browser angeht. Da wurde wirklich vieles ganz schlecht von Microsoft umgesetzt.
        Wenn das allerdings immer noch deine Bezeichnung ist für Microsoft Edge > Version 70 ist,
        dann kannst weitermachen. Da steckt dann Chromium drin. Das selbe wie bei Chrome und noch bei ein paar anderen Browsers.
        Firefox ist auch ok. Chromium und Varianten ist meines erachtens aber schneller.

        1 Reply Last reply Reply Quote 0
        • D
          Delphinis @OliverIO last edited by Delphinis

          @oliverio
          danke für den Hinweis. Aber mit den css hab ich auch schon grösste Probleme gehabt. Wohl weil das was in den Css steht, sich über alle Seiten (View) hinweg auswirkt, obwohl man in jeder View ein anderes css eintragen kann?
          Jedenfalls war das auch eine Katastrophe mit unbekanntem Ausgang, als ich ein HTML-Widget so formatieren wollte.
          Aber ich versuchs mal aus.
          Wo kriegt man denn die Informationen her, z.b. ".vis-tpl-jqui-Button" und deren Eigenschaften?
          Kann man auch die vermeintlichen Ränder und Abstände dort rausnehmen?

          Sorry, meinte natürlich nicht den IE sondern Edge...

          OliverIO 1 Reply Last reply Reply Quote 0
          • Homoran
            Homoran Global Moderator Administrators @Delphinis last edited by

            @delphinis sagte in Grösste Probleme mit Auflösung, Widget-Breiten usw.:

            Firefox ist doch nach W3C

            hier ein Beispiel
            Screenshot_20240626-140522_Firefox.jpg

            tritt nur (?) bei Firefox auf.
            Rahmen des Charts und Hintergrund haben gleiche Höhe.
            Edge, chrome, Ecosia
            Screenshot_20240626-140748_Ecosia.jpg

            alles in Ordnung

            OliverIO 1 Reply Last reply Reply Quote 0
            • OliverIO
              OliverIO @Delphinis last edited by

              @delphinis sagte in Grösste Probleme mit Auflösung, Widget-Breiten usw.:

              Wo kriegt man denn die Informationen her, z.b. ".vis-tpl-jqui-Button" und deren Eigenschaften?
              Kann man auch die vermeintlichen Ränder und Abstände dort rausnehmen?

              am besten kann man über das web developer tool nachschauen, die in jedem browser eingebaut ist. Meist mit F12 oder rechte Maustaste und dann sowas wie "untersuchen".
              Da gibt es dann ein Tool mit dem man über der webseite schweben kann und ein bestimmtes element auswählen kann und er dann den source anzeigt.
              wenn du dich mit css nicht gut auskennst, dann versuche aber weiterhin die einstellungen von vis zu nehmen (die ja in css-anweisungen im hintergrund umgesetzt werden)

              als umfangreiches nachschlagewerk und tutorial kannst du die folgende seite verwenden
              https://wiki.selfhtml.org/wiki/CSS

              Evtl noch ein Hinweis auf mein CSS. Das !important hat auch den Nachteil, das du über die vis, für diese widgets genau diese Einstellungen nicht mehr vornehmen kannst. da das aber nur die etwas tiefer verschachtelten html elemente gilt, dürfte es kein probleme geben.
              ich hoffe ich überfordere dich damit nicht. das html/css-Thema lässt sich leider nicht nur in 5minuten erfassen.

              1 Reply Last reply Reply Quote 0
              • OliverIO
                OliverIO @Homoran last edited by

                @homoran
                nein, da stimmt schon was nicht.

                importiere dir mal den folgenden export von 4 widgets

                [{"tpl":"tplJquiButtonLink","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":true,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","buttontext":"Text123456789012345678","padding":"5","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,"class":""},"style":{"left":"0px","top":"53px","width":"300px","height":"50px","padding":"0"},"widgetSet":"jqui"},{"tpl":"tplJquiButtonState","data":{"oid":"nothing_selected","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","buttontext":"Text123456789012345678","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,"class":""},"style":{"left":"0px","top":"107px","width":"300px","height":"50px"},"widgetSet":"jqui"},{"tpl":"tplJquiButtonLink","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":true,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","buttontext":"Text","padding":"5","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,"class":""},"style":{"left":"345px","top":"52px","width":"300px","height":"50px","padding":"0"},"widgetSet":"jqui"},{"tpl":"tplJquiButtonState","data":{"oid":"nothing_selected","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","buttontext":"Text","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,"class":""},"style":{"left":"346px","top":"107px","width":"300px","height":"50px"},"widgetSet":"jqui"}]
                

                alle 4 sind 300pxX50px groß
                2 links mit langen Text
                2 rechts mit kurzem Text

                0655ce29-d95e-4058-9aeb-8ff1f9e133b0-image.png

                Wenn man das css im css-Reiter einträgt sieht es so aus
                7eb5de8b-f758-44a4-a781-46897ee404ce-image.png

                Homoran 1 Reply Last reply Reply Quote 0
                • Homoran
                  Homoran Global Moderator Administrators @OliverIO last edited by

                  @oliverio sagte in Grösste Probleme mit Auflösung, Widget-Breiten usw.:

                  da stimmt schon was nicht.

                  ist bereits seit Jahren so.
                  Auch bei Schriftgrößen.

                  @oliverio sagte in Grösste Probleme mit Auflösung, Widget-Breiten usw.:

                  importiere dir mal den folgenden export von 4 widgets

                  danke!
                  ich hoffe mal ich denke noch daran, wenn ich das machen könnte.

                  D 1 Reply Last reply Reply Quote 0
                  • D
                    Delphinis last edited by

                    @oliverio
                    Ok, hab sie importiert.
                    Ich kenne mich mit CSS schon ein bisschen aus aber nicht so in der Anwendung in der Vis.
                    Es gibt ja da das Tab CSS in den Eigenschaften da hab ich mal die Regel eingetragen

                    .vis-tpl-jqui-Button button {
                        width: inherit !important;
                        height: inherit !important;
                        padding: inherit !important;
                    }
                    

                    Vor Eintrag CSS:
                    68c16185-ddac-4d23-96e5-8bc5987fb4da-grafik.png

                    Untere Buttons abgeschnitten, Verschiedene Abstände zu linkem Rand.

                    Nach Eintrag CSS:
                    cc59873d-3422-41cb-b9ce-efee40dcee28-grafik.png
                    Nun sind zwar alle Buttons gleich hoch und breit aber das Padding ist geblieben und der abgeschnittene Rand ist jetzt auf allen vier buttons...
                    Alle Buttons abgeschnitten, Verschiedene Abstände zum linken Rand (padding/border?)

                    OliverIO 1 Reply Last reply Reply Quote 0
                    • D
                      Delphinis @Homoran last edited by

                      @homoran said in Grösste Probleme mit Auflösung, Widget-Breiten usw.:

                      ist bereits seit Jahren so.

                      Dann basteln immer alle so rum???

                      1 Reply Last reply Reply Quote 0
                      • OliverIO
                        OliverIO @Delphinis last edited by OliverIO

                        @delphinis

                        welches theme hast du da genau eingestellt?
                        ich habe bspw keine gerundeten ecken. die sind nur in der runtime sichtbar

                        problem kann auch sein, das wenn di weitere adapter geladen hast und da vom author die css-anweisungen nicht gut formuliert sind, die dir da ebenfalls reinpfuscheln.
                        hatte bereits hier und da schon mal issues gestellt (ich glaube homoran kennt da einen fall)
                        aber da wird so gut wie nie reagiert, da vom kapseln von css anweisung niemand so richtig ahnung hat.
                        ich teste hier auf einem vanilla vis ohne viele adapter (nur meine)

                        D 1 Reply Last reply Reply Quote 0
                        • D
                          Delphinis @OliverIO last edited by Delphinis

                          @oliverio
                          Ja das war natürlich in der Runtime, das ist ja das wichtigste. Im Editor sieht alles io aus:

                          0600ede5-b5ca-4691-9c40-be757210da22-grafik.png

                          Kein Abstand, keine abgerundete Ecken, und Grau statt blau...

                          Was meinst du mit Theme? Im Browser? oder im Editor? Im Browser hab ich ein "Soft Green Theme for Firefox" aber nach deaktivieren desselben, ändert sich nichts.

                          Aber mit den verschiedenen Paddings hat das ja wohl nichts zu tun?
                          Hab übrigens auch lästige Paddings innerhalb der "jqui navigation icon"s:
                          5ad9b437-6f3c-473d-a178-05bb29eff7b5-grafik.png
                          Da ist alles auf der rechten seite und verbraucht fürs Handy unnötigen platz links in jedem Button. Im Editor ist aber alles schön zentriert.

                          OliverIO 1 Reply Last reply Reply Quote 0
                          • OliverIO
                            OliverIO @Delphinis last edited by OliverIO

                            @delphinis

                            light ist das graue
                            redmond ist das blaue

                            beim wechsel ist manchmal ein neuladen ohne cache notwendig (ctrl+F5)

                            0070227f-4a7c-4f88-877e-d3f2d127258e-image.png

                            D 1 Reply Last reply Reply Quote 0
                            • D
                              Delphinis last edited by Delphinis

                              @oliverio

                              Bei mir war keines ausgewählt. (Alle grau)
                              Hab nun mal das light angewählt. Resultat:

                              Im Editor sind jetzt gewisse Blau und gewisse grau???
                              e1c9379a-34bc-4313-903a-fb823a497a8a-grafik.png

                              Im light (gefällt mir ein bisschen besser) ist alles gräulich die vorher blauen etwas mehr ins bränuliche.
                              Aber das sind doch die selben??? Offenbar diejenigen von Dir wieder anders als meine?
                              Ach so, ich hab da versuchshalber die Checkbox "ohne jQuery Stil" angehakt. Hab die wieder rausgenommen.
                              Jetzt sind sie ähnlicher aber immer noch nicht wie im Editor:
                              751fa30a-b566-4d2b-8562-8e20562e190e-grafik.png

                              1 Reply Last reply Reply Quote 0
                              • D
                                Delphinis @OliverIO last edited by Delphinis

                                @oliverio
                                Hier noch ein Video vom unberechenbaren Verhalten der Widgets mit Breiteneinstellungen:

                                Muss runtergeladen werden, da zu gross um hier reinzupacken:
                                https://www.mycloud.ch/l/P00EFA0DB782A365F8CF0F126F823E7216E2CA21C3258D1AB2165355EB1474325
                                drei pünktchen anklicken und runterladen

                                • Die Höhe der Widgets ist nicht gleich, obwohl die selbe Höhe in Pixeln (460px) angegeben.
                                • Man kann das Widget mit der Gestrichelten Linie vergrössern/verkleinern oder am Button. Manchmal geht das eine, mal das andere oder beide...
                                • Ist das Widget abgeschnitten und man ändert die Breite in den Eigenschaften, wird erscheint es nicht mehr abgeschnitten, (gestrichelter Rahmen wird grösser) klickt man aber auf den gestrichelten Rahmen, springt dieser plötzlich und es wird wieder abgeschnitten. Dieses Verhalten der Einstellungen kann sich aber jederzeit ändern, wenn man die Editor-Seite neu lädt, oder sonst was ändert, was aber damit eigentlich nichts zu tun hat.
                                • Das Abschneiden des Buttons geschieht auch, wenn es gross genug ist, um es darzustelllen.
                                • Position ist je nach widget anders, obwohl alle die selbe PosX oder PosY haben.

                                Das sind nur wenige der unzulänglichkeiten...

                                Homoran OliverIO 3 Replies Last reply Reply Quote 0
                                • Homoran
                                  Homoran Global Moderator Administrators @Delphinis last edited by Homoran

                                  @delphinis wieviel Text hast du?
                                  passt der bei der gewählten Schriftgröße da vollständig rein?
                                  Welcher Zeilenabstand?

                                  arbeitest du mit Gruppierungen?
                                  arbeitest du mit relativen Abständen?

                                  D 1 Reply Last reply Reply Quote 0
                                  • OliverIO
                                    OliverIO @Delphinis last edited by

                                    @delphinis

                                    du musst die widgets vom typen her benennen
                                    oder besser einen export
                                    so als video hilft mir das nicht so

                                    D 1 Reply Last reply Reply Quote 0
                                    • D
                                      Delphinis @Homoran last edited by

                                      @homoran

                                      • Der längste Text ist im Widget automatisch ausgewählt
                                      • Keine Gruppierungen
                                      • Keine relative Abstände
                                      1 Reply Last reply Reply Quote 0
                                      • D
                                        Delphinis @OliverIO last edited by Delphinis

                                        @oliverio


                                        [{"tpl":"tplJquiSelectList","data":{"oid":"javascript.0.Vis.Flot.batSensor","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":true,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"values":"alias.0.TH-Heizregler;\nalias.0.TH-Bar;\nalias.0.TH-Bureau;\nalias.0.TH-Bad;\nalias.0.TH-SchlzRaum;\nalias.0.TH-SchlzWand;\nalias.0.TH-OutHolzunterstand;\nalias.0.TH-OutNO;\nalias.0.TH-OutSW;\nalias.0.TH-Garage;\nalias.0.TH-Weinkeller;\nalias.0.TH-Werkraum;\nalias.0.TH-Kuehl_In;\nalias.0.TH-Tiefkuehl;\nalias.0.TH-HeizVorlauf;\nalias.0.TH-HeizRuecklauf;\nalias.0.TH-HeizBoiler;","texts":"Heizregler;\nBar;\nBüro;\nBad;\nSchlafzimmer Raum;\nSchlafzimmer Wand;\nHolzunterstand;\nAussen NO;\nAussen SW;\nGarage;\nWeinkeller;\nWerkraum;\nKühlschrank;\nTiefkühler;\nVorlauf;\nRücklauf;\nBoiler;","height":"220","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,"open":false,"no_style":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide"},"style":{"left":"0px","top":"450px","width":"171px","height":"109px","padding":"","font-size":"x-small","z-index":""},"widgetSet":"jqui"},{"tpl":"tplJquiSelectList","data":{"oid":"javascript.0.Vis.Flot.solarTimeRange","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":true,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"values":"1440;2880;4320;10080;20160;40320","texts":"1Tg;2Tg;3Tg;7Tg;14Tg;28Tg","height":"220","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,"open":false,"no_style":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide"},"style":{"left":"175px","top":"450px","width":"67px","height":"280px","padding":"10","font-size":"x-small","font-weight":"bold"},"widgetSet":"jqui"},{"tpl":"tplJquiButtonNav","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":true,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","buttontext":">","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,"nav_view":"13hbat_"},"style":{"left":"239px","top":"450px","padding":"10","width":"53px","height":"21px","font-size":"x-small"},"widgetSet":"jqui"}]

                                        Bitte auch im der Runtime ausprobieren, im Editor funktioniert manchmal etwas aber dort nicht.

                                        1 Reply Last reply Reply Quote 0
                                        • OliverIO
                                          OliverIO @Delphinis last edited by OliverIO

                                          @delphinis sagte in Grösste Probleme mit Auflösung, Widget-Breiten usw.:

                                          hier mein review

                                          • Die Höhe der Widgets ist nicht gleich, obwohl die selbe Höhe in Pixeln (460px) angegeben.
                                            -> als höhe war irgendwas mit 220px eingegeben. du hast im video top geändert und das ist die Y-position des widgets im feld
                                            bei dropdown select macht eine größere höhe keinen sinn. das bekommt man nur dann mit einer größeren schriftart hin. ansonsten siehe letzten punkt
                                            das was du versuchst zu erreichen, das als aufgeklappte Liste anzuzeigen, erhält man wenn man checkbox open anwählt. dann kannst du die größe der liste bestimmen
                                          • Man kann das Widget mit der Gestrichelten Linie vergrössern/verkleinern oder am Button. Manchmal geht das eine, mal das andere oder beide...
                                            Ist das Widget abgeschnitten und man ändert die Breite in den Eigenschaften, wird erscheint es nicht mehr abgeschnitten, (gestrichelter Rahmen wird grösser) klickt man aber auf den gestrichelten Rahmen, springt dieser plötzlich und es wird wieder abgeschnitten. Dieses Verhalten der Einstellungen kann sich aber jederzeit ändern, wenn man die Editor-Seite neu lädt, oder sonst was ändert, was aber damit eigentlich nichts zu tun hat.
                                            -> das konnte ich nicht nachvollziehen. evtl haben sich die auswahlbereiche verschiedener widgets überlappt und du hast dann versehentlich das falsche widget angewählt. ich passe meine größen meist immer nur durch eingabe der zahl an und nicht per maus
                                          • Das Abschneiden des Buttons geschieht auch, wenn es gross genug ist, um es darzustelllen.
                                            -> select boxen haben automatisch die breite des längsten enthaltenen elements. verbreitern kannst du, dann wird das auswahlfeld größer. wenn du verkleinerst und unter die darstellungsgrenze kommst, dann schneidet der browser ab (clipping)
                                          • Position ist je nach widget anders, obwohl alle die selbe PosX oder PosY haben.
                                            -> ja korrekt die widgets mit 1TG und > haben noch ein padding von 10 eingestellt. wenn du das löscht, dann sind alle auf der richtigen top position.

                                          ich habe bei mir englisch eingestellt, das macht es einfacher die korrekten eigenschaften zu benennen, da die übersetzung deren manchmal nicht immer so ganz exakt ist.

                                          D 1 Reply Last reply Reply Quote 1
                                          • D
                                            Delphinis @OliverIO last edited by Delphinis

                                            @oliverio said in Grösste Probleme mit Auflösung, Widget-Breiten usw.:

                                            Die Höhe der Widgets ist nicht gleich, obwohl die selbe Höhe in Pixeln (460px) angegeben.

                                            Sorry, da meinte ich die Höhe in der das Widget steht. (Top). Und die ist nicht gleich. Hat aber wohl auch mit verschiedenen Paddings und margins zu tun.
                                            Wenn man aber eine Serie von Widgets macht, sollten doch alle das selbe verhalten haben, sprich gleiche paddings (am besten so klein wie möglich, da fürs Handy meist wenig Platz), gleiche Schriftgrösse usw. Scheint aber alles zusammengebastelt zu sein. Ich weiss, dass das alles oder mindestens das meiste Freiwilligenarbeit ist. Aber da scheint mir weniger mehr zu sein. Es gibt unzählige Widgets welche nicht richtig funktionieren. Aber es müssten doch mindestens die grundlegenden Widgets funtionieren, damit iobroker eine gewisse Akzeptanz bekommt.
                                            Aber wenn ich dann Leute hören, die sagen "Das war schon immer so", dann, na ja...

                                            @oliverio said in Grösste Probleme mit Auflösung, Widget-Breiten usw.:

                                            -> das konnte ich nicht nachvollziehen

                                            Sieht man aber eben gut im Video

                                            @oliverio said in Grösste Probleme mit Auflösung, Widget-Breiten usw.:

                                            -> select boxen haben automatisch die breite des längsten enthaltenen elements. verbreitern kannst du, dann wird das auswahlfeld größer. wenn du verkleinerst und unter die darstellungsgrenze kommst, dann schneidet der browser ab (clipping)

                                            Sorry, aber man sieht soch dass die Buttons abgeschnitten sind. Egal wie breit sie sind:
                                            6dcd111d-6acb-4991-86df-dfad8cf9c855-grafik.png

                                            Homoran OliverIO 2 Replies Last reply Reply Quote 0
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            444
                                            Online

                                            31.9k
                                            Users

                                            80.1k
                                            Topics

                                            1.3m
                                            Posts

                                            4
                                            77
                                            2663
                                            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