[gelöst] Dialog-Button Design anpassen

Kuddel

Hallo zusammen,

ich habe in meiner VIS ein Button-Widget hinzugefügt, um mir ein Regenradar anzeigen zu lassen:

Leider bekomme ich das Design nicht geändert.

Der Button soll mit einem Singalbild belegt werden, welches bklinkt, wenn es Regen geben soll

Der Hintergunrd vom geöffneten Fenster stört mich ein wenig.
Im Moment ist das Fenster so eingestellt, dass es nach 10 Sekunden automatisch geschlossen wird.
Somit brauche ich keinen Button zum schließen.

Kann mir vllt. jmd. helfen?

gfrene

So habe mal bisschen was gebaut.

1x mal wenn der Wert Regen gesetzt ist fängt der Button an zu blicken in der Farbe Blau. ( Den Wert müsstest du noch mit einbauen)

Puop

Hast du dir das so vorgestellt ?

gfrene

@Kuddel said in Dialog-Button Design anpassen:

Widget

Moin Kuddel ... da ich auch vieles von dir habe möchte ich dir jetzt gerne helfen kannst du mit beide Widget zukommen lassen also das Wetter und die Datei vom Popup. Ich schaue dann ob ich das für dich ändern kann.

Kuddel

@gfrene anbei einmal die Seite mit dem Regenradar sowie der Button zum aufrufen

Regenradar

