「App:Library:Squareline:docs:dev env:widgets」の版間の差分
(→Button) |
|||
125行目: | 125行目: | ||
=== Button === | === Button === | ||
− | [[ファイル:SquareLineStudio Wigets Button.jpg]] | + | [[ファイル:SquareLineStudio Wigets Button.jpg]][[ファイル:LVGL docs example 021.png|100x100ピクセル]] |
{| class="wikitable" | {| class="wikitable" | ||
| | | | ||
133行目: | 133行目: | ||
=== Image === | === Image === | ||
− | [[ファイル:SquareLineStudio Wigets Image.jpg]] | + | [[ファイル:SquareLineStudio Wigets Image.jpg]][[ファイル:LVGL docs example 077.png|100x100ピクセル]] |
{| class="wikitable" | {| class="wikitable" | ||
| | | | ||
141行目: | 141行目: | ||
=== Label === | === Label === | ||
− | [[ファイル:SquareLineStudio Wigets Label.jpg]] | + | [[ファイル:SquareLineStudio Wigets Label.jpg]][[ファイル:LVGL docs example 081.png|100x100ピクセル]] |
{| class="wikitable" | {| class="wikitable" | ||
| | | | ||
149行目: | 149行目: | ||
=== Panel === | === Panel === | ||
− | [[ファイル:SquareLineStudio Wigets Panel.jpg]] | + | [[ファイル:SquareLineStudio Wigets Panel.jpg]][[ファイル:LVGL docs example 042.png|100x100ピクセル]] |
{| class="wikitable" | {| class="wikitable" | ||
| | | | ||
157行目: | 157行目: | ||
=== Text Area === | === Text Area === | ||
− | [[ファイル:SquareLineStudio Wigets Textarea.jpg]] | + | [[ファイル:SquareLineStudio Wigets Textarea.jpg]][[ファイル:LVGL docs example 113.png|100x100ピクセル]] |
{| class="wikitable" | {| class="wikitable" | ||
| | | |
2022年8月4日 (木) 07:03時点における版
Widget panel
原文 | 訳 |
---|---|
You can find widgets, which are the basic elements of UI, on the Widget Panel.
Every widget has its own preference. You can add custom styles to widget components and you are allowed to configure them in different states. |
ウィジェット パネルには、UI の基本要素であるウィジェットがあります。
すべてのウィジェットには独自の設定があります。 カスタム スタイルをウィジェット コンポーネントに追加でき、それらをさまざまな状態で構成できます。 |
Screen
It defines the resolution of the work space and widgets can be added here. You can create several screens to your project. To switch among screens, you should use Screen Change event.
|
ワークスペースの解像度を定義し、ここにウィジェットを追加できます。 プロジェクトに複数の画面を作成できます。 画面を切り替えるには、Screen Change イベントを使用する必要があります。
|
Basic widgets
Basic widgets category includes main components.
These are the most important elements of the screen. |
基本的なウィジェット カテゴリには、主要なコンポーネントが含まれます。
これらは、画面の最も重要な要素です。 |
Arc
You can draw an arc or create an interactive circle slider by using Arc widget. The arc consists of three elements:
- Background - The background of the arc
- Indicator - Using the arc as a curved bar, it indicates its value
- Knob - Using the arc as a curved slider, it gives a knob to the slider
Parameters of Arc Widget
- Range min, max - It defines the minimum and maximum values of the arc
- Value - Starter value
- Bg start, end angle - Start / End angle of the background in degrees
- Start, end angle - Start / End angle of the indicator in degrees
- Mode - You can choose from 3 different modes.
- Normal - The indicator arc is drawn from the minimum value to the current.
- Reverse - The indicator arc is drawn counter-clockwise from the maximum value to the current.
- Symmetrical - The indicator arc is drawn from the middle point to the current value.
- Rotation - An offset to the 0 degree position can be added
Style parts
- Main
- Indicator
- Knob
アーク ウィジェットを使用して、アークを描画したり、インタラクティブなサークル スライダーを作成したりできます。 円弧は次の 3 つの要素で構成されます。 背景 - 円弧の背景
インジケーター - 円弧を曲線のバーとして使用し、その値を示します
ノブ - 円弧をカーブしたスライダーとして使用し、スライダーにノブを与えます
アークウィジェットのパラメータ
- 範囲最小、最大 - 円弧の最小値と最大値を定義します
- 値 - スターター値
- Bg start, end angle - 背景の開始/終了角度 (度単位)
- 開始、終了角度 - インジケーターの開始/終了角度 (度単位)
- モード - 3 つの異なるモードから選択できます。
- 通常 - インジケーター アークは、最小値から現在まで描画されます。
- リバース - インジケーター アークは、最大値から現在まで反時計回りに描かれます。
- 対称 - インディケータ アークは、中間点から現在の値まで描画されます。
- 回転 - 0 度の位置へのオフセットを追加できます
スタイルパーツ
- 主要
- インジケータ
- つまみ
Button
Image
Label
Panel
Text Area
Controller widgets
Calendar
Checkbox
Colorwheel
Dropdown
Image button
Keyboard
Roller
Slider
Switch
Visualiser widgets
Bar
Chart
Spinner