「App:Library:LVGL:docs:Porting:Set up a project」の版間の差分

提供: robot-jp wiki
ナビゲーションに移動検索に移動
 
(同じ利用者による、間の14版が非表示)
1行目: 1行目:
 
https://docs.lvgl.io/8.2/porting/project.html
 
https://docs.lvgl.io/8.2/porting/project.html
 
__NOTOC__
 
__NOTOC__
== Set up a project ==
+
= Set up a project =
=== Get the library ===
+
== Get the library ==
 
:{| class="wikitable"
 
:{| class="wikitable"
 
!英文
 
!英文
8行目: 8行目:
 
|-
 
|-
 
|
 
|
LVGL is available on GitHub: <nowiki>https://github.com/lvgl/lvgl</nowiki>.
+
LVGL is available on GitHub: https://github.com/lvgl/lvgl.
  
 
You can clone it or Download the latest version of the library from GitHub.
 
You can clone it or Download the latest version of the library from GitHub.
|LVGLはGitHubで入手できます:https://github.com/lvgl/lvgl
+
 
 +
The graphics library is the lvgl directory which should be copied into your project.
 +
|LVGLはGitHubで入手できます:https://github.com/lvgl/lvgl
  
 
クローンするか、GitHubから最新版のライブラリをダウンロードして下さい。
 
クローンするか、GitHubから最新版のライブラリをダウンロードして下さい。
|}
 
:[[App:Library:LVGL:docs:Porting|戻る : Previous]]
 
 
 
=== Add lvgl to your project ===
 
:{| class="wikitable"
 
!英文
 
!自動翻訳
 
|-
 
|
 
The graphics library itself is the <code>'''lvgl'''</code> directory.
 
 
It contains a couple of folders but to use <code>'''lvgl'''</code> you only need <code>'''.c'''</code> and <code>'''.h'''</code> files from the <code>'''src'''</code> folder.
 
|グラフィックライブラリ自体は <code>'''lvgl'''</code>ディレクトリです。
 
いくつかのフォルダがありますが、<code>'''lvgl'''</code> を使うには <code>'''src'''</code> フォルダにある <code>'''.c'''</code> と <code>'''.h'''</code>  のファイルだけが必要です。
 
|}
 
:[[App:Library:LVGL:docs:Porting|戻る : Previous]]
 
 
 
==== Automatically add files ====
 
:{| class="wikitable"
 
!英文
 
!自動翻訳
 
|-
 
|
 
If your IDE automatically adds the files from the folders copied to the project folder (as Eclipse or VSCode does), you can simply copy the <code>'''lvgl'''</code> folder as it is into your project.
 
|EclipseやVSCodeのように、IDEが自動的にプロジェクトフォルダにコピーされたフォルダのファイルを追加する場合は、 <code>'''lvgl'''</code> フォルダをそのままプロジェクトにコピーすればOKです。
 
|}
 
:[[App:Library:LVGL:docs:Porting|戻る : Previous]]
 
 
 
==== Make and CMake ====
 
:{| class="wikitable"
 
!英文
 
!自動翻訳
 
|-
 
|
 
LVGL also supports <code>'''make'''</code> and <code>'''CMake'''</code> build systems out of the box. To add LVGL to your Makefile based build system add these lines to your main Makefile:
 
LVGL_DIR_NAME ?= lvgl    #The name of the lvgl folder (change this if you have renamed it)
 
LVGL_DIR ?= ${shell pwd}  #The path where the lvgl folder is
 
include $(LVGL_DIR)/$(LVGL_DIR_NAME)/lvgl.mk
 
For integration with CMake take a look this section of the Documentation.
 
|LVGLは、 <code>'''make'''</code>と<code>'''CMake'''</code> のビルドシステムもサポートしています。
 
MakefileベースのビルドシステムにLVGLを追加するには、以下の行をメインのMakefileに追加してください。
 
LVGL_DIR_NAME?= lvgl#lvglフォルダーの名前(名前を変更した場合はこれを変更してください)
 
LVGL_DIR?= $ {shell pwd}#lvglフォルダーがあるパス
 
$(LVGL_DIR)/ $(LVGL_DIR_NAME)/lvgl.mkを含める
 
CMakeとの統合については、ドキュメントのこのセクションを参照してください。
 
|}
 
:[[App:Library:LVGL:docs:Porting|戻る : Previous]]
 
 
 
==== Other platforms and tools ====
 
:{| class="wikitable"
 
!英文
 
!自動翻訳
 
|-
 
|
 
The Get started section contains many platform specific descriptions e.g. for ESP32, Arduino, NXP, RT-Thread, NuttX, etc.
 
|[はじめに]セクションには、ESP32、Arduino、NXP、RT-Thread、NuttXなどのプラットフォーム固有の説明が多数含まれています。
 
|}
 
:[[App:Library:LVGL:docs:Porting|戻る : Previous]]
 
  
==== Demos and Examples ====
+
グラフィック ライブラリは、プロジェクトにコピーする必要がある lvgl ディレクトリです。
:{| class="wikitable"
 
!英文
 
!自動翻訳
 
|-
 
|
 
The <code>lvgl</code> folder also contains an <code>examples</code> and a <code>demos</code> folder. If you needed to add the source files manually to your project, you can do the same with the source files of these two folders too. <code>make</code> and <code>CMake</code> handles the examples and demos, so no extra action required in these cases.
 
|このフォルダには、と<code>lvgl</code>フォルダも含まれています。プロジェクトにソースファイルを手動で追加する必要がある場合は、これら2つのフォルダーのソースファイルでも同じことができます。例とデモを処理するため、これらの場合に追加のアクションは必要ありません。 <code>examplesdemosmakeCMake</code>
 
 
|}
 
|}
:[[App:Library:LVGL:docs:Porting|戻る : Previous]]
+
:[[App:Library:LVGL:docs:Porting#Set up a project|戻る : Previous]]
  
  
=== Configuration file ===
+
== Configuration file ==
 
:{| class="wikitable"
 
:{| class="wikitable"
 
!英文
 
!英文
97行目: 30行目:
 
There is a configuration header file for LVGL called '''lv_conf.h'''.  
 
There is a configuration header file for LVGL called '''lv_conf.h'''.  
  
You modify this header to set the library's basic behavior, disable unused modules and features, adjust the size of memory buffers in compile-time, etc.
+
It sets the library's basic behaviour, disables unused modules and features, adjusts the size of memory buffers in compile-time, etc.
 
 
To get <code>'''lv_conf.h'''</code> copy '''lvgl/lv_conf_template.h''' next to the <code>'''lvgl'''</code> directory and rename it to '''''lv_conf.h'''''.
 
 
 
Open the file and change the <code>'''#if 0'''</code> at the beginning to <code>'''#if 1'''</code> to enable its content. So the layout of the files should look like this:
 
<source lang="C++">
 
|-lvgl
 
|-lv_conf.h
 
|-other files and folders
 
</source>
 
Comments in the config file explain the meaning of the options. Be sure to set at least <code>'''LV_COLOR_DEPTH'''</code> according to your display's color depth. Note that, the examples and demos explicitly need to be enabled in <code>'''lv_conf.h'''</code>.
 
 
 
 
 
Alternatively, <code>'''lv_conf.h'''</code> can be copied to another place but then you should add the <code>'''LV_CONF_INCLUDE_SIMPLE'''</code> define to your compiler options (e.g. <code>'''-DLV_CONF_INCLUDE_SIMPLE'''</code> for GCC compiler) and set the include path manually (e.g. <code>'''-I../include/gui'''</code>). In this case LVGL will attempt to include <code>'''lv_conf.h'''</code> simply with <code>'''#include "lv_conf.h"'''</code>.
 
 
 
 
 
You can even use a different name for <code>'''lv_conf.h'''</code>.
 
 
 
The custom path can be set via the <code>'''LV_CONF_PATH'''</code> define.
 
 
 
For example <code>'''-DLV_CONF_PATH="/home/joe/my_project/my_custom_conf.h"'''</code>
 
 
 
 
 
If <code>'''LV_CONF_SKIP'''</code> is defined, LVGL will not try to include <code>'''lv_conf.h'''</code>.
 
 
 
Instead you can pass the config defines using build options.
 
  
For example <code>'''"-DLV_COLOR_DEPTH=32 -DLV_USE_BTN 1"'''</code>.  
+
Copy '''lvgl/lv_conf_template.h''' next to the <code style="color: #bb0000;">'''lvgl'''</code> directory and rename it to '''''lv_conf.h'''''.  
  
The unset options will get a default value which is the same as the ones in <code>'''lv_conf_template.h'''</code>.
+
Open the file and change the <code style="color: #bb0000;">'''#if 0'''</code> at the beginning to <code style="color: #bb0000;">'''#if 1'''</code> to enable its content.  
  
  
LVGL also can be used via <code>'''Kconfig'''</code> and <code>'''menuconfig'''</code>.  
+
<code style="color: #bb0000;">'''lv_conf.h'''</code> can be copied to another place as well but then you should  add the <code style="color: #bb0000;">'''LV_CONF_INCLUDE_SIMPLE'''</code> define to your compiler options (e.g. <code style="color: #bb0000;">'''-DLV_CONF_INCLUDE_SIMPLE'''</code> for GCC compiler) and set the include path manually.
 +
 +
In the config file comments explain the meaning of the options.
  
You can use <code>'''lv_conf.h'''</code> together with Kconfig, but keep in mind that the value from <code>'''lv_conf.h'''</code> or build settings (<code>'''-D...'''</code>) overwrite the values set in Kconfig.
+
Check at least these three configuration options and modify them according to your hardware:
  
To ignore the configs from <code>'''lv_conf.h'''</code> simply remove its content, or define <code>'''LV_CONF_SKIP'''</code>.
+
# '''LV_HOR_RES_MAX''' Your display's horizontal resolution.
 +
# '''LV_VER_RES_MAX''' Your display's vertical resolution.
 +
# '''LV_COLOR_DEPTH''' 8 for (RG332), 16 for (RGB565) or 32 for (RGB888 and ARGB8888).
 
|LVGLには、'''lv_conf.h''' という設定用のヘッダファイルがあります。
 
|LVGLには、'''lv_conf.h''' という設定用のヘッダファイルがあります。
このヘッダを修正して、ライブラリの基本動作の設定、未使用のモジュールや機能の無効化、コンパイル時のメモリバッファのサイズ調整などを行います。
+
ライブラリの基本的な動作を設定し、未使用のモジュールと機能を無効にし、コンパイル時のメモリ バッファのサイズを調整します。
 
 
<code>'''lv_conf.h'''</code> を入手するには、'''lvgl/lv_conf_template.h'''を<code>'''lvgl'''</code>ディレクトリの隣にコピーし、'''''lv_conf.h''''' にリネームしてください。
 
 
 
このファイルを開き、冒頭の <code>'''#if 0'''</code> を <code>'''#if 1'''</code> に変更し、内容を有効にして下さい。
 
 
 
そうする事により、ファイルのレイアウトは次のようになります。<source lang="c++">
 
| -lvgl
 
| -lv_conf.h
 
|-他の ファイル と フォルダ
 
</source>
 
 
 
設定ファイル内のコメントでオプションの意味を説明しています。少なくとも<code>'''LV_COLOR_DEPTH'''</code>は、ディスプレイの色深度に合わせて設定してください。なお、<code>'''lv_conf.h'''</code>では、例題やデモを明示的に有効化する必要があります。
 
 
 
 
 
また,<code>'''LV_CONF_INCLUDE_SIMPLE'''</code>をコンパイラのオプションに追加し例:GCCコンパイラでは<code>'''-DLV_CONF_INCLUDE_SIMPLE'''</code>),インクルードパスを手動設定(例:<code>'''-I../include/gui'''</code>)してください。
 
 
 
この場合,LVGLは <code>'''lv_conf.h'''</code> を単に<code>'''#include"lv_conf.h"'''</code>でインクルードしようとします.
 
 
 
 
 
<code>'''lv_conf.h'''</code> を別の名前にすることもできます。
 
  
カスタムパスは <code>'''LV_CONF_PATH'''</code> の定義で設定することができます。
 
  
例えば、 <code>'''-DLV_CONF_PATH="/home/joe/my_project/my_custom_conf.h"'''</code>
+
'''lvgl/lv_conf_template.h'''を<code style="color: #bb0000;">'''lvgl'''</code>ディレクトリの隣にコピーし、'''''lv_conf.h''''' にリネームしてください。
  
 +
このファイルを開き、冒頭の <code style="color: #bb0000;">'''#if 0'''</code> を <code style="color: #bb0000;">'''#if 1'''</code> に変更し、内容を有効にして下さい。
  
<code>'''LV_CONF_SKIP'''</code>が定義されていると、LVGLは<code>'''lv_conf.h'''</code>をincludeしようとしません。
+
そうする事により、ファイルのレイアウトは次のようになります。
  
その代わり、ビルドオプションを使用して設定定義を渡すことができます。
 
  
たとえば<code>'''"-DLV_COLOR_DEPTH=32-DLV_USE_BTN 1"'''</code>
+
<code style="color: #bb0000;">'''lv_conf.h'''</code> を別の場所にコピーすることもできますが、定義<code style="color: #bb0000;">'''LV_CONF_INCLUDE_SIMPLE'''</code>をコンパイラ オプション (GCC コンパイラの場合は<code style="color: #bb0000;">'''-DLV_CONF_INCLUDE_SIMPLE'''</code>など) に追加し、インクルード パスを手動で設定する必要があります。
  
設定されていないオプションは、<code>'''lv_conf_template.h'''</code> にあるのと同じデフォルト値が取得されます。
 
  
 +
configファイルのコメントでは、オプションの意味が説明されています。
  
LVGLを <code>'''Kconfig'''</code>と<code>'''menuconfig'''</code>を通して使うこともできます。
+
少なくとも次の 3 つの構成オプションを確認し、ハードウェアに応じて変更します。
  
あなたはKconfigと共に<code>'''lv_conf.h'''</code>を使うことができますが、、Kconfigの中の値を、<code>'''lv_conf.h'''</code>からの値または、build settings(<code>'''-D...'''</code>)で上書きする事を忘れてはいけません。<code>'''lv_conf.h'''</code>からの config を無視するために、単にその内容を除去するか、又は <code>'''LV_CONF_SKIP'''</code>を定義してください。
+
* '''LV_HOR_RES_MAX''' ディスプレイの水平解像度。
 +
* '''LV_VER_RES_MAX''' ディスプレイの垂直解像度。
 +
* '''LV_COLOR_DEPTH''' (RG332) の場合は 8、(RGB565) の場合は 16、(RGB888 および ARGB8888) の場合は 32。
 
|}
 
|}
  
:[[App:Library:LVGL:docs:Porting|戻る : Previous]]
+
:[[App:Library:LVGL:docs:Porting#Set up a project|戻る : Previous]]
  
=== Initialization ===
+
== Initialization ==
 
:{| class="wikitable"
 
:{| class="wikitable"
 
!英文
 
!英文
188行目: 81行目:
 
The order of the initialization is:
 
The order of the initialization is:
  
# Call <code>'''lv_init()'''</code>.
+
# Call <code style="color: #bb0000;">'''lv_init()'''</code>.
 
# Initialize your drivers.
 
# Initialize your drivers.
 
# Register the display and input devices drivers in LVGL. Learn more about Display and Input device registration.
 
# Register the display and input devices drivers in LVGL. Learn more about Display and Input device registration.
# Call <code>'''lv_tick_inc(x)'''</code> every <code>'''x'''</code> milliseconds in an interrupt to report the elapsed time to LVGL. Learn more.
+
# Call <code style="color: #bb0000;">'''lv_tick_inc(x)'''</code> every <code style="color: #bb0000;">'''x'''</code> milliseconds in an interrupt to report the elapsed time to LVGL. Learn more.
# Call <code>'''lv_timer_handler()'''</code> every few milliseconds to handle LVGL related tasks. Learn more.
+
# Call <code style="color: #bb0000;">'''lv_timer_handler()'''</code> every few milliseconds to handle LVGL related tasks. [https://docs.lvgl.io/latest/en/html/porting/task-handler.html <u>Learn more</u>].
 
|
 
|
 
グラフィックライブラリを使用するには、初期化および必要なコンポーネントのセットアップを行う必要があります。
 
グラフィックライブラリを使用するには、初期化および必要なコンポーネントのセットアップを行う必要があります。
198行目: 91行目:
 
初期化の順序は次の通りです。
 
初期化の順序は次の通りです。
  
#<code>'''lv_init()'''</code> を呼び出します。
+
#<code style="color: #bb0000;">'''lv_init()'''</code> を呼び出します。
 
# ドライバーを初期化します。
 
# ドライバーを初期化します。
 
# LVGLにディスプレイとインプットデバイスのドライバを登録します。ディスプレイと入力デバイスの登録について、詳しくはこちらをご覧ください。
 
# LVGLにディスプレイとインプットデバイスのドライバを登録します。ディスプレイと入力デバイスの登録について、詳しくはこちらをご覧ください。
#<code>'''lv_tick_inc(x)'''</code> を <code>'''x'''</code>  msec毎に割り込みで呼び、経過時間をLVGLに報告します。詳しくはこちら。
+
#<code style="color: #bb0000;">'''lv_tick_inc(x)'''</code> を <code style="color: #bb0000;">'''x'''</code>  msec毎に割り込みで呼び、経過時間をLVGLに報告します。詳しくはこちら。
# 数ミリ秒ごとに <code>'''lv_timer_handler()'''</code> を呼び出し、LVGL関連の処理を行う。詳細はこちら。
+
# 数ミリ秒ごとに <code style="color: #bb0000;">'''lv_timer_handler()'''</code> を呼び出し、LVGL関連の処理を行う。詳細は[https://docs.lvgl.io/latest/en/html/porting/task-handler.html <u>こちら</u>]。
 
|}
 
|}
:[[App:Library:LVGL:docs:Porting|戻る : Previous]]
+
:[[App:Library:LVGL:docs:Porting#Set up a project|戻る : Previous]]

2022年8月31日 (水) 01:22時点における最新版

https://docs.lvgl.io/8.2/porting/project.html

Set up a project

Get the library

英文 自動翻訳

LVGL is available on GitHub: https://github.com/lvgl/lvgl.

You can clone it or Download the latest version of the library from GitHub.

The graphics library is the lvgl directory which should be copied into your project.

LVGLはGitHubで入手できます:https://github.com/lvgl/lvgl

クローンするか、GitHubから最新版のライブラリをダウンロードして下さい。

グラフィック ライブラリは、プロジェクトにコピーする必要がある lvgl ディレクトリです。

戻る : Previous


Configuration file

英文 自動翻訳

There is a configuration header file for LVGL called lv_conf.h.

It sets the library's basic behaviour, disables unused modules and features, adjusts the size of memory buffers in compile-time, etc.

Copy lvgl/lv_conf_template.h next to the lvgl directory and rename it to lv_conf.h.

Open the file and change the #if 0 at the beginning to #if 1 to enable its content.


lv_conf.h can be copied to another place as well but then you should add the LV_CONF_INCLUDE_SIMPLE define to your compiler options (e.g. -DLV_CONF_INCLUDE_SIMPLE for GCC compiler) and set the include path manually.

In the config file comments explain the meaning of the options.

Check at least these three configuration options and modify them according to your hardware:

  1. LV_HOR_RES_MAX Your display's horizontal resolution.
  2. LV_VER_RES_MAX Your display's vertical resolution.
  3. LV_COLOR_DEPTH 8 for (RG332), 16 for (RGB565) or 32 for (RGB888 and ARGB8888).
LVGLには、lv_conf.h という設定用のヘッダファイルがあります。

ライブラリの基本的な動作を設定し、未使用のモジュールと機能を無効にし、コンパイル時のメモリ バッファのサイズを調整します。


lvgl/lv_conf_template.hlvglディレクトリの隣にコピーし、lv_conf.h にリネームしてください。

このファイルを開き、冒頭の #if 0#if 1 に変更し、内容を有効にして下さい。

そうする事により、ファイルのレイアウトは次のようになります。


lv_conf.h を別の場所にコピーすることもできますが、定義LV_CONF_INCLUDE_SIMPLEをコンパイラ オプション (GCC コンパイラの場合は-DLV_CONF_INCLUDE_SIMPLEなど) に追加し、インクルード パスを手動で設定する必要があります。


configファイルのコメントでは、オプションの意味が説明されています。

少なくとも次の 3 つの構成オプションを確認し、ハードウェアに応じて変更します。

  • LV_HOR_RES_MAX ディスプレイの水平解像度。
  • LV_VER_RES_MAX ディスプレイの垂直解像度。
  • LV_COLOR_DEPTH (RG332) の場合は 8、(RGB565) の場合は 16、(RGB888 および ARGB8888) の場合は 32。
戻る : Previous

Initialization

英文 自動翻訳

To use the graphics library you have to initialize it and setup required components.

The order of the initialization is:

  1. Call lv_init().
  2. Initialize your drivers.
  3. Register the display and input devices drivers in LVGL. Learn more about Display and Input device registration.
  4. Call lv_tick_inc(x) every x milliseconds in an interrupt to report the elapsed time to LVGL. Learn more.
  5. Call lv_timer_handler() every few milliseconds to handle LVGL related tasks. Learn more.

グラフィックライブラリを使用するには、初期化および必要なコンポーネントのセットアップを行う必要があります。

初期化の順序は次の通りです。

  1. lv_init() を呼び出します。
  2. ドライバーを初期化します。
  3. LVGLにディスプレイとインプットデバイスのドライバを登録します。ディスプレイと入力デバイスの登録について、詳しくはこちらをご覧ください。
  4. lv_tick_inc(x)x msec毎に割り込みで呼び、経過時間をLVGLに報告します。詳しくはこちら。
  5. 数ミリ秒ごとに lv_timer_handler() を呼び出し、LVGL関連の処理を行う。詳細はこちら
戻る : Previous