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

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. [gelöst] vis.editor: eigene Widgets: style-top Angabe spielt verrückt

NEWS

  • Monatsrückblick Januar/Februar 2026 ist online!
    BluefoxB
    Bluefox
    9
    1
    98

  • Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨
    BluefoxB
    Bluefox
    17
    1
    4.3k

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    13
    1
    1.2k

[gelöst] vis.editor: eigene Widgets: style-top Angabe spielt verrückt

Geplant Angeheftet Gesperrt Verschoben Visualisierung
2 Beiträge 1 Kommentatoren 394 Aufrufe
  • Ä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.
  • ? Offline
    ? Offline
    Ein ehemaliger Benutzer
    schrieb am zuletzt editiert von
    #1

    Hallo,

    ich versuche gerade mit Hilfe von eigenen Widgets eine Liste im Stil des Material-Designs zu bauen.

    Ein Widget soll dabei ein Listitem sein.

    (https://github.com/nisiode/ioBroker.vis-material)

    Ich habe jedoch noch eine merkwürdige Verhalten in der "top" Positionierung.

    Die Listitem sollen untereinander im Abstand von 56px erscheinen.

    Nach initialem Laden(Refresh/F5) sieht es total verschoben aus.

    So sieht es dann auch im vis direkt aus.
    2986_initial.png

    Nachdem man einzelne Widgets im Editor anklickt, positionieren sich die Widgets korrekt anhand der angegeben top Werte.
    2986_nach-klick.png

    Export des Views:

    {
      "settings": {
        "style": {
          "background_class": ""
        },
        "theme": "redmond",
        "sizex": "",
        "sizey": "",
        "gridSize": "8",
        "useAsDefault": false,
        "snapType": 2,
        "class": "",
        "useBackground": false
      },
      "widgets": {
        "e00001": {
          "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,
            "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,
            "class": "mdui-subtitle",
            "html": "Erdgeschoss",
            "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,
            "name": "EG"
          },
          "style": {
            "left": "16px",
            "top": "8px",
            "width": "auto",
            "height": "20px"
          },
          "widgetSet": "basic"
        },
        "e00002": {
          "tpl": "tplMaListDoor",
          "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",
            "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,
            "oid": "javascript.0.wohnen.vi_door.garten.state",
            "title": "Wohnen",
            "subtitle": "Garten"
          },
          "style": {
            "left": "0px",
            "top": "56px",
            "position": ""
          },
          "widgetSet": "material"
        },
        "e00003": {
          "tpl": "tplMaListDoor",
          "data": {
            "g_fixed": false,
            "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",
            "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,
            "title": "Eingang",
            "subtitle": "Haustür",
            "oid": "javascript.0.eingang.vi_door.state"
          },
          "style": {
            "left": "0px",
            "top": "168px"
          },
          "widgetSet": "material"
        },
        "e00004": {
          "tpl": "tplMaListDoor",
          "data": {
            "g_fixed": false,
            "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",
            "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,
            "oid": "javascript.0.wohnen.vi_door.terasse.state",
            "title": "Wohnen",
            "subtitle": "Terasse"
          },
          "style": {
            "left": "0px",
            "top": "112px"
          },
          "widgetSet": "material"
        },
        "e00005": {
          "tpl": "tplMaListDoor",
          "data": {
            "g_fixed": false,
            "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",
            "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,
            "title": "Werkstatt",
            "subtitle": "Tür",
            "oid": "javascript.0.eingang.vi_door.state"
          },
          "style": {
            "left": "0px",
            "top": "calc(4 * 56px)"
          },
          "widgetSet": "material"
        }
      },
      "name": "contentWindow",
      "filterList": []
    }
    
    1 Antwort Letzte Antwort
    0
    • ? Offline
      ? Offline
      Ein ehemaliger Benutzer
      schrieb am zuletzt editiert von
      #2

      Gelöst: Es lag an "position-relative"

      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

      359

      Online

      32.7k

      Benutzer

      82.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