Divider-V
Divider-Vウィジェットは、コンテンツの間を縦線で分ける区切り線です。
横に並べて配置した項目の間に縦の境界線を入れるときに使います。
定義・役割
Divider-Vウィジェットは、縦方向の細い線を描いて左右のコンテンツを視覚的に区切ります。線の太さ・色、上下の余白、そして線が占める横幅を設定できます。
- カテゴリー: Dividers(区切り線・余白)
- ドロップ時:
100 × 100サイズのSizedBoxの中に縦の区切り線が描かれます。(このSizedBoxはStylesパネルにパーツとして表示されます)線の太さ・色などの区切り線プロパティは未設定なので、線自体はアプリテーマのデフォルトスタイルで描かれます。
機能
| 機能 | 説明 |
|---|---|
| 縦の区切り | 横に配置されたコンテンツの間に縦線を描いて領域を分けます。 |
| 線のスタイル | 線の太さ(thickness)と色(color)を設定します。 |
| 余白・幅の調整 | 線の上(indent)・下(endIndent)の余白と、線が占める横幅(width)を調整します。 |
使い方
- 左のウィジェットパレットでDividersカテゴリーを開きます。
- Divider-V項目をキャンバスにドラッグ&ドロップします。
- 右のプロパティパネルで、線の太さ(
thickness)と色(color)を希望の値に調整します。 - 必要に応じて、上下の余白(
indent・endIndent)と横幅(width)を設定します。
プロパティ
| プロパティ | 説明 | デフォルト値 | 値 / タイプ |
|---|---|---|---|
width | 区切り線が占める横幅(線はこの幅の中央に描かれます) | 未設定 | 数値(px) |
thickness | 実際に描かれる線の太さ | 未設定 | 数値(px) |
indent | 線の上(始点)の空き余白 | 未設定 | 数値(px) |
endIndent | 線の下(終点)の空き余白 | 未設定 | 数値(px) |
color | 線の色 | 未設定 | カラー |
注意・ヒント
ヒント
すべてのプロパティを空のまま(未設定)にすると、アプリテーマのデフォルトの区切り線スタイルで描かれます。線を目立たせたい場合は、thicknessとcolorを直接指定してください。
注記
widthは線自体の太さではなく、区切り線が占める横幅です。実際の線の太さはthicknessで調整し、線はこの幅の中央に描かれます。
さらに詳しく
ヒント
このウィジェットをスクリプトで制御するWidget Control(Property・Method・Event)の全体は、Divider-V Widget Controlドキュメントでご確認ください。