Upstream/esphome-docs
1
0
Fork 0
mirror of https://github.com/esphome/esphome-docs.git synced 2025-01-12 20:10:50 +01:00
Code Issues Projects Releases Wiki Activity

Display: Add example how to use color (#1278)

Browse Source 
The docs mentioned only binary displays, but color works just fine.
This commit is contained in:
Frederik Gladhorn 2021-09-13 22:12:59 +02:00 committed by GitHub
parent 2d5ed91e52
commit b02a19d40d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 18 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
components/display/index.rst
View File

@ -89,8 +89,7 @@ and circles:
it.filled_circle(25, 25, 10);
All the above methods can optionally also be called with an argument at the end which specifies in which
color to draw. Currently, only ``COLOR_ON`` (the default if color is not given) and ``COLOR_OFF`` are supported because
ESPHome only has implemented binary displays.
color to draw. For monochrome displays, only ``COLOR_ON`` (the default if color is not given) and ``COLOR_OFF`` are supported.
.. code-block:: yaml
@ -109,6 +108,23 @@ ESPHome only has implemented binary displays.
// Turn off a whole display portion.
it.rectangle(50, 50, 30, 42, COLOR_OFF);
For color displays (e.g. TFT displays), you can use the Color class.
.. code-block:: yaml
display:
- platform: ...
# ...
lambda: |-
auto red = Color(255, 0, 0);
auto green = Color(0, 255, 0);
auto blue = Color(0, 0, 255);
auto white = Color(255, 255, 255);
it.rectangle(20, 50, 30, 30, white);
it.rectangle(25, 55, 30, 30, red);
it.rectangle(30, 60, 30, 30, green);
it.rectangle(35, 65, 30, 30, blue);
Additionally, you have access to two helper methods which will fetch the width and height of the display:
.. code-block:: yaml