{
  "settings": {
    "style": {
      "background-color": "#000000",
      "background_class": ""
    },
    "theme": "redmond",
    "sizex": "",
    "sizey": "",
    "gridSize": "",
    "useBackground": false,
    "snapType": null
  },
  "widgets": {
    "e00001": {
      "tpl": "tplFrame",
      "data": {
        "g_fixed": true,
        "g_visibility": false,
        "g_css_font_text": true,
        "g_css_background": true,
        "g_css_shadow_padding": true,
        "g_css_border": true,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "title": "",
        "title_color": "#FFFFFF",
        "title_top": "-10",
        "title_left": "30",
        "header_height": "0",
        "header_color": "",
        "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_back": "",
        "title_font": "",
        "name": "!_Hintergrund"
      },
      "style": {
        "left": "0px",
        "top": "0px",
        "width": "527px",
        "height": "350px",
        "color": "",
        "z-index": "1",
        "border-radius": "10px",
        "box-shadow": "2px 2px 3px rgba(20, 20, 20, 50)",
        "background": "#202020",
        "border-color": "#2d2d2d"
      },
      "widgetSet": "basic"
    },
    "e00002": {
      "tpl": "tplHtml",
      "data": {
        "g_fixed": true,
        "g_visibility": false,
        "g_css_font_text": false,
        "g_css_background": true,
        "g_css_shadow_padding": false,
        "g_css_border": true,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "refreshInterval": "0",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "html": "",
        "name": "!_Linie-Rechts"
      },
      "style": {
        "left": "263.5px",
        "top": "35px",
        "background": "linear-gradient(to left, #212121 20px, White 200px )",
        "height": "2px",
        "width": "263.5px",
        "z-index": "10",
        "border-radius": ""
      },
      "widgetSet": "basic"
    },
    "e00003": {
      "tpl": "tplHtml",
      "data": {
        "g_fixed": true,
        "g_visibility": true,
        "g_css_font_text": true,
        "g_css_background": true,
        "g_css_shadow_padding": false,
        "g_css_border": true,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "refreshInterval": "0",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "name": "!_Linie-Links"
      },
      "style": {
        "left": "0px",
        "top": "35px",
        "background": "linear-gradient(to right, #212121 20px, White 200px )",
        "height": "2px",
        "width": "263.5px",
        "z-index": "10",
        "border-radius": ""
      },
      "widgetSet": "basic"
    },
    "e00004": {
      "tpl": "tplHtml",
      "data": {
        "g_fixed": false,
        "g_visibility": false,
        "g_css_font_text": true,
        "g_css_background": false,
        "g_css_shadow_padding": false,
        "g_css_border": false,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "refreshInterval": "0",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "name": "!_Überschrift",
        "html": "Regenradar"
      },
      "style": {
        "left": "0px",
        "top": "7px",
        "width": "527px",
        "height": "25px",
        "z-index": "3",
        "color": "white",
        "text-align": "center",
        "font-family": "Arial, Helvetica, sans-serif",
        "line-height": "20px",
        "font-size": "x-large"
      },
      "widgetSet": "basic"
    },
    "e00005": {
      "tpl": "tplIFrame",
      "data": {
        "g_fixed": true,
        "g_visibility": false,
        "g_css_font_text": false,
        "g_css_background": false,
        "g_css_shadow_padding": false,
        "g_css_border": false,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "refreshInterval": "900000",
        "seamless": "true",
        "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,
        "name": "Radar_Aktuell",
        "src": "https://gadgets.buienradar.nl/gadget/zoommap/?lat=53.48090000&lng=9.61960000&overname=2&zoom=13&size=2&voor=0",
        "noSandbox": true
      },
      "style": {
        "left": "5px",
        "top": "45px",
        "width": "256px",
        "height": "256px",
        "z-index": "10"
      },
      "widgetSet": "basic"
    },
    "e00006": {
      "tpl": "tplIFrame",
      "data": {
        "g_fixed": true,
        "g_visibility": false,
        "g_css_font_text": false,
        "g_css_background": false,
        "g_css_shadow_padding": false,
        "g_css_border": false,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "refreshInterval": "900000",
        "seamless": "true",
        "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,
        "name": "Radar_Vorhersage",
        "src": "https://gadgets.buienradar.nl/gadget/zoommap/?lat=53.48090000&lng=9.61960000&overname=2&zoom=13&size=2&voor=1",
        "noSandbox": true
      },
      "style": {
        "left": "266px",
        "top": "45px",
        "width": "256px",
        "height": "256px",
        "z-index": "10",
        "font-size": "x-large"
      },
      "widgetSet": "basic"
    },
    "e00007": {
      "tpl": "tplHtml",
      "data": {
        "g_fixed": true,
        "g_visibility": false,
        "g_css_font_text": true,
        "g_css_background": false,
        "g_css_shadow_padding": false,
        "g_css_border": false,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "refreshInterval": "0",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "name": "Descr_Aktuell",
        "html": "Aktuell"
      },
      "style": {
        "left": "5px",
        "top": "315px",
        "width": "256px",
        "height": "30px",
        "color": "white",
        "text-align": "center",
        "font-family": "Arial, Helvetica, sans-serif",
        "font-style": "normal",
        "font-variant": "normal",
        "font-weight": "bolder",
        "font-size": "x-large",
        "line-height": "30px",
        "z-index": "10"
      },
      "widgetSet": "basic"
    },
    "e00008": {
      "tpl": "tplHtml",
      "data": {
        "g_fixed": true,
        "g_visibility": false,
        "g_css_font_text": true,
        "g_css_background": false,
        "g_css_shadow_padding": false,
        "g_css_border": false,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "refreshInterval": "0",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "name": "Descr_Vorhersage",
        "html": "Vorhersage 3h"
      },
      "style": {
        "left": "266px",
        "top": "315px",
        "width": "256px",
        "height": "30px",
        "color": "white",
        "text-align": "center",
        "font-family": "Arial, Helvetica, sans-serif",
        "font-style": "normal",
        "font-variant": "normal",
        "font-weight": "bolder",
        "font-size": "x-large",
        "line-height": "30px",
        "z-index": "10"
      },
      "widgetSet": "basic"
    }
  },
  "name": "837_Regenradar",
  "filterList": []
}

Button

[{"tpl":"tplContainerIconDialog","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":true,"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","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":"Regenradar_Button","contains_view":"837_Regenradar","title":"Regenradar","noHeader":true,"dialog_width":"530px","dialog_height":"350px","dialog_top":"40px","dialog_left":"5px","setValue":"","text":"Radar","setId":"","imageHeight":"0","invert_icon":false,"overflowX":"","views":["Echo_Devs","Echo_Gruppen"],"autoclose":"30","modal":true,"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},"style":{"left":"25px","top":"555px","width":"60px","height":"25px","font-size":"","line-height":"25px","z-index":"10"},"widgetSet":"jqui"}]

gfrene

So habe mal bisschen was gebaut.

1x mal wenn der Wert Regen gesetzt ist fängt der Button an zu blicken in der Farbe Blau. ( Den Wert müsstest du noch mit einbauen)

Puop

Hast du dir das so vorgestellt ?

Kuddel

@gfrene wunderbest

genau so habe ich mir das gedacht :-)

gfrene

Super das freut mich zu hören.

als erstes brauchst du das hier... was du in CSS und Scripte einbauen musst
https://forum.iobroker.net/topic/7322/projekt-material-design-css-für-iobroker-vis

Button + Pupup

[{"tpl":"tplContainerIconDialog","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"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,"class":"","contains_view":"Regenradar","dialog_width":"540","dialog_height":"400","autoclose":"15","modal":true,"name":"","comment":"","text":"","alt":"","title":"","src":"","dialog_top":"100px","dialog_left":"230px","overflowX":"hidden","overflowY":"hidden","imageHeight":"120"},"style":{"left":"1091px","top":"309px","width":"80px","height":"36px","z-index":"29","background":"transparent","border-color":"transparent"},"widgetSet":"jqui"}]

