App:Library:LVGL:docs:Widgets:Page (lv page)

提供: robot-jp wiki
ナビゲーションに移動検索に移動

https://docs.lvgl.io/latest/en/html/widgets/page.html

Page (lv_page)

Overview

英文 自動翻訳
The Page consist of two Containers on each other:
  • a background
  • a top which is scrollable.
ページは、互いに配置された 2 つのContainersで構成されます。
  • 背景
  • スクロール可能なトップ。
戻る : Previous


Parts and Styles

英文 自動翻訳
The Page's main part is called LV_PAGE_PART_BG which is the background of the Page. It uses all the typical background style properties. Using padding will add space on the sides.


The scrollable object can be referenced via the LV_PAGE_PART_SCRL part. It also uses all the typical background style properties and padding to add space on the sides.


LV_LIST_PART_SCROLLBAR is a virtual part of the background to draw the scroll bars. Uses all the typical background style properties, size to set the width of the scroll bars, and pad_right and pad_bottom to set the spacing.


LV_LIST_PART_EDGE_FLASHis also a virtual part of the background to draw a semicircle on the sides when the list can not be scrolled in that direction further. Uses all the typical background properties.

ページのメイン部分は、ページの背景である LV_PAGE_PART_BG と呼ばれます。 典型的な背景スタイル プロパティをすべて使用します。 パディングを使用すると、側面にスペースが追加されます。


スクロール可能なオブジェクトは、LV_PAGE_PART_SCRL パーツを介して参照できます。 また、典型的な背景スタイルのプロパティとパディングをすべて使用して、側面にスペースを追加します。


LV_LIST_PART_SCROLLBAR は、スクロール バーを描画するための背景の仮想パーツです。 すべての典型的な背景スタイル プロパティ、サイズを使用してスクロール バーの幅を設定し、pad_right と pad_bottom を使用して間隔を設定します。


LV_LIST_PART_EDGE_FLASH は、リストをその方向にさらにスクロールできない場合に、側面に半円を描画するための背景の仮想部分でもあります。 典型的な背景プロパティをすべて使用します。

戻る : Previous


Usage

英文 自動翻訳
The background object can be referenced as the page itself like. E.g. to set the page's width: lv_obj_set_width(page, 100).


If a child is created on the page it will be automatically moved to the scrollable container. If the scrollable container becomes larger then the background it can be scrolled by dragging (like the lists on smartphones).


By default, the scrollable's has LV_FIT_MAX fit in all directions. It means the scrollable size will be the same as the background's size (minus the padding) while the children are in the background. But when an object is positioned out of the background the scrollable size will be increased to involve it.

背景オブジェクトは、ページ自体と同じように参照できます。 例えば。 ページの幅を設定するには: lv_obj_set_width(page, 100)。


ページに子が作成されると、スクロール可能なコンテナに自動的に移動されます。 スクロール可能なコンテナが背景よりも大きくなった場合は、ドラッグしてスクロールできます (スマートフォンのリストのように)。


デフォルトでは、スクロール可能なものはすべての方向に LV_FIT_MAX フィットします。 これは、子が背景にある間、スクロール可能なサイズが背景のサイズ (パディングを差し引いたもの) と同じになることを意味します。 ただし、オブジェクトが背景の外に配置されると、スクロール可能なサイズが大きくなり、オブジェクトが含まれるようになります。

戻る : Previous


Scrollbars

英文 自動翻訳
Scrollbars can be shown according to four policies:
  • LV_SCRLBAR_MODE_OFF Never show scroll bars
  • LV_SCRLBAR_MODE_ON Always show scroll bars
  • LV_SCRLBAR_MODE_DRAG Show scroll bars when the page is being dragged
  • LV_SCRLBAR_MODE_AUTO Show scroll bars when the scrollable container is large enough to be scrolled
  • LV_SCRLBAR_MODE_HIDE Hide the scroll bar temporally
  • LV_SCRLBAR_MODE_UNHIDE Unhide the previously hidden scrollbar. Recover the original mode too

The scroll bar show policy can be changed by: lv_page_set_scrlbar_mode(page, SB_MODE). The default value is LV_SCRLBAR_MODE_AUTO.

スクロールバーは、次の 4 つのポリシーに従って表示できます。
  • LV_SCRLBAR_MODE_OFF スクロールバーを表示しない
  • LV_SCRLBAR_MODE_ON 常にスクロール バーを表示する
  • LV_SCRLBAR_MODE_DRAG ページがドラッグされているときにスクロール バーを表示する
  • LV_SCRLBAR_MODE_AUTO スクロール可能なコンテナがスクロールできるほど大きい場合にスクロールバーを表示する
  • LV_SCRLBAR_MODE_HIDE スクロールバーを一時的に非表示にする
  • LV_SCRLBAR_MODE_UNHIDE 以前非表示だったスクロールバーを再表示します。 元のモードも回復

