Initial LVGL doc for ESPHome

components/binary_sensor/lvgl.rst

@@ -0,0 +1,43 @@
+
+.. _lvgl-binary-sensor:
+
+
+LVGL Binary Sensor
+==================
+
+.. seo::
+    :description: Instructions for setting up an LVGL widget binary sensor.
+    :image: ../images/lvgl_c_bns.png
+
+The ``lvgl`` binary sensor platform creates a binary sensor from an LVGL widget
+and requires :ref:`LVGL <lvgl-main>` to be configured.
+
+Supported widget is :ref:`lvgl-widget-button`. A single binary sensor supports only a single widget; in other words, it's not possible to have multiple widgets associated with a single ESPHome binary sensor component.
+
+Configuration variables:
+------------------------
+
+- **widget** (**Required**): The ID of a supported widget configured in LVGL, which will reflect the state of the binary sensor.
+- All other variables from :ref:`Binary Sensor <config-binary_sensor>`.
+
+Example:
+
+.. code-block:: yaml
+
+    binary_sensor:
+      - platform: lvgl
+        widget: btn_id
+        name: LVGL push button
+
+See Also
+--------
+- :ref:`LVGL Main component <lvgl-main>`
+- :ref:`Button widget <lvgl-widget-button>`
+- :doc:`/components/sensor/lvgl`
+- :doc:`/components/number/lvgl`
+- :doc:`/components/switch/lvgl`
+- :doc:`/components/select/lvgl`
+- :doc:`/components/light/lvgl`
+- :doc:`/components/text/lvgl`
+- :doc:`/components/text_sensor/lvgl`
+- :ghedit:`Edit`

components/display/index.rst

@@ -8,14 +8,25 @@ Display Component
 The ``display`` component houses ESPHome's powerful rendering and display
 engine. Fundamentally, there are these types of displays:
 
-- Text based displays like :doc:`7-Segment displays <max7219>` or
+- Character displays like :doc:`7-Segment displays <max7219>` or
   :doc:`LCD displays <lcd_display>`.
-- Graphical serial displays like :doc:`nextion` that have their own processors for rendering.
+- Serial displays like :doc:`nextion` that have their own processors for graphics rendering.
 - Graphical binary displays which can toggle ON/OFF any pixel, like :doc:`E-Paper <waveshare_epaper>`,
+
   :doc:`OLED <ssd1306>` or :doc:`TFT <ili9xxx>` displays.
 
-For the last type, ESPHome has a powerful rendering engine that can do
-many things like draw some basic shapes, print text with any font you want, or even show images.
+For graphical displays, which offer the greatest flexibility, there are two options: 
+
+- ESPHome's :ref:`own rendering engine <display-engine>`
+- :ref:`LVGL <lvgl-main>` - Light and Versatile Graphics Library
+
+.. _display-engine:
+
+Display Rendering Engine
+------------------------
+
+ESPHome's own powerful rendering engine can handle many common tasks such as drawing basic shapes,
+printing text with fonts of your choice, or even rendering images.
 
 To achieve all this flexibility displays tie in directly into ESPHome's :ref:`lambda system <config-lambda>`.
 So when you want to write some text or sensor values to the screen you will be writing in C++ code
@@ -24,11 +35,6 @@ using an API that is designed to
 - be simple and to be used without programming experience
 - but also be flexible enough to work with more complex tasks like displaying an analog clock.
 
-.. _display-engine:
-
-Display Rendering Engine
-------------------------
-
 In this section we will be discussing how to use ESPHome's display rendering engine from ESPHome
 and some basic commands. Please note that this only applies to displays that can control each pixel
 individually.
@@ -605,6 +611,7 @@ See Also
 --------
 
 - :apiref:`display/display_buffer.h`
+- :ref:`LVGL <lvgl-main>`
 - :ref:`Fonts <display-fonts>`
 - :ref:`Graph Component <display-graphs>`
 - :ref:`QR Code Component <display-qrcode>`

components/font.rst

@@ -9,7 +9,7 @@ Font Renderer Component
 
 ESPHome's graphical rendering engine also has a powerful font drawer which integrates seamlessly into the system. You have the option to use **any** OpenType/TrueType (``.ttf``, ``.otf``, ``.woff``) font file at **any** size, as well as fixed-size `PCF <https://en.wikipedia.org/wiki/Portable_Compiled_Format>`_ and `BDF <https://en.wikipedia.org/wiki/Glyph_Bitmap_Distribution_Format>`_ bitmap fonts.
 
