App:Library:LVGL:docs:Examples

提供: robot-jp wiki
2022年6月16日 (木) 13:43時点におけるTakashi (トーク | 投稿記録)による版
ナビゲーションに移動検索に移動

https://docs.lvgl.io/8.2/examples.html


Get started

英文 自動翻訳 Link
001 A button with a label and react on click event ラベルが付いたボタン

クリックイベントに反応します

LVGL docs example 001.png
002 Create styles from scratch for buttons ボタンのスタイルを最初から作成する LVGL docs example 002.png
003 Create a slider and write its value on a label LVGL docs example 003.png

Styles

英文 自動翻訳 Link
004 Size styles LVGL docs example 004.png
005 Background styles LVGL docs example 005.png
006 Border styles LVGL docs example 006.png
007 Outline styles LVGL docs example 007.png
008 Shadow styles LVGL docs example 008.png
009 Image styles LVGL docs example 009.png
010 Text styles LVGL docs example 010.png
011 Line styles LVGL docs example 011.png
012 Transition LVGL docs example 012.png
013 Using multiple styles LVGL docs example 013.png
014 Local styles LVGL docs example 014.png
016 Add styles to parts and states LVGL docs example 016.png
017 Extending the current theme LVGL docs example 017.png

Animations

英文 自動翻訳 Link
018

Start animation on an event

LVGL docs example 018.png
019 Playback animation LVGL docs example 019.png
020 Animation timeline LVGL docs example 020.png

Events

英文 自動翻訳 Link
021 Button click event LVGL docs example 021.png
022 Handle multiple events LVGL docs example 022.png
023 Event bubbling LVGL docs example 023.png

Layouts

英文 自動翻訳 Link
024 Flex LVGL docs example 024.png
025 Arrange items in rows with wrap and even spacing LVGL docs example 025.png
026 Demonstrate flex grow LVGL docs example 026.png
027 Demonstrate flex grow. LVGL docs example 027.png
028 Demonstrate column and row gap style properties LVGL docs example 028.png
029 RTL base direction changes order of the items LVGL docs example 029.png

Grid

英文 自動翻訳 Link
030 A simple grid LVGL docs example 030.png
031 Demonstrate cell placement and span LVGL docs example 031.png
032 Demonstrate grid's "free unit" LVGL docs example 032.png
033 Demonstrate track placement LVGL docs example 033.png
034 Demonstrate column and row gap LVGL docs example 034.png
035 Demonstrate RTL direction on grid LVGL docs example 035.png

Scrolling

英文 自動翻訳 Link
036 Nested scrolling LVGL docs example 036.png
037 Snapping LVGL docs example 037.png
038 Floating button LVGL docs example 038.png
039 Styling the scrollbars LVGL docs example 039.png
040 Right to left scrolling LVGL docs example 040.png
041 Translate on scroll LVGL docs example 041.png

Widgets

Base object

英文 自動翻訳 Link
042 Base objects with custom styles LVGL docs example 042.png
043 Make an object draggable LVGL docs example 043.png

Arc

英文 自動翻訳 Link
044 Simple Arc LVGL docs example 044.png
045 Loader with Arc LVGL docs example 045.png

Bar

英文 自動翻訳 Link
046 Simple Bar LVGL docs example 046.png
047 Styling a bar LVGL docs example 047.png
048 Temperature meter LVGL docs example 048.png
049 Stripe pattern and range value LVGL docs example 049.png
050 Bar with LTR and RTL base direction LVGL docs example 050.png
051 Custom drawer to show the current value LVGL docs example 051.png

Button

英文 自動翻訳 Link
052 Simple Buttons LVGL docs example 052.png
053 Styling buttons LVGL docs example 053.png
054 Gummy button LVGL docs example 054.png

Button matrix

英文 自動翻訳 Link
055 Simple Button matrix LVGL docs example 055.png
056 Custom buttons LVGL docs example 056.png
057 Pagination LVGL docs example 057.png

Calendar

英文 自動翻訳 Link
058 Calendar with header LVGL docs example 058.png

Canvas

英文 自動翻訳 Link
059 Drawing on the Canvas and rotate LVGL docs example 059.png
060 Transparent Canvas with chroma keying LVGL docs example 060.png