スクロールバーの表示ポリシーは次のように変更できます: lv_page_set_scrlbar_mode(page, SB_MODE)。 デフォルト値は LV_SCRLBAR_MODE_AUTO です。

戻る : Previous


Glue object

英文 自動翻訳
A children can be "glued" to the page.

In this case, if the page can be scrolled by dragging that object. It can be enabled by the lv_page_glue_obj(child, true).

子はページに「くっつく」ことができます。

この場合、そのオブジェクトをドラッグしてページをスクロールできるかどうか。 lv_page_glue_obj(child, true) で有効にできます。

戻る : Previous


Focus object

英文 自動翻訳
An object on a page can be focused with lv_page_focus(page, child, LV_ANIM_ONO/FF).

It will move the scrollable container to show a child.

The time of the animation can be set by lv_page_set_anim_time(page, anim_time) in milliseconds.

child doesn't have to be a direct child of the page.

This is it works if the scrollable object is the grandparent of the object too.

ページ上のオブジェクトは、lv_page_focus(ページ、子、LV_ANIM_ONO/FF) でフォーカスできます。

スクロール可能なコンテナを移動して子を表示します。

アニメーションの時間は lv_page_set_anim_time(page, anim_time) でミリ秒単位で設定できます。

child はページの直接の子である必要はありません。

これは、スクロール可能なオブジェクトがオブジェクトの祖父母でもある場合に機能します。

戻る : Previous


Manual navigation

英文 自動翻訳
You can move the scrollable object manually using lv_page_scroll_hor(page, dist) and lv_page_scroll_ver(page, dist) lv_page_scroll_hor(page, dist) および lv_page_scroll_ver(page, dist) を使用して、スクロール可能なオブジェクトを手動で移動できます。
戻る : Previous


Edge flash

英文 自動翻訳
A circle-like effect can be shown if the list reached the most top/bottom/left/right position. lv_page_set_edge_flash(list, en) enables this feature. リストが最も上/下/左/右の位置に達した場合、円のような効果を示すことができます。 lv_page_set_edge_flash(list, en) は、この機能を有効にします。
戻る : Previous


Scroll propagation

英文 自動翻訳
If the list is created on an other scrollable element (like an other page) and the Page can't be scrolled further the scrolling can be propagated to the parent to continue the scrolling on the parent.

It can be enabled with lv_page_set_scroll_propagation(list, true)

リストが他のスクロール可能な要素 (他のページなど) で作成され、ページをそれ以上スクロールできない場合、スクロールを親に伝達して、親でのスクロールを続行できます。

lv_page_set_scroll_propagation(list, true) で有効にできます

[

[App:Library:LVGL:docs:Widgets|戻る : Previous]]


Clean the page

英文 自動翻訳
All the object created on the page can be clean with lv_page_clean(page).

Note that lv_obj_clean(page) doesn't work here because it would delete the scrollable object too.

ページ上に作成されたすべてのオブジェクトは、lv_page_clean(page) でクリーンにすることができます。

lv_obj_clean(page) は、スクロール可能なオブジェクトも削除するため、ここでは機能しないことに注意してください。

戻る : Previous


Scrollable API

英文 自動翻訳
There are functions to directly set/get the scrollable's attributes:
  • lv_page_get_scrl()
  • lv_page_set_scrl_fit/fint2/fit4()
  • lv_page_set_scrl_width()
  • lv_page_set_scrl_height()
  • lv_page_set_scrl_fit_width()
  • lv_page_set_scrl_fit_height()
  • lv_page_set_scrl_layout()
スクロール可能な属性を直接設定/取得する関数があります:
  • lv_page_get_scrl()
  • lv_page_set_scrl_fit/fint2/fit4()
  • lv_page_set_scrl_width()
  • lv_page_set_scrl_height()
  • lv_page_set_scrl_fit_width()
  • lv_page_set_scrl_fit_height()
  • lv_page_set_scrl_layout()
[

[App:Library:LVGL:docs:Widgets|戻る : Previous]]

Events

英文 自動翻訳
Only the Generic events are sent by the object type.

The scrollable object has a default event callback which propagates the following events to the background object: LV_EVENT_PRESSED, LV_EVENT_PRESSING, LV_EVENT_PRESS_LOST,LV_EVENT_RELEASED, LV_EVENT_SHORT_CLICKED, LV_EVENT_CLICKED, LV_EVENT_LONG_PRESSED, LV_EVENT_LONG_PRESSED_REPEAT

Learn more about Events.


##Keys

The following Keys are processed by the Page:

  • LV_KEY_RIGHT/LEFT/UP/DOWN Scroll the page

Learn more about Keys.

戻る : Previous

Example

Page with scrollbar

LVGL Lib docs Page.png
戻る : Previous

API

戻る : Previous