[lvgl] Fix: allow full range of styles on dropdown list. (#7552)

esphome/components/lvgl/lv_validation.py

@@ -242,6 +242,8 @@ def pixels_or_percent_validator(value):
     """A length in one axis - either a number (pixels) or a percentage"""
     if value == SCHEMA_EXTRACT:
         return ["pixels", "..%"]
+    if isinstance(value, str) and value.lower().endswith("px"):
+        value = cv.int_(value[:-2])
     value = cv.Any(cv.int_, cv.percentage)(value)
     if isinstance(value, int):
         return value

esphome/components/lvgl/widgets/dropdown.py

@@ -6,6 +6,8 @@ from ..defines import (
     CONF_DIR,
     CONF_INDICATOR,
     CONF_MAIN,
+    CONF_SCROLLBAR,
+    CONF_SELECTED,
     CONF_SELECTED_INDEX,
     CONF_SYMBOL,
     DIRECTIONS,
@@ -23,7 +25,9 @@ CONF_DROPDOWN_LIST = "dropdown_list"
 
 lv_dropdown_t = LvSelect("lv_dropdown_t")
 lv_dropdown_list_t = LvType("lv_dropdown_list_t")
-dropdown_list_spec = WidgetType(CONF_DROPDOWN_LIST, lv_dropdown_list_t, (CONF_MAIN,))
+dropdown_list_spec = WidgetType(
+    CONF_DROPDOWN_LIST, lv_dropdown_list_t, (CONF_MAIN, CONF_SELECTED, CONF_SCROLLBAR)
+)
 
 DROPDOWN_BASE_SCHEMA = cv.Schema(
     {

esphome/components/lvgl/widgets/meter.py

@@ -309,6 +309,6 @@ async def set_indicator_values(meter, indicator, config):
             lv.meter_set_indicator_start_value(meter, indicator, start_value)
     if end_value is not None:
         lv.meter_set_indicator_end_value(meter, indicator, end_value)
-    if opa := config.get(CONF_OPA):
+    if (opa := config.get(CONF_OPA)) is not None:
         lv_assign(indicator.opa, await opacity.process(opa))
         lv_obj.invalidate(meter)

tests/components/lvgl/lvgl-package.yaml

@@ -1,3 +1,16 @@
+substitutions:
+  light_recessed: "\U000F179B"
+  wall_sconce_round: "\U000F0748"
+  gas_burner: "\U000F1A1B"
+  home_icon: "\U000F02DC"
+  menu_left: "\U000F0A02"
+  menu_right: "\U000F035F"
+  close: "\U000F0156"
+  delete: "\U000F01B4"
+  backspace: "\U000F006E"
+  check: "\U000F012C"
+  arrow_down: "\U000F004B"
+
 lvgl:
   log_level: TRACE
   bg_color: light_blue
@@ -599,6 +612,42 @@ lvgl:
               - name: Cat
                 id: tabview_tab_2
                 widgets:
+                  - dropdown:
+                      indicator:
+                        text_font: helvetica20
+                      id: lv_dropdown
+                      options:
+                        - First
+                        - Second
+                        - Third
+                        - 4th
+                        - 5th
+                        - 6th
+                        - 7th
+                        - 8th
+                        - 9th
+                      selected_index: 2
+                      dir: top
+                      symbol: ${arrow_down}
+                      dropdown_list:
+                        max_height: 100px
+                        bg_color: 0x000080
+                        text_color: 0xFF00
+                        selected:
+                          bg_color: 0xFFFF00
+                          checked:
+                            bg_color: 0x00
+                            text_color: 0xFF0000
+                        scrollbar:
+                          bg_color: 0xFF
+                      on_value:
+                        logger.log:
+                          format: "Dropdown changed = %d"
+                          args: [x]
+                      on_cancel:
+                        logger.log:
+                          format: "Dropdown closed = %d"
+                          args: [x]
                   - image:
                       src: cat_image
                       on_click:
@@ -659,6 +708,7 @@ lvgl:
                                 width: 4
                                 color: 0xA0A0A0
                                 r_mod: -20
+                                opa: 0%
 
 font:
   - file: "gfonts://Roboto"