Mehr brauchst du nicht. Ich glaube das lass ich bei mir auch so ... Wegen dem Regen-Wert wo würdest du den herholen ?

Kuddel

@gfrene sagte in Dialog-Button Design anpassen:

Super das freut mich zu hören.

als erstes brauchst du das hier... was du in CSS und Scripte einbauen musst
https://forum.iobroker.net/topic/7322/projekt-material-design-css-für-iobroker-vis

Button + Pupup

[{"tpl":"tplContainerIconDialog","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"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,"class":"","contains_view":"Regenradar","dialog_width":"540","dialog_height":"400","autoclose":"15","modal":true,"name":"","comment":"","text":"","alt":"","title":"","src":"","dialog_top":"100px","dialog_left":"230px","overflowX":"hidden","overflowY":"hidden","imageHeight":"120"},"style":{"left":"1091px","top":"309px","width":"80px","height":"36px","z-index":"29","background":"transparent","border-color":"transparent"},"widgetSet":"jqui"}]

Mehr brauchst du nicht. Ich glaube das lass ich bei mir auch so ... Wegen dem Regen-Wert wo würdest du den herholen ?

Ich würde als RegenWert die erwartete Niederschlagsmenge von Adapter "DasWetter" verwenden

gfrene

ahhh ok also vom Wert rain_value Wenn du das fertig hast kannst du mirdann zeigen wie du es gebaut hast ?

Kuddel

@gfrene danke für die Hilfe. Hier ist mein Ergebnis:

[{"tpl":"tplContainerIconDialog","data":{"g_fixed":true,"g_visibility":true,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"<","visibility-val":"5","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,"class":"","contains_view":"837_Regenradar","dialog_width":"530px","dialog_height":"350px","autoclose":"30","modal":true,"name":"Regenradar_Button","comment":"","text":"Radar","alt":"","title":"","src":"","dialog_top":"40px","dialog_left":"5px","overflowX":"hidden","overflowY":"hidden","imageHeight":"120","noHeader":true,"visibility-oid":"daswetter.0.NextDaysDetailed.Location_1.Day_1.rain_value"},"style":{"left":"15px","top":"550px","width":"80px","height":"30px","z-index":"10","background":"transparent","border-color":"transparent"},"widgetSet":"jqui"}]

rain_value < 5 somit blinkt das Icon nicht

[{"tpl":"tplContainerIconDialog","data":{"g_fixed":true,"g_visibility":true,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":">","visibility-val":"5","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,"class":"mdui-raisedbutton mdui-red-blink","contains_view":"837_Regenradar","dialog_width":"530px","dialog_height":"350px","autoclose":"30","modal":true,"name":"Regenradar_Button_regen","comment":"","text":"Radar","alt":"","title":"","src":"","dialog_top":"40px","dialog_left":"5px","overflowX":"hidden","overflowY":"hidden","imageHeight":"120","noHeader":true,"visibility-oid":"daswetter.0.NextDaysDetailed.Location_1.Day_1.rain_value"},"style":{"left":"15px","top":"550px","width":"80px","height":"30px","z-index":"10","background":"transparent","border-color":"transparent"},"widgetSet":"jqui"}]

rain_value > 5 das Icon blinkt rot

Und das Regenradar selber:

Shigoru

Inhalt gelöscht und neuen Post geöffnet

Community Forum

NEWS

[gelöst] Dialog-Button Design anpassen

Support us

567

32.8k

82.8k

1.3m