-These fonts can be used in ESPHome's :ref:`own rendering engine <display-engine>`.
+These fonts can be used in ESPHome's :ref:`own rendering engine <display-engine>` or in the :ref:`LVGL Graphics <lvgl-main>` component.
 
 To use fonts you can either
  - Just grab a ``.ttf``, ``.otf``, ``.woff``, ``.pcf``, or ``.bdf`` file from somewhere on the internet and place it, for example, inside a ``fonts`` folder next to your configuration file.
@@ -83,6 +83,7 @@ Next, create a ``font:`` section in your configuration:
     display:
       # ...
 
+
 Configuration variables:
 ------------------------
 
@@ -155,6 +156,7 @@ See Also
 
 - :apiref:`display/display_buffer.h`
 - :ref:`display-engine`
+- :ref:`lvgl-main`
 - `MDI cheatsheet <https://pictogrammers.com/library/mdi/>`_
 - `MDI font repository <https://github.com/Pictogrammers/pictogrammers.github.io/tree/main/%40mdi/font/>`_
 - :ghedit:`Edit`

components/index.rst

@@ -26,6 +26,7 @@ Components
     touchscreen/index
     lock/index
     display_menu/index
+    lvgl/index
     media_player/index
     microphone/index
     speaker/index

components/key_collector.rst

@@ -6,12 +6,12 @@ Key collector component
 .. seo::
     :description: Key collector component
 
-The ``key_collector`` component collects key presses from
-components like :ref:`matrix_keypad` or ``wiegand``. It allows you to process
-key sequences and treat them as one, for example to allow inputting of 
-a PIN code or a passkey. The component outputs the result of the keypress
-sequence as a variable usable in automations.
-
+The ``key_collector`` component collects key presses from components 
+like :ref:`matrix_keypad`, :ref:`Wiegand keypad <wiegand>`
+or LVGL :ref:`Button Matrix <lvgl-widget-buttonmatrix>`, :ref:`Keyboard <lvgl-widget-keyboard>`
+widgets. It allows you to process key sequences and treat them as one, for
+example to allow inputting of a PIN code or a passkey. The component outputs
+the result of the keypress sequence as a variable usable in automations.
 
 Component
 ---------
@@ -43,8 +43,6 @@ Component
               format: "input timeout: '%s', started by '%c'"
               args: [ 'x.c_str()', "(start == 0 ? '~' : start)" ]
 
-
-
 Configuration variables:
 
 - **id** (*Optional*, :ref:`config-id`): Set the ID of this entry for use in lambdas.
@@ -92,7 +90,7 @@ See Also
 --------
 
 - :doc:`/components/matrix_keypad`
-
-.. - :doc:`/components/wiegand`
-
+- :doc:`/components/wiegand`
+- :ref:`LVGL Button Matrix widget <lvgl-widget-buttonmatrix>`
+- :ref:`LVGL Keyboard widget <lvgl-widget-keyboard>`
 - :ghedit:`Edit`

components/light/lvgl.rst

@@ -0,0 +1,46 @@
+.. _lvgl-light:
+
+LVGL Light
+==========
+
+.. seo::
+    :description: Instructions for setting up an LVGL widget light.
+    :image: ../images/lvgl_c_lig.png
+
+The ``lvgl`` light platform creates a light from an LVGL widget
+and requires :ref:`LVGL <lvgl-main>` to be configured.
+
+Supported widget is :ref:`lvgl-widget-led`. A single light supports only a single widget; in other words, it's not possible to have multiple widgets associated with a single ESPHome light component.
+
+Configuration variables:
+------------------------
+
+- **widget** (**Required**): The ID of a ``led`` widget configured in LVGL, which will reflect the state of the light.
+- All other options from :ref:`light <config-light>`.
+
+
+Example:
+
+.. code-block:: yaml
+
+    light:
+      - platform: lvgl
+        widget: led_id
+        name: LVGL light
+
+.. note::
+
+    To have linear brightness control, ``gamma_correct`` of the light is set by default to ``0``.
+
+See Also
+--------
+- :ref:`LVGL Main component <lvgl-main>`
+- :ref:`LED widget <lvgl-widget-led>`
+- :doc:`/components/binary_sensor/lvgl`
+- :doc:`/components/sensor/lvgl`
+- :doc:`/components/number/lvgl`
+- :doc:`/components/switch/lvgl`
+- :doc:`/components/select/lvgl`
+- :doc:`/components/text/lvgl`
+- :doc:`/components/text_sensor/lvgl`
+- :ghedit:`Edit`