[lvgl] option to enable LVGL's built-in dark theme (#15389)

esphome/components/lvgl/__init__.py

@@ -392,6 +392,9 @@ async def to_code(configs):
     } & styles_used:
         df.add_define("LV_COLOR_SCREEN_TRANSP", "1")
 
+    if configs[0].get(df.CONF_THEME, {}).get(df.CONF_DARK_MODE):
+        df.add_define("LV_THEME_DEFAULT_DARK", "1")
+
     # Currently always need RGB565 for the display buffer, and ARGB8888 is used for layer blending
     lv_image_formats = {"RGB565", "ARGB8888"}
     if {
@@ -459,8 +462,11 @@ def add_hello_world(config):
 def _theme_schema(value):
     return cv.Schema(
         {
-            cv.Optional(name): obj_schema(w).extend(FULL_STYLE_SCHEMA)
-            for name, w in WIDGET_TYPES.items()
+            cv.Optional(df.CONF_DARK_MODE, default=False): cv.boolean,
+            **{
+                cv.Optional(name): obj_schema(w).extend(FULL_STYLE_SCHEMA)
+                for name, w in WIDGET_TYPES.items()
+            },
         }
     )(value)
 

esphome/components/lvgl/defines.py

@@ -598,6 +598,7 @@ CONF_FLEX_ALIGN_CROSS = "flex_align_cross"
 CONF_FLEX_ALIGN_TRACK = "flex_align_track"
 CONF_FLEX_GROW = "flex_grow"
 CONF_FREEZE = "freeze"
+CONF_DARK_MODE = "dark_mode"
 CONF_FULL_REFRESH = "full_refresh"
 CONF_GRADIENTS = "gradients"
 CONF_GRID_CELL_ROW_POS = "grid_cell_row_pos"

esphome/components/lvgl/hello_world.yaml

@@ -3,7 +3,7 @@
 - obj:
     id: hello_world_card_
     pad_all: 12
-    bg_color: white
+    bg_opa: cover
     height: 100%
     width: 100%
     scrollable: false

esphome/components/lvgl/styles.py

@@ -7,7 +7,7 @@ from esphome.core import ID
 from .defines import CONF_STYLE_DEFINITIONS, CONF_THEME, LValidator, literal
 from .helpers import add_lv_use
 from .lvcode import LambdaContext, lv
-from .schemas import ALL_STYLES, FULL_STYLE_SCHEMA, remap_property
+from .schemas import ALL_STYLES, FULL_STYLE_SCHEMA, WIDGET_TYPES, remap_property
 from .types import ObjUpdateAction, lv_style_t
 from .widgets import collect_parts, theme_widget_map, wait_for_widgets
 
@@ -85,7 +85,7 @@ async def style_update_to_code(config, action_id, template_arg, args):
 async def theme_to_code(config):
     if theme := config.get(CONF_THEME):
         add_lv_use(CONF_THEME)
-        for w_name, style in theme.items():
+        for w_name, style in ((k, v) for k, v in theme.items() if k in WIDGET_TYPES):
             # Work around Python 3.10 bug with nested async comprehensions
             # With Python 3.11 this could be simplified
             # TODO: Now that we require Python 3.11+, this can be updated to use nested comprehensions

tests/components/lvgl/lvgl-package.yaml

@@ -49,6 +49,7 @@ lvgl:
           bg_color: 0x000000
           bg_opa: cover
   theme:
+    dark_mode: true
     obj:
       border_width: 1