Vehicle images/icons for display card

[Jaspils]

Starting this discussion out of curiosity,

How does everyone use this integration to display nice information on your dashboard? And specifically how do you gather the best images to build it? I've based my view on the following lovelace card by endor: https://github.com/endor-force/lovelace-carnet

Example above shows my vehicle as downloaded PNG from WeConnect (as endor suggested), but this image is only static.

But I would like to enhance things. For example: show the image with certain doors open, when they are actually opened (just like Active Info Display in Volkswagen shows). And perhaps do something with the lighting like endor did in his card. However: I don't have the images to build this, and unfortunately don't have the photoshop skills to make them myself.

I wondered if it was possible to obtain Volkswagen software used in the vehicle (MIB 2.5 I think) and somehow extract the images that the Active Info Display uses. But I haven't found any readable images so for in any software or maps-update I could find from Volkswagen.

Perhaps some other users have found something, or have suggestions on how to get this.

[Jaspils]

New info:

It turns out that certain images (like in the WeConnect app) are integrated in the app itself. It is possible to extract the Android App to gather images required for your vehicle (in my case the Arteon is named 'car_passat_cc_nf_*.png'.

With all images uploaded in Home Assistant, I can create a picture elements card like this:

type: picture-elements
image: /local/images/Arteon/car_passat_cc_nf_car.png
style:
  width: 100%
elements:
  - type: image
    entity: binary_sensor.arteon_hood_closed
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/Arteon/car_passat_cc_nf_bonnet_open.png
  - type: image
    entity: binary_sensor.arteon_door_closed_left_front
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/images/Arteon/car_passat_cc_nf_door_ul_closed.png
      'on': /local/images/Arteon/car_passat_cc_nf_door_ul_open.png
  - type: image
    entity: binary_sensor.arteon_door_closed_right_front
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/images/Arteon/car_passat_cc_nf_door_ur_closed.png
      'on': /local/images/Arteon/car_passat_cc_nf_door_ur_open.png
  - type: image
    entity: binary_sensor.arteon_door_closed_left_back
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/images/Arteon/car_passat_cc_nf_door_ll_closed.png
      'on': /local/images/Arteon/car_passat_cc_nf_door_ll_open.png
  - type: image
    entity: binary_sensor.arteon_door_closed_right_back
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/images/Arteon/car_passat_cc_nf_door_lr_closed.png
      'on': /local/images/Arteon/car_passat_cc_nf_door_lr_open.png
  - type: image
    entity: binary_sensor.arteon_hood_closed
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/Arteon/car_passat_cc_nf_bonnet_open.png
  - type: image
    entity: binary_sensor.arteon_trunk_closed
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/Arteon/car_passat_cc_nf_trunk_open.png
  - type: image
    entity: binary_sensor.arteon_window_closed_left_front
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/Arteon/car_passat_cc_nf_window_ul_open.png
  - type: image
    entity: binary_sensor.arteon_window_closed_left_back
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/Arteon/car_passat_cc_nf_window_ll_open.png
  - type: image
    entity: binary_sensor.arteon_window_closed_right_front
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/Arteon/car_passat_cc_nf_window_ur_open.png
  - type: image
    entity: binary_sensor.arteon_window_closed_right_back
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/Arteon/car_passat_cc_nf_window_lr_open.png
  - type: image
    entity: binary_sensor.arteon_parking_light
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/Arteon/car_passat_cc_nf_p_lights_left_on.png
  - type: image
    entity: binary_sensor.arteon_parking_light
    image: /local/images/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/Arteon/car_passat_cc_nf_p_lights_right_on.png

Resulting in (for example:)

[Skylinar]

Hi @Jaspils, awesome work! How did you gather the pictures exactly from the android app? Would be great if you can give more detail.

[Jaspils]

You can download the XAPK package for the My VW app (for example). This XAPK can be extracted, and the APK inside as well. Search for "com.vw.carnet.release\res\drawable-nodpi-v4". This folder contains a lot of images to construct a view as I did. They all overlap to form a complete overview.

[Skylinar]

Awesome, thanks. This is my outcome so far.

[Jaspils]

Looking good.

I've edited some over time myself, currently have this yaml:

type: picture-elements
image: /local/images/Arteon/blank-492x552.png
style:
  width: 100%
elements:
  - type: conditional
    conditions:
      - entity: binary_sensor.arteon_default_view
        state: 'on'
    elements:
      - type: image
        entity: switch.arteon_force_data_refresh
        image: /local/images/Arteon_Small.png
        style:
          top: 50%
          left: 50%
          width: 150%
        tap_action:
          action: more-info
  - type: conditional
    conditions:
      - entity: binary_sensor.arteon_default_view
        state: 'off'
    elements:
      - type: image
        image: /local/images/Arteon/car_passat_cc_nf_car.png
        style:
          top: 50%
          left: 50%
          width: 100%
      - type: image
        entity: binary_sensor.arteon_hood_closed
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'on': /local/images/Arteon/car_passat_cc_nf_bonnet_open.png
      - type: image
        entity: binary_sensor.arteon_door_closed_left_front
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'off': /local/images/Arteon/car_passat_cc_nf_door_ul_closed.png
          'on': /local/images/Arteon/car_passat_cc_nf_door_ul_open.png
      - type: image
        entity: binary_sensor.arteon_door_closed_right_front
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'off': /local/images/Arteon/car_passat_cc_nf_door_ur_closed.png
          'on': /local/images/Arteon/car_passat_cc_nf_door_ur_open.png
      - type: image
        entity: binary_sensor.arteon_door_closed_left_back
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'off': /local/images/Arteon/car_passat_cc_nf_door_ll_closed.png
          'on': /local/images/Arteon/car_passat_cc_nf_door_ll_open.png
      - type: image
        entity: binary_sensor.arteon_door_closed_right_back
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'off': /local/images/Arteon/car_passat_cc_nf_door_lr_closed.png
          'on': /local/images/Arteon/car_passat_cc_nf_door_lr_open.png
      - type: image
        entity: binary_sensor.arteon_window_closed_left_front
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'on': /local/images/Arteon/car_passat_cc_nf_window_ul_open.png
      - type: image
        entity: binary_sensor.arteon_window_closed_left_back
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'on': /local/images/Arteon/car_passat_cc_nf_window_ll_open.png
      - type: image
        entity: binary_sensor.arteon_window_closed_right_front
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'on': /local/images/Arteon/car_passat_cc_nf_window_ur_open.png
      - type: image
        entity: binary_sensor.arteon_window_closed_right_back
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'on': /local/images/Arteon/car_passat_cc_nf_window_lr_open.png
      - type: image
        entity: binary_sensor.arteon_parking_light
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'on': /local/images/Arteon/car_passat_cc_nf_p_lights_left_on.png
      - type: image
        entity: binary_sensor.arteon_parking_light
        image: /local/images/blank.png
        style:
          top: 50%
          left: 50%
          width: 100%
        state_image:
          'on': /local/images/Arteon/car_passat_cc_nf_p_lights_right_on.png
        tap_action:
          action: call-service
          service: browser_mod.more_info
          service_data:
            entity: switch.arteon_force_data_refresh
            ignore_popup_card: true
  - type: state-icon
    entity: binary_sensor.arteon_doors_locked
    style:
      top: 89%
      left: 47%
  - type: state-label
    entity: binary_sensor.arteon_doors_locked
    style:
      top: 95%
      left: 47%
  - type: state-icon
    entity: switch.arteon_parking_heater_heating
    style:
      top: 89%
      left: 65%
  - type: state-label
    entity: switch.arteon_parking_heater_heating
    style:
      top: 95%
      left: 65%
  - type: state-icon
    entity: switch.arteon_parking_heater_ventilation
    style:
      top: 89%
      left: 29%
  - type: state-label
    entity: switch.arteon_parking_heater_ventilation
    style:
      top: 95%
      left: 29%
  - type: state-icon
    entity: sensor.arteon_fuel_level
    style:
      top: 89%
      left: 90%
  - type: state-label
    entity: sensor.arteon_fuel_level
    style:
      top: 95%
      left: 91%
  - type: state-label
    entity: sensor.arteon_combustion_range
    style:
      top: 84%
      left: 91%
  - type: state-icon
    entity: sensor.arteon_odometer
    style:
      top: 5%
      left: 5%
  - type: state-label
    entity: sensor.arteon_odometer
    style:
      top: 5%
      left: 19%
  - type: state-label
    entity: sensor.arteon_address
    style:
      top: 10%
      left: 50%
  - type: service-button
    title: Kachel aan
    style:
      top: 5%
      left: 85%
    service: input_button.press
    service_data:
      entity_id: input_button.arteon_standkachel_with_confirmation

What I've done is creating a custom binary sensor binary_sensor.arteon_default_view that is 'on' when all doors and windows are closed. In that case, it will give a front-view of the car (like in my main post). Only when a windows or door is opened, the binary_sensor is 'off' and therefor shows a top-view with a display of what's open (like in my other screenshot). And besides that I've also added the extra buttons and info in my code, same as in my main post picture.

Let me know if you find anything new or cool to add 😃

[Skylinar]

Hi @Jaspils, i tried to adopt your changes but i'm missing the custom binary sensor? Where have you created it and maybe can you share the code?

[Nimroth87]

Awesome, thanks. This is my outcome so far.

Hi @Skylinar,

this looks awesome. Since I probably own the same model (Passat GTE Variant) would it be possible for you to post the YAML for your card and maybe even upload the image ressources you used?

If not then thats totally fine and I will figure this out myself. To be honest I just want so save some time 😄

[Skylinar]

Hi @Nimroth87,
sorry for the late reply. Here is my yaml from the picture above. It's not completely ready and tested but you can use it as a blueprint. I wanted to adopt the changes from @Jaspils as well but had no time. I will in the near future.

type: picture-elements
image: /local/images/vw-passat/car_passat_variant_car.png
style:
  width: 100%
elements:
  - type: image
    entity: binary_sensor.passat_r_line_edition_hood_closed
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/vw-passat/car_passat_variant_bonnet_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_door_closed_left_front
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/images/vw-passat/car_passat_variant_door_ul_closed.png
      'on': /local/images/vw-passat/car_passat_variant_door_ul_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_door_closed_right_front
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/images/vw-passat/car_passat_variant_door_ur_closed.png
      'on': /local/images/vw-passat/car_passat_variant_door_ur_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_door_closed_left_back
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/images/vw-passat/car_passat_variant_door_ll_closed.png
      'on': /local/images/vw-passat/car_passat_variant_door_ll_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_door_closed_right_back
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/images/vw-passat/car_passat_variant_door_lr_closed.png
      'on': /local/images/vw-passat/car_passat_variant_door_lr_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_hood_closed
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/vw-passat/car_passat_variant_bonnet_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_trunk_closed
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/vw-passat/car_passat_variant_trunk_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_window_closed_left_front
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/vw-passat/car_passat_variant_window_ul_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_window_closed_left_back
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/vw-passat/car_passat_variant_window_ll_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_window_closed_right_front
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/vw-passat/car_passat_variant_window_ur_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_window_closed_right_back
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/vw-passat/car_passat_variant_window_lr_open.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_parking_light
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/vw-passat/car_passat_variant_p_lights_left_on.png
  - type: image
    entity: binary_sensor.passat_r_line_edition_parking_light
    image: /local/images/vw-passat/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/images/vw-passat/car_passat_variant_p_lights_right_on.png
  - type: state-icon
    entity: sensor.passat_r_line_edition_fuel_level
    style:
      top: 7%
      left: 75%
  - type: state-label
    entity: sensor.passat_r_line_edition_fuel_level
    style:
      top: 6%
      left: 85%
  - type: state-label
    entity: sensor.passat_r_line_edition_combustion_range
    style:
      top: 9%
      left: 85%
  - type: state-icon
    entity: sensor.passat_r_line_edition_odometer
    style:
      top: 7%
      left: 10%
  - type: state-label
    entity: sensor.passat_r_line_edition_odometer
    style:
      top: 7.5%
      left: 22%
  - type: state-icon
    entity: binary_sensor.passat_r_line_edition_doors_locked
    style:
      top: 4%
      left: 50%
  - type: state-label
    entity: binary_sensor.passat_r_line_edition_doors_locked
    style:
      top: 9.5%
      left: 50%
  - type: state-icon
    entity: sensor.passat_r_line_edition_last_trip_average_fuel_consumption
    icon: mdi:diameter-variant
    style:
      top: 13%
      left: 75%
  - type: state-label
    entity: sensor.passat_r_line_edition_last_trip_average_fuel_consumption
    style:
      top: 13.3%
      left: 88%

I made a zip out of the pictures i was using. Hope this helps.

vw-passat.zip

[Skylinar]

And if this is what you are searching for i would love if you share your outcome as well. I would love to get new ideas and make a perfekt dashboard out of it.

[SaschaWeicht]

My current dashboard looks like this (yes I know the charger port is on the wrong side)

[SaschaWeicht]

I worked through the T7 images and the definition of the picture elements card now.

Windscreen Heater: On, Charging

Auxiliary Climatisation: On, Charging Cable connected (not charging)

Doors unlocked

Windows open, Parking light on

Doors open

With State Icons and Alarm Indicator

[MatzzeF]

@SaschaWeicht Hey, would it be possiböe if you share your yaml and the images?

[SaschaWeicht]

@MatzzeF

type: picture-elements
image: /local/vw_t7/car_t7_car.png
elements:
  - type: image
    entity: binary_sensor.t7_hood_closed
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_bonnet_open.png
  - type: image
    entity: binary_sensor.t7_charging_cable_connected
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_charger_connected.png
  - type: image
    entity: switch.t7_charging
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_charging_on.png
  - type: image
    entity: binary_sensor.t7_door_closed_left_front
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/vw_t7/car_t7_door_ul_closed.png
      'on': /local/vw_t7/car_t7_door_ul_open.png
  - type: image
    entity: binary_sensor.t7_door_closed_right_front
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/vw_t7/car_t7_door_ur_closed.png
      'on': /local/vw_t7/car_t7_door_ur_open.png
  - type: image
    entity: binary_sensor.t7_door_closed_left_back
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/vw_t7/car_t7_door_ll_closed.png
      'on': /local/vw_t7/car_t7_door_ll_open.png
  - type: image
    entity: binary_sensor.t7_door_closed_right_back
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'off': /local/vw_t7/car_t7_door_lr_closed.png
      'on': /local/vw_t7/car_t7_door_lr_open.png
  - type: image
    entity: binary_sensor.t7_trunk_closed
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_trunk_open.png
  - type: image
    entity: binary_sensor.t7_window_closed_left_front
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_window_ul_open.png
  - type: image
    entity: binary_sensor.t7_window_closed_right_front
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_window_ur_open.png
  - type: image
    entity: binary_sensor.t7_window_closed_left_front
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_window_ll_open.png
  - type: image
    entity: binary_sensor.t7_window_closed_right_front
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_window_lr_open.png
  - type: image
    entity: switch.t7_window_heater
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_windscreen_heater_on.png
  - type: image
    entity: binary_sensor.t7_parking_light
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_p_lights_left_on.png
  - type: image
    entity: switch.t7_auxiliary_climatisation
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      'on': /local/vw_t7/car_t7_auxiliary_climatisation.png
  - type: image
    entity: lock.t7_door_locked
    image: /local/vw_t7/blank.png
    style:
      top: 72.3%
      left: 50.2%
      width: 4%
    state_image:
      locked: /local/vw_t7/blink.gif
  - type: image
    entity: lock.t7_door_locked
    image: /local/vw_t7/blank.png
    style:
      top: 50%
      left: 50%
      width: 100%
    state_image:
      unlocked: /local/vw_t7/car_t7_doors_unlocked.png
  - type: conditional
    conditions:
      - condition: and
        conditions:
          - condition: state
            entity: switch.t7_charging
            state: 'on'
          - condition: numeric_state
            entity: sensor.t7_battery_level
            above: 89.999
    elements:
      - type: state-icon
        entity: switch.t7_charging
        icon: mdi:battery-charging-high
        style:
          top: 94%
          left: 6%
  - type: conditional
    conditions:
      - condition: and
        conditions:
          - condition: state
            entity: switch.t7_charging
            state: 'on'
          - condition: numeric_state
            entity: sensor.t7_battery_level
            above: 59.999
            below: 90
    elements:
      - type: state-icon
        entity: switch.t7_charging
        icon: mdi:battery-charging-medium
        style:
          top: 94%
          left: 6%
  - type: conditional
    conditions:
      - condition: and
        conditions:
          - condition: state
            entity: switch.t7_charging
            state: 'on'
          - condition: numeric_state
            entity: sensor.t7_battery_level
            above: 29.999
            below: 60
    elements:
      - type: state-icon
        entity: switch.t7_charging
        icon: mdi:battery-charging-low
        style:
          top: 94%
          left: 6%
  - type: conditional
    conditions:
      - condition: and
        conditions:
          - condition: state
            entity: switch.t7_charging
            state: 'on'
          - condition: numeric_state
            entity: sensor.t7_battery_level
            below: 30
    elements:
      - type: state-icon
        entity: switch.t7_charging
        icon: mdi:battery-charging-outline
        style:
          top: 94%
          left: 6%
  - type: conditional
    conditions:
      - condition: and
        conditions:
          - condition: state
            entity: switch.t7_charging
            state: 'off'
          - condition: numeric_state
            entity: sensor.t7_battery_level
            above: 89.999
    elements:
      - type: state-icon
        entity: switch.t7_charging
        icon: mdi:battery-high
        style:
          top: 94%
          left: 6%
  - type: conditional
    conditions:
      - condition: and
        conditions:
          - condition: state
            entity: switch.t7_charging
            state: 'off'
          - condition: numeric_state
            entity: sensor.t7_battery_level
            above: 59.999
            below: 90
    elements:
      - type: state-icon
        entity: switch.t7_charging
        icon: mdi:battery-medium
        style:
          top: 94%
          left: 6%
  - type: conditional
    conditions:
      - condition: and
        conditions:
          - condition: state
            entity: switch.t7_charging
            state: 'off'
          - condition: numeric_state
            entity: sensor.t7_battery_level
            above: 29.999
            below: 60
    elements:
      - type: state-icon
        entity: switch.t7_charging
        icon: mdi:battery-low
        style:
          top: 94%
          left: 6%
  - type: conditional
    conditions:
      - condition: and
        conditions:
          - condition: state
            entity: switch.t7_charging
            state: 'off'
          - condition: numeric_state
            entity: sensor.t7_battery_level
            below: 30
    elements:
      - type: state-icon
        entity: switch.t7_charging
        icon: mdi:battery-outline
        style:
          top: 94%
          left: 6%
  - type: state-icon
    entity: lock.t7_door_locked
    style:
      top: 58%
      left: 6%
  - type: state-icon
    entity: switch.t7_window_heater
    hold_action: toggle
    style:
      top: 67%
      left: 6%
  - type: state-label
    entity: sensor.t7_battery_level
    style:
      top: 94%
      left: 16%
  - type: conditional
    conditions:
      - condition: and
        conditions:
          - condition: state
            entity: sensor.t7_charging_time_left
            state_not: unknown
    elements:
      - type: state-label
        entity: sensor.t7_charging_time_left
        style:
          top: 94%
          left: 29%
  - type: state-icon
    entity: sensor.t7_fuel_level
    style:
      top: 85%
      left: 6%
  - type: state-label
    entity: sensor.t7_fuel_level
    style:
      top: 85%
      left: 16%
  - type: state-icon
    entity: switch.t7_auxiliary_climatisation
    hold_action: toggle
    style:
      top: 76%
      left: 6%
  - type: state-label
    entity: sensor.t7_climatisation_target_temperature
    style:
      top: 76%
      left: 16%

car_t7.zip

[nicoferrett]

There is a mqtt client project that receives the car image.

https://github.com/tillsteinbach/WeConnect-mqtt

"You can enable ASCII Art pictures of the cars with --pictures

PNG vehicle images
If your client can deal with PNG-images received through MQTT you can set --picture-format png"

It works perfectly.
In HA I do this:

mqtt:
  image:
    - unique_id: 1234567890123d
      name: "VW image status"
      image_topic: "weconnect/vehicles/WVWZZZXXXXXXXXXXXX/pictures/status"
      content_type: image/png

Would it be possible to do the same thing here?