LVGL Text Sensor replace text with icon

Hey
Got some problems with replacing a text sensor value with icons. A simple code works:

text_sensor:
  - platform: ld2420
    fw_version:
      name: LD2420 Firmware
  - platform: homeassistant
    id: outside_condition
    entity_id: sensor.openweathermap_condition
    filters:
      - to_upper
    
    on_value:
      - lvgl.label.update:
          id: outside_cond_disp
          text: !lambda |-
              
              return (id(outside_condition).state).c_str();

However, cannot figure out how to use lambdas and where to replace the value with an icon, like in “vanilla” ESPHome:

lambda: |-
      
      if (id(weather_state).has_state()) {
        std::map<std::string, std::string> weather_icon_map
          {
            {"clear-night", "\U000F0594"},
            
          };
        it.printf(0, it.get_height(), id(font4), TextAlign::BASELINE_LEFT, weather_icon_map[id(weather_state).state.c_str()].c_str());
      }

Anyone managed to replace with lambdas?

Ok, so I managed in a “roundabout” way to do it
I created a template sensor which is better to work with lambdas, each condition “if” is for every condition that openweather can throw:

text_sensor:
  - platform: ld2420
    fw_version:
      name: LD2420 Firmware

  - platform: homeassistant
    id: outside_condition_HA
    entity_id: sensor.openweathermap_condition
    

  - platform: template
    id: outside_condition
    lambda: |-
        if (id(outside_condition_HA).state == "cloudy") {
          return id(outside_condition).state = "\U000F0590";}
        else if (id(outside_condition_HA).state == "rainy") {
          return id(outside_condition).state = "\U000F0597"; 
        } else {
          return id(outside_condition).state = "Unknown";
        } 
    update_interval: 2s
    on_value:
      - lvgl.label.update:
          id: outside_cond_disp
          text:
            format: "%s"
            args: [ 'id(outside_condition).state.c_str()' ]

of course there is a section with fonts file in esphome/fonts directory uploaded, example a few glyphs:

font:
 
  - file: 'fonts/materialdesignicons-webfont.ttf' # http://materialdesignicons.com/cdn/7.4.47/ 
    id: weather70
    size: 50
    bpp: 4
    glyphs: &mdi-weather-glyphs
      - "\U000F0590" # mdi-weather-cloudy
      - "\U000F0F2F" # mdi-weather-cloudy-alert
1 Like

You might be able to do it a bit cleaner using a copy sensor and a map filter (instead of your template and lambda approach).

I tried map filter but constantly something was wrong, so I got p**ed off and just did the manual and longer way :slight_smile:

1 Like

I think possibly it is not so good at handling special characters.