「App:Library:LVGL:docs:3rd party libraries:Lottie player」の版間の差分
1行目: | 1行目: | ||
+ | https://docs.lvgl.io/8.2/libs/rlottie.html | ||
+ | __NOTOC__ | ||
+ | = Lottie player = | ||
+ | {| class="wikitable" | ||
+ | !英文 | ||
+ | !自動翻訳 | ||
+ | |- | ||
+ | | | ||
+ | Allows to use Lottie animations in LVGL. Taken from this base repository | ||
+ | |||
+ | LVGL provides the interface to Samsung/rlottie library's C API. That is the actual Lottie player is not part of LVGL, it needs to be built separately. | ||
+ | |LVGLでロッティアニメーションを使用できます。このベースリポジトリから取得 | ||
+ | |||
+ | LVGLは、Samsung/rlottieライブラリのCAPIへのインターフェイスを提供します。つまり、実際のLottieプレーヤーはLVGLの一部ではなく、個別に構築する必要があります。 | ||
+ | |} | ||
+ | :[[App:Library:LVGL:docs:3rd party libraries|戻る : Previous]] | ||
+ | |||
+ | |||
https://docs.lvgl.io/8.2/libs/rlottie.html | https://docs.lvgl.io/8.2/libs/rlottie.html | ||
__NOTOC__ | __NOTOC__ | ||
42行目: | 60行目: | ||
デスクトップ上に構築するには、RlottieのREADMEの指示に従うことができます。最も基本的なケースでは、次のようになります。 | デスクトップ上に構築するには、RlottieのREADMEの指示に従うことができます。最も基本的なケースでは、次のようになります。 | ||
− | <syntaxhighlight lang=" | + | <syntaxhighlight lang="Bash" style="border:1px dashed gray;"> |
mkdir rlottie_workdir | mkdir rlottie_workdir | ||
cd rlottie_workdir | cd rlottie_workdir | ||
56行目: | 74行目: | ||
組み込みシステムでは、Rlottieを特定のビルドシステムに統合する必要があります。 | 組み込みシステムでは、Rlottieを特定のビルドシステムに統合する必要があります。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL:docs:3rd party libraries|戻る : Previous]] | ||
+ | |||
+ | |||
+ | == Usage == | ||
+ | {| class="wikitable" | ||
+ | !英文 | ||
+ | !自動翻訳 | ||
+ | |- | ||
+ | | | ||
+ | You can use animation from files or raw data (text). In either case first you need to enable <code style="color: #bb0000;">LV_USE_RLOTTIE</code> in <code style="color: #bb0000;">lv_conf.h</code>. | ||
+ | |||
+ | The <code style="color: #bb0000;">width</code> and <code style="color: #bb0000;">height</code> of the object be set in the ''create'' function and the animation will be scaled accordingly. | ||
+ | |ファイルまたは生データ(テキスト)からのアニメーションを使用できます。いずれの場合も、最初にで有効<code style="color: #bb0000;">LV_USE_RLOTTIE</code>にする必要があります<code style="color: #bb0000;">lv_conf.h</code>。 | ||
+ | |||
+ | オブジェクトの<code style="color: #bb0000;">width</code>とは''create''関数で設定され、アニメーションはそれに応じてスケーリングされます。 <code style="color: #bb0000;">height</code> | ||
+ | |} | ||
+ | :[[App:Library:LVGL:docs:3rd party libraries|戻る : Previous]] | ||
+ | |||
+ | |||
+ | === Use Rlottie from file === | ||
+ | {| class="wikitable" | ||
+ | !英文 | ||
+ | !自動翻訳 | ||
+ | |- | ||
+ | | | ||
+ | To create a Lottie animation from file use: | ||
+ | <syntaxhighlight lang="C++" style="border:1px dashed gray;"> | ||
+ | lv_obj_t * lottie = lv_rlottie_create_from_file(parent, width, height, "path/to/lottie.json"); | ||
+ | </syntaxhighlight> | ||
+ | Note that, Rlottie uses the standard STDIO C file API, so you can use the path "normally" and no LVGL specific driver letter is required. | ||
+ | |ファイルからロッティアニメーションを作成するには、次のようにします。 | ||
+ | <syntaxhighlight lang="C++" style="border:1px dashed gray;"> | ||
+ | lv_obj_t * lottie = lv_rlottie_create_from_file(parent、width、height、 "path / to / lottie.json"); | ||
+ | </syntaxhighlight> | ||
+ | Rlottieは標準のSTDIOCファイルAPIを使用するため、パスを「通常」に使用でき、LVGL固有のドライバー文字は必要ありません。 | ||
+ | |} | ||
+ | :[[App:Library:LVGL:docs:3rd party libraries|戻る : Previous]] | ||
+ | |||
+ | |||
+ | === Use Rlottie from raw string data === | ||
+ | {| class="wikitable" | ||
+ | !英文 | ||
+ | !自動翻訳 | ||
+ | |- | ||
+ | | | ||
+ | <code style="color: #bb0000;">lv_example_rlottie_approve.c</code> contains an example animation in raw format. Instead storing the JSON string a hex array is stored for the following reasons: | ||
+ | |||
+ | * avoid escaping <code style="color: #bb0000;">"</code> in the JSON file | ||
+ | * some compilers don't support very long strings | ||
+ | |||
+ | <code style="color: #bb0000;">lvgl/scripts/filetohex.py</code> can be used to convert a Lottie file a hex array. E.g.: | ||
+ | <syntaxhighlight lang="C++" style="border:1px dashed gray;"> | ||
+ | ./filetohex.py path/to/lottie.json > out.txt | ||
+ | </syntaxhighlight> | ||
+ | To create an animation from raw data: | ||
+ | <syntaxhighlight lang="C++" style="border:1px dashed gray;"> | ||
+ | extern const uint8_t lottie_data[]; | ||
+ | lv_obj_t* lottie = lv_rlottie_create_from_raw(parent, width, height, (const char *)lottie_data); | ||
+ | </syntaxhighlight> | ||
+ | | | ||
+ | |||
+ | |||
+ | <code style="color: #bb0000;">lv_example_rlottie_approve.c</code>生の形式のアニメーションの例が含まれています。代わりに、JSON文字列を格納する代わりに、次の理由で16進配列が格納されます。 | ||
+ | |||
+ | * LVGLでロッティアニメーションを使用できます。このベースリポジトリから取得<code style="color: #bb0000;">"</code>JSONファイルでのエスケープを避けてください | ||
+ | * 一部のコンパイラは非常に長い文字列をサポートしていません | ||
+ | |||
+ | <code style="color: #bb0000;">lvgl/scripts/filetohex.py</code>Lottieファイルを16進配列に変換するために使用できます。例えば: | ||
+ | <syntaxhighlight lang="C++" style="border:1px dashed gray;"> | ||
+ | ./filetohex.py path / to / lottie.json> out.txt | ||
+ | </syntaxhighlight> | ||
+ | 生データからアニメーションを作成するには: | ||
+ | <syntaxhighlight lang="C++" style="border:1px dashed gray;"> | ||
+ | extern const uint8_t lottie_data []; | ||
+ | lv_obj_t * lottie = lv_rlottie_create_from_raw(parent、width、height、(const char *)lottie_data); | ||
+ | </syntaxhighlight> | ||
+ | |} | ||
+ | :[[App:Library:LVGL:docs:3rd party libraries|戻る : Previous]] | ||
+ | |||
+ | |||
+ | == Getting animations == | ||
+ | {| class="wikitable" | ||
+ | !英文 | ||
+ | !自動翻訳 | ||
+ | |- | ||
+ | | | ||
+ | Lottie is standard and popular format so you can find many animation files on the web. For example: <nowiki>https://lottiefiles.com/</nowiki> | ||
+ | |||
+ | You can also create your own animations with Adobe After Effects or similar software. | ||
+ | |Lottieは標準的で人気のある形式であるため、Web上で多くのアニメーションファイルを見つけることができます。例:https://lottiefiles.com/ | ||
+ | |||
+ | AdobeAfterEffectsまたは同様のソフトウェアを使用して独自のアニメーションを作成することもできます。 | ||
+ | |} | ||
+ | :[[App:Library:LVGL:docs:3rd party libraries|戻る : Previous]] | ||
+ | |||
+ | |||
+ | == Controlling animations == | ||
+ | {| class="wikitable" | ||
+ | !英文 | ||
+ | !自動翻訳 | ||
+ | |- | ||
+ | | | ||
+ | LVGL provides two functions to control the animation mode: <code style="color: #bb0000;">lv_rlottie_set_play_mode</code> and <code style="color: #bb0000;">lv_rlottie_set_current_frame</code>. You'll combine your intentions when calling the first method, like in these examples: | ||
+ | <syntaxhighlight lang="C++" style="border:1px dashed gray;"> | ||
+ | lv_obj_t * lottie = lv_rlottie_create_from_file(scr, 128, 128, "test.json"); | ||
+ | lv_obj_center(lottie); | ||
+ | // Pause to a specific frame | ||
+ | lv_rlottie_set_current_frame(lottie, 50); | ||
+ | lv_rlottie_set_play_mode(lottie, LV_RLOTTIE_CTRL_PAUSE); // The specified frame will be displayed and then the animation will pause | ||
+ | |||
+ | // Play backward and loop | ||
+ | lv_rlottie_set_play_mode(lottie, LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_BACKWARD | LV_RLOTTIE_CTRL_LOOP); | ||
+ | |||
+ | // Play forward once (no looping) | ||
+ | lv_rlottie_set_play_mode(lottie, LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_FORWARD); | ||
+ | </syntaxhighlight> | ||
+ | The default animation mode is play forward with loop. | ||
+ | |||
+ | If you don't enable looping, a <code style="color: #bb0000;">LV_EVENT_READY</code> is sent when the animation can not make more progress without looping. | ||
+ | |||
+ | To get the number of frames in an animation or the current frame index, you can cast the <code style="color: #bb0000;">lv_obj_t</code> instance to a <code style="color: #bb0000;">lv_rlottie_t</code> instance and inspect the <code style="color: #bb0000;">current_frame</code> and <code style="color: #bb0000;">total_frames</code> members. | ||
+ | |LVGLには、アニメーションモードを制御するための2つの関数とが<code style="color: #bb0000;">lv_rlottie_set_play_mode</code>あり<code style="color: #bb0000;">lv_rlottie_set_current_frame</code>ます。次の例のように、最初のメソッドを呼び出すときに意図を組み合わせます。 | ||
+ | <syntaxhighlight lang="C++" style="border:1px dashed gray;"> | ||
+ | lv_obj_t * lottie = lv_rlottie_create_from_file(scr、128、128、 "test.json"); | ||
+ | lv_obj_center(lottie); | ||
+ | //特定のフレームに一時停止します | ||
+ | lv_rlottie_set_current_frame(lottie、50); | ||
+ | lv_rlottie_set_play_mode(lottie、LV_RLOTTIE_CTRL_PAUSE); //指定したフレームが表示され、アニメーションが一時停止します | ||
+ | |||
+ | //逆方向に再生してループします | ||
+ | lv_rlottie_set_play_mode(lottie、LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_BACKWARD | LV_RLOTTIE_CTRL_LOOP); | ||
+ | |||
+ | // 1回前方に再生します(ループなし) | ||
+ | lv_rlottie_set_play_mode(lottie、LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_FORWARD); | ||
+ | </syntaxhighlight> | ||
+ | デフォルトのアニメーションモードは、ループ再生です。 | ||
+ | |||
+ | ループを有効にしない<code style="color: #bb0000;">LV_EVENT_READY</code>場合、アニメーションがループせずにそれ以上進行できないときにaが送信されます。 | ||
+ | |||
+ | アニメーションのフレーム数または現在のフレームインデックスを取得するには、<code style="color: #bb0000;">lv_obj_t</code>インスタンスをインスタンスにキャストして、およびメンバー <code style="color: #bb0000;">lv_rlottie_t</code>を検査します。<code style="color: #bb0000;">current_frametotal_frames</code> | ||
+ | |} | ||
+ | :[[App:Library:LVGL:docs:3rd party libraries|戻る : Previous]] | ||
+ | |||
+ | |||
+ | == Example == | ||
+ | {| class="wikitable" | ||
+ | !英文 | ||
+ | !自動翻訳 | ||
+ | |- | ||
+ | | | ||
+ | === Load a Lottie animation from raw data === | ||
+ | [[file:LVGL docs 3rdPartyLibs Lottie 01.png|link=https://docs.lvgl.io/8.2/libs/rlottie.html#load-a-lottie-animation-from-raw-data]] | ||
+ | | | ||
+ | |- | ||
+ | | | ||
+ | === Load a Lottie animation from a file === | ||
+ | [[file:LVGL docs 3rdPartyLibs Lottie 01.png|link=https://docs.lvgl.io/8.2/libs/rlottie.html#load-a-lottie-animation-from-a-file]] | ||
+ | | | ||
+ | |} | ||
+ | :[[App:Library:LVGL:docs:3rd party libraries|戻る : Previous]] | ||
+ | |||
+ | |||
+ | == API == | ||
+ | {| class="wikitable" | ||
+ | !英文 | ||
+ | !自動翻訳 | ||
+ | |- | ||
+ | | | ||
+ | Enums | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">enum lv_rlottie_ctrl_t </span> | ||
+ | : ''Values:'' | ||
+ | :; <span style="background-color: #eeeeee;">enumerator LV_RLOTTIE_CTRL_FORWARD </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">enumerator LV_RLOTTIE_CTRL_BACKWARD </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">enumerator LV_RLOTTIE_CTRL_PAUSE </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">enumerator LV_RLOTTIE_CTRL_PLAY </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">enumerator LV_RLOTTIE_CTRL_LOOP </span> | ||
+ | :: | ||
+ | |||
+ | Functions | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">lv_obj_t *lv_rlottie_create_from_file(lv_obj_t *parent, lv_coord_t width, lv_coord_t height, const char *path) </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">lv_obj_t *lv_rlottie_create_from_raw(lv_obj_t *parent, lv_coord_t width, lv_coord_t height, const char *rlottie_desc) </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_rlottie_set_play_mode(lv_obj_t *rlottie, const lv_rlottie_ctrl_t ctrl) </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_rlottie_set_current_frame(lv_obj_t *rlottie, const size_t goto_frame) </span> | ||
+ | : | ||
+ | |||
+ | Variables | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">const lv_obj_class_t lv_rlottie_class </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">struct lv_rlottie_t </span> | ||
+ | : Public Members | ||
+ | :; <span style="background-color: #eeeeee;">lv_img_t img_ext </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">struct Lottie_Animation_S *animation </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">lv_timer_t *task </span> | ||
+ | :: | ||
+ | : | ||
+ | :; <span style="background-color: #eeeeee;">lv_img_dsc_t imgdsc </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_t total_frames </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_t current_frame </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_t framerate </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">uint32_t *allocated_buf </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_t allocated_buffer_size </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_t scanline_width </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">lv_rlottie_ctrl_t play_ctrl </span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_t dest_frame</span> | ||
+ | | | ||
+ | |||
+ | |||
+ | 列挙型 | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">列挙型lv_rlottie_ctrl_t</span> | ||
+ | |||
+ | : ''値:'' | ||
+ | :; <span style="background-color: #eeeeee;">列挙子LV_RLOTTIE_CTRL_FORWARD</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">列挙子LV_RLOTTIE_CTRL_BACKWARD</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">列挙子LV_RLOTTIE_CTRL_PAUSE</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">列挙子LV_RLOTTIE_CTRL_PLAY</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">列挙子LV_RLOTTIE_CTRL_LOOP</span> | ||
+ | :: | ||
+ | |||
+ | 機能 | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">lv_obj_t * lv_rlottie_create_from_file(lv_obj_t * parent、lv_coord_t width、lv_coord_t height、const char * path)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">lv_obj_t * lv_rlottie_create_from_raw(lv_obj_t * parent、lv_coord_t width、lv_coord_t height、const char * rlottie_desc)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_rlottie_set_play_mode(lv_obj_t * rlottie、const lv_rlottie_ctrl_t ctrl)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_rlottie_set_current_frame(lv_obj_t * rlottie、const size_t goto_frame)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | 変数 | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">const lv_obj_class_t lv_rlottie_class</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">struct lv_rlottie_t</span> | ||
+ | |||
+ | : パブリックメンバー | ||
+ | :; <span style="background-color: #eeeeee;">lv_img_t img_ext</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">structLottie_Animation_S*アニメーション</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">lv_timer_t * task</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">lv_img_dsc_t imgdsc</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_t total_frames</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_t current_frame</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_tフレームレート</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">uint32_t * allocated_buf</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_tassigned_buffer_size</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_t scanline_width</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">lv_rlottie_ctrl_t play_ctrl</span> | ||
+ | :: | ||
+ | :; <span style="background-color: #eeeeee;">size_t dest_frame</span> | ||
+ | |} | ||
+ | |||
+ | |||
+ | |||
:[[App:Library:LVGL:docs:3rd party libraries|戻る : Previous]] | :[[App:Library:LVGL:docs:3rd party libraries|戻る : Previous]] | ||
2022年6月29日 (水) 17:22時点における版
https://docs.lvgl.io/8.2/libs/rlottie.html
Lottie player
英文 | 自動翻訳 |
---|---|
Allows to use Lottie animations in LVGL. Taken from this base repository LVGL provides the interface to Samsung/rlottie library's C API. That is the actual Lottie player is not part of LVGL, it needs to be built separately. |
LVGLでロッティアニメーションを使用できます。このベースリポジトリから取得
LVGLは、Samsung/rlottieライブラリのCAPIへのインターフェイスを提供します。つまり、実際のLottieプレーヤーはLVGLの一部ではなく、個別に構築する必要があります。 |
https://docs.lvgl.io/8.2/libs/rlottie.html
Lottie player
英文 | 自動翻訳 |
---|---|
Allows to use Lottie animations in LVGL. Taken from this base repository LVGL provides the interface to Samsung/rlottie library's C API. That is the actual Lottie player is not part of LVGL, it needs to be built separately. |
LVGLでロッティアニメーションを使用できます。このベースリポジトリから取得
LVGLは、Samsung/rlottieライブラリのCAPIへのインターフェイスを提供します。つまり、実際のLottieプレーヤーはLVGLの一部ではなく、個別に構築する必要があります。 |
Build Rlottie
英文 | 自動翻訳 |
---|---|
To build Samsung's Rlottie C++14-compatible compiler and optionally CMake 3.14 or higher is required. To build on desktop you can follow the instructions from Rlottie's README. In the most basic case it looks like this: mkdir rlottie_workdir
cd rlottie_workdir
git clone <nowiki>https://github.com/Samsung/rlottie.git</nowiki>
mkdir build
cd build
cmake ../rlottie
make -j
sudo make install
And finally add the On embedded systems you need to take care of integrating Rlottie to the given build system. |
SamsungのRlottieC++ 14互換コンパイラをビルドするには、オプションでCMake3.14以降が必要です。
デスクトップ上に構築するには、RlottieのREADMEの指示に従うことができます。最も基本的なケースでは、次のようになります。 mkdir rlottie_workdir
cd rlottie_workdir
git clone <nowiki>https://github.com/Samsung/rlottie.git</nowiki>
mkdirビルド
cdビルド
cmake ../rlottie
make -j
sudo make install
そして最後に、 組み込みシステムでは、Rlottieを特定のビルドシステムに統合する必要があります。 |
Usage
英文 | 自動翻訳 |
---|---|
You can use animation from files or raw data (text). In either case first you need to enable The |
ファイルまたは生データ(テキスト)からのアニメーションを使用できます。いずれの場合も、最初にで有効LV_USE_RLOTTIE にする必要がありますlv_conf.h 。
オブジェクトの |
Use Rlottie from file
英文 | 自動翻訳 |
---|---|
To create a Lottie animation from file use:
lv_obj_t * lottie = lv_rlottie_create_from_file(parent, width, height, "path/to/lottie.json");
Note that, Rlottie uses the standard STDIO C file API, so you can use the path "normally" and no LVGL specific driver letter is required. |
ファイルからロッティアニメーションを作成するには、次のようにします。
lv_obj_t * lottie = lv_rlottie_create_from_file(parent、width、height、 "path / to / lottie.json");
Rlottieは標準のSTDIOCファイルAPIを使用するため、パスを「通常」に使用でき、LVGL固有のドライバー文字は必要ありません。 |
Use Rlottie from raw string data
英文 | 自動翻訳 |
---|---|
./filetohex.py path/to/lottie.json > out.txt
To create an animation from raw data: extern const uint8_t lottie_data[];
lv_obj_t* lottie = lv_rlottie_create_from_raw(parent, width, height, (const char *)lottie_data);
|
./filetohex.py path / to / lottie.json> out.txt
生データからアニメーションを作成するには: extern const uint8_t lottie_data [];
lv_obj_t * lottie = lv_rlottie_create_from_raw(parent、width、height、(const char *)lottie_data);
|
Getting animations
英文 | 自動翻訳 |
---|---|
Lottie is standard and popular format so you can find many animation files on the web. For example: https://lottiefiles.com/ You can also create your own animations with Adobe After Effects or similar software. |
Lottieは標準的で人気のある形式であるため、Web上で多くのアニメーションファイルを見つけることができます。例:https://lottiefiles.com/
AdobeAfterEffectsまたは同様のソフトウェアを使用して独自のアニメーションを作成することもできます。 |
Controlling animations
英文 | 自動翻訳 |
---|---|
LVGL provides two functions to control the animation mode:
lv_obj_t * lottie = lv_rlottie_create_from_file(scr, 128, 128, "test.json");
lv_obj_center(lottie);
// Pause to a specific frame
lv_rlottie_set_current_frame(lottie, 50);
lv_rlottie_set_play_mode(lottie, LV_RLOTTIE_CTRL_PAUSE); // The specified frame will be displayed and then the animation will pause
// Play backward and loop
lv_rlottie_set_play_mode(lottie, LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_BACKWARD | LV_RLOTTIE_CTRL_LOOP);
// Play forward once (no looping)
lv_rlottie_set_play_mode(lottie, LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_FORWARD);
The default animation mode is play forward with loop. If you don't enable looping, a To get the number of frames in an animation or the current frame index, you can cast the |
LVGLには、アニメーションモードを制御するための2つの関数とがlv_rlottie_set_play_mode ありlv_rlottie_set_current_frame ます。次の例のように、最初のメソッドを呼び出すときに意図を組み合わせます。
lv_obj_t * lottie = lv_rlottie_create_from_file(scr、128、128、 "test.json");
lv_obj_center(lottie);
//特定のフレームに一時停止します
lv_rlottie_set_current_frame(lottie、50);
lv_rlottie_set_play_mode(lottie、LV_RLOTTIE_CTRL_PAUSE); //指定したフレームが表示され、アニメーションが一時停止します
//逆方向に再生してループします
lv_rlottie_set_play_mode(lottie、LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_BACKWARD | LV_RLOTTIE_CTRL_LOOP);
// 1回前方に再生します(ループなし)
lv_rlottie_set_play_mode(lottie、LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_FORWARD);
デフォルトのアニメーションモードは、ループ再生です。 ループを有効にしない アニメーションのフレーム数または現在のフレームインデックスを取得するには、 |
Example
英文 | 自動翻訳 |
---|---|
Load a Lottie animation from raw data |
|
Load a Lottie animation from a file |
API
英文 | 自動翻訳 |
---|---|
Enums enum lv_rlottie_ctrl_t
Functions lv_obj_t *lv_rlottie_create_from_file(lv_obj_t *parent, lv_coord_t width, lv_coord_t height, const char *path) lv_obj_t *lv_rlottie_create_from_raw(lv_obj_t *parent, lv_coord_t width, lv_coord_t height, const char *rlottie_desc) void lv_rlottie_set_play_mode(lv_obj_t *rlottie, const lv_rlottie_ctrl_t ctrl) void lv_rlottie_set_current_frame(lv_obj_t *rlottie, const size_t goto_frame) Variables const lv_obj_class_t lv_rlottie_class struct lv_rlottie_t
|
列挙型lv_rlottie_ctrl_t
機能 lv_obj_t * lv_rlottie_create_from_file(lv_obj_t * parent、lv_coord_t width、lv_coord_t height、const char * path) lv_obj_t * lv_rlottie_create_from_raw(lv_obj_t * parent、lv_coord_t width、lv_coord_t height、const char * rlottie_desc) void lv_rlottie_set_play_mode(lv_obj_t * rlottie、const lv_rlottie_ctrl_t ctrl) void lv_rlottie_set_current_frame(lv_obj_t * rlottie、const size_t goto_frame) 変数 const lv_obj_class_t lv_rlottie_class struct lv_rlottie_t
|
Usage
英文 | 自動翻訳 |
---|---|
You can use animation from files or raw data (text). In either case first you need to enable The |
ファイルまたは生データ(テキスト)からのアニメーションを使用できます。いずれの場合も、最初にで有効LV_USE_RLOTTIE にする必要がありますlv_conf.h 。
オブジェクトの |
Use Rlottie from file
英文 | 自動翻訳 |
---|---|
To create a Lottie animation from file use: lv_obj_t * lottie = lv_rlottie_create_from_file(parent, width, height, "path/to/lottie.json"); Note that, Rlottie uses the standard STDIO C file API, so you can use the path "normally" and no LVGL specific driver letter is required. |
ファイルからロッティアニメーションを作成するには、次のようにします。
lv_obj_t * lottie = lv_rlottie_create_from_file(parent、width、height、 "path / to / lottie.json"); Rlottieは標準のSTDIOCファイルAPIを使用するため、パスを「通常」に使用でき、LVGL固有のドライバー文字は必要ありません。 |
Use Rlottie from raw string data
英文 | 自動翻訳 |
---|---|
./filetohex.py path/to/lottie.json > out.txt To create an animation from raw data: extern const uint8_t lottie_data[]; lv_obj_t* lottie = lv_rlottie_create_from_raw(parent, width, height, (const char *)lottie_data); |
./filetohex.py path / to / lottie.json> out.txt 生データからアニメーションを作成するには: extern const uint8_t lottie_data []; lv_obj_t * lottie = lv_rlottie_create_from_raw(parent、width、height、(const char *)lottie_data); |
Getting animations
英文 | 自動翻訳 |
---|---|
Lottie is standard and popular format so you can find many animation files on the web. For example: https://lottiefiles.com/ You can also create your own animations with Adobe After Effects or similar software. |
Lottieは標準的で人気のある形式であるため、Web上で多くのアニメーションファイルを見つけることができます。例:https://lottiefiles.com/
AdobeAfterEffectsまたは同様のソフトウェアを使用して独自のアニメーションを作成することもできます。 |
Controlling animations
英文 | 自動翻訳 |
---|---|
LVGL provides two functions to control the animation mode: lv_obj_t * lottie = lv_rlottie_create_from_file(scr, 128, 128, "test.json"); lv_obj_center(lottie); // Pause to a specific frame lv_rlottie_set_current_frame(lottie, 50); lv_rlottie_set_play_mode(lottie, LV_RLOTTIE_CTRL_PAUSE); // The specified frame will be displayed and then the animation will pause // Play backward and loop lv_rlottie_set_play_mode(lottie, LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_BACKWARD | LV_RLOTTIE_CTRL_LOOP); // Play forward once (no looping) lv_rlottie_set_play_mode(lottie, LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_FORWARD); The default animation mode is play forward with loop. If you don't enable looping, a To get the number of frames in an animation or the current frame index, you can cast the |
LVGLには、アニメーションモードを制御するための2つの関数とがlv_rlottie_set_play_mode ありlv_rlottie_set_current_frame ます。次の例のように、最初のメソッドを呼び出すときに意図を組み合わせます。
lv_obj_t * lottie = lv_rlottie_create_from_file(scr、128、128、 "test.json"); lv_obj_center(lottie); //特定のフレームに一時停止します lv_rlottie_set_current_frame(lottie、50); lv_rlottie_set_play_mode(lottie、LV_RLOTTIE_CTRL_PAUSE); //指定したフレームが表示され、アニメーションが一時停止します //逆方向に再生してループします lv_rlottie_set_play_mode(lottie、LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_BACKWARD | LV_RLOTTIE_CTRL_LOOP); // 1回前方に再生します(ループなし) lv_rlottie_set_play_mode(lottie、LV_RLOTTIE_CTRL_PLAY | LV_RLOTTIE_CTRL_FORWARD); デフォルトのアニメーションモードは、ループ再生です。 ループを有効にしない アニメーションのフレーム数または現在のフレームインデックスを取得するには、 |
Example
英文 | 自動翻訳 |
---|---|
Load a Lottie animation from raw data |
|
Load a Lottie animation from a file |
API
英文 | 自動翻訳 |
---|---|
Enums enum lv_rlottie_ctrl_t
Functions lv_obj_t *lv_rlottie_create_from_file(lv_obj_t *parent, lv_coord_t width, lv_coord_t height, const char *path) lv_obj_t *lv_rlottie_create_from_raw(lv_obj_t *parent, lv_coord_t width, lv_coord_t height, const char *rlottie_desc) void lv_rlottie_set_play_mode(lv_obj_t *rlottie, const lv_rlottie_ctrl_t ctrl) void lv_rlottie_set_current_frame(lv_obj_t *rlottie, const size_t goto_frame) Variables const lv_obj_class_t lv_rlottie_class struct lv_rlottie_t
|
列挙型lv_rlottie_ctrl_t
機能 lv_obj_t * lv_rlottie_create_from_file(lv_obj_t * parent、lv_coord_t width、lv_coord_t height、const char * path) lv_obj_t * lv_rlottie_create_from_raw(lv_obj_t * parent、lv_coord_t width、lv_coord_t height、const char * rlottie_desc) void lv_rlottie_set_play_mode(lv_obj_t * rlottie、const lv_rlottie_ctrl_t ctrl) void lv_rlottie_set_current_frame(lv_obj_t * rlottie、const size_t goto_frame) 変数 const lv_obj_class_t lv_rlottie_class struct lv_rlottie_t
|