Skip to content

Commit 1affbc9

Browse files
hlym123lbuque
hlym123
authored and
lbuque
committed
docs: Add Display API description.
Signed-off-by: hlym123 <[email protected]>
1 parent 45d53b0 commit 1affbc9

File tree

9 files changed

+2158
-710
lines changed

9 files changed

+2158
-710
lines changed

‎docs/en/hardware/display.rst‎

Lines changed: 805 additions & 296 deletions
Large diffs are not rendered by default.

‎docs/en/m5ui/index.rst‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,32 @@ M5UI is a UI library based on LVGL v9.3. It provides a set of widgets and functi
88

99
It has been adapted for M5Stack devices and you only need to call ``m5ui.init()`` to start using it.
1010

11+
M5 Series Display Libraries
12+
---------------------------
13+
14+
1. Display
15+
^^^^^^^^^^^
16+
- A low-level graphics library providing basic screen drawing, text, lines, and color management.
17+
- Can be used independently, suitable for scenarios that only require drawing graphics or text.
18+
19+
2. Widgets
20+
^^^^^^^^^^^
21+
- A basic UI widget library providing labels, image displays, and other UI controls.
22+
- Built on top of M5GFX.
23+
- Suitable for simple interactive UI elements.
24+
25+
3. M5UI
26+
^^^^^^^^
27+
- A high-level UI framework based on LVGL.
28+
- Provides page management, multi-widget layouts, and unified event handling.
29+
30+
Usage Tips
31+
^^^^^^^^^^
32+
- ⚠️ Do not mix M5GFX, M5Widgets, and M5UI simultaneously, as it may cause rendering issues or event conflicts.
33+
- For graphics-only drawing → use M5GFX.
34+
- For simple interactive widgets → use M5Widgets.
35+
- For multi-page UI → use M5UI.
36+
1137

1238
Functions
1339
---------

‎docs/en/refs/hardware.display.ref‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
.. |cores3_draw_test_example.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/example.png
2+
3+
.. |width.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/width.png
4+
.. |height.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/height.png
5+
.. |getRotation.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/getRotation.png
6+
.. |getColorDepth.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/getColorDepth.png
7+
.. |getCursor.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/getCursor.png
8+
.. |setRotation.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/setRotation.png
9+
.. |setColorDepth.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/setColorDepth.png
10+
.. |setEpdMode.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/setEpdMode.png
11+
.. |isEPD.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/isEPD.png
12+
.. |setFont.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/setFont.png
13+
.. |setTextColor.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/setTextColor.png
14+
.. |setTextScroll.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/setTextScroll.png
15+
.. |setTextSize.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/setTextSize.png
16+
.. |setCursor.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/setCursor.png
17+
.. |clear.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/clear.png
18+
.. |fillScreen.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/fillScreen.png
19+
.. |drawPixel.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawPixel.png
20+
.. |drawCircle.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawCircle.png
21+
.. |fillCircle.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/fillCircle.png
22+
.. |drawEllipse.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawEllipse.png
23+
.. |fillEllipse.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/fillEllipse.png
24+
.. |drawLine.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawLine.png
25+
.. |drawRect.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawRect.png
26+
.. |fillRect.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/fillRect.png
27+
.. |drawRoundRect.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawRoundRect.png
28+
.. |fillRoundRect.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/fillRoundRect.png
29+
.. |drawTriangle.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawTriangle.png
30+
.. |fillTriangle.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/fillTriangle.png
31+
.. |drawArc.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawArc.png
32+
.. |fillArc.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/fillArc.png
33+
.. |drawEllipseArc.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawEllipseArc.png
34+
.. |fillEllipseArc.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/fillEllipseArc.png
35+
.. |drawQR.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawQR.png
36+
.. |drawPng.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawPng.png
37+
.. |drawJpg.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawJpg.png
38+
.. |drawBmp.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawBmp.png
39+
.. |drawImage.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawImage.png
40+
.. |drawRawBuf.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/drawRawBuf.png
41+
.. |print.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/print.png
42+
.. |printf.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/printf.png
43+
.. |newCanvas.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/newCanvas.png
44+
.. |startWrite.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/startWrite.png
45+
.. |endWrite.png| image:: https://static-cdn.m5stack.com/mpy_docs/lcd/endWrite.png
46+
47+
.. |cores3_draw_test_example.m5f2| raw:: html
48+
49+
<a
50+
href="https://uiflow2.m5stack.com/?example=https://raw.githubusercontent.com/m5stack/uiflow-micropython/develop/examples/lcd/cores3_draw_test_example.m5f2"
51+
target="_blank"
52+
>
53+
cores3_draw_test_example.m5f2
54+
</a>

‎docs/en/widgets/index.rst‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,32 @@
66

77
.. include:: ../refs/widgets.ref
88

9+
M5 Series Display Libraries
10+
---------------------------
11+
12+
1. Display
13+
^^^^^^^^^^^
14+
- A low-level graphics library providing basic screen drawing, text, lines, and color management.
15+
- Can be used independently, suitable for scenarios that only require drawing graphics or text.
16+
17+
2. M5Widgets
18+
^^^^^^^^^^^^^
19+
- A basic UI widget library providing labels, image displays, and other UI controls.
20+
- Built on top of M5GFX.
21+
- Suitable for simple interactive UI elements.
22+
23+
3. M5UI
24+
^^^^^^^^
25+
- A high-level UI framework based on LVGL.
26+
- Provides page management, multi-widget layouts, and unified event handling.
27+
28+
Usage Tips
29+
^^^^^^^^^^
30+
- ⚠️ Do not mix M5GFX, M5Widgets, and M5UI simultaneously, as it may cause rendering issues or event conflicts.
31+
- For graphics-only drawing → use M5GFX.
32+
- For simple interactive widgets → use M5Widgets.
33+
- For multi-page UI → use M5UI.
34+
935
Micropython Example:
1036

1137
.. literalinclude:: ../../../examples/widgets/screen/cores3_widgets_example.py

0 commit comments

Comments
 (0)