Chart

英文 自動翻訳 Link
061 Line Chart LVGL docs example 061.png
062 Faded area line chart with custom division lines LVGL docs example 062.png
063 Axis ticks and labels with scrolling LVGL docs example 063.png
064 Show the value of the pressed points LVGL docs example 064.png
065 Display 1000 data points with zooming and scrolling LVGL docs example 065.png
066 Show cursor on the clicked point LVGL docs example 066.png
067 Scatter chart LVGL docs example 067.png
068 Stacked area chart LVGL docs example 068.png

Checkbox

英文 自動翻訳 Link
069 Simple Checkboxes LVGL docs example 069.png
070 Checkboxes as radio buttons LVGL docs example 070.png

Colorwheel

英文 自動翻訳 Link
071 Simple Colorwheel LVGL docs example 071.png

Dropdown

英文 自動翻訳 Link
072 Simple Drop down list LVGL docs example 072.png
073 Drop down in four directions LVGL docs example 073.png
074 Menu LVGL docs example 074.png
075 Image LVGL docs example 075.png
076 Image recoloring LVGL docs example 076.png
077 Rotate and zoom LVGL docs example 077.png
078 Image offset and styling LVGL docs example 078.png

Image button

英文 自動翻訳 Link
079 Simple Image button LVGL docs example 079.png

Keyboard

英文 自動翻訳 Link
080 Keyboard with text area LVGL docs example 080.png

Label

英文 自動翻訳 Link
081 Line wrap, recoloring and scrolling LVGL docs example 081.png
082 Text shadow LVGL docs example 082.png
083 Show LTR, RTL and Chinese texts LVGL docs example 083.png
084 Draw label with gradient color LVGL docs example 084.png

LED

英文 自動翻訳 Link
085 LED with custom style LVGL docs example 085.png

Line

英文 自動翻訳 Link
086 Simple Line LVGL docs example 086.png

List

英文 自動翻訳 Link
087 Simple List LVGL docs example 087.png
088 Sorting a List using up and down buttons LVGL docs example 088.png

Menu

英文 自動翻訳 Link
089 Simple Menu LVGL docs example 089.png
090 Simple Menu with root btn LVGL docs example 090.png
091 Simple Menu with custom header LVGL docs example 091.png
092 Simple Menu with floating btn to add new menu page LVGL docs example 092.png
093 Complex Menu LVGL docs example 093.png
094 Simple meter LVGL docs example 094.png
095 A meter with multiple arcs LVGL docs example 095.png
096 A clock from a meter LVGL docs example 096.png
097 Pie chart LVGL docs example 097.png

Messqage box

英文 自動翻訳 Link
098 Simple Message box LVGL docs example 098.png

Roller

英文 自動翻訳 Link
099 Simple Roller LVGL docs example 099.png
100 Styling the roller LVGL docs example 100.png
101 add fade mask to roller LVGL docs example 101.png

Slider

英文 自動翻訳 Link
102 Simple Slider LVGL docs example 102.png
103 Slider with custom style LVGL docs example 103.png
104 Slider with extended drawer LVGL docs example 104.png

Span

英文 自動翻訳 Link
105 Span with custom styles LVGL docs example 105.png

Spinbox

英文 自動翻訳 Link
106 Simple Spinbox LVGL docs example 106.png

Spinner

英文 自動翻訳 Link
107 Simple spinner LVGL docs example 107.png

Switch

英文 自動翻訳 Link
108 Simple Switch LVGL docs example 108.png

Table

英文 自動翻訳 Link
109 Simple table LVGL docs example 109.png
110 Lightweighted list from table LVGL docs example 110.png

Tabview

英文 自動翻訳 Link
111 Simple Tabview LVGL docs example 111.png
112 Tabs on the left, styling and no scrolling LVGL docs example 112.png
113 Simple Text area LVGL docs example 113.png
114 Text area with password field LVGL docs example 114.png
115 Text auto-formatting LVGL docs example 115.png

Tabview

英文 自動翻訳 Link
116 Tileview with content LVGL docs example 116.png

Window

英文 自動翻訳 Link
117 Simple window LVGL docs example 117.png