Divider

Dividerは、画面上のコンテンツを区切る区切り線です。ヘッダーやテキストのリストに使用し、リスト項目を区切って読みやすくするためによく使われます。

Divider

区切り線の使用方法

区切り線を使用すると、コンテンツがどのように整理されているかをユーザーが理解しやすくなります。アバターやアイコンといった開始位置を示す要素がないコンテンツの場合、スペースだけではコンテンツの区切りがわかりにくいことがあります。区切り線はヘッダーとリストの両方で使用できます。

ヘッダー内の区切り線

区切り線を使用して、ヘッダーコンテンツとレイアウト要素を分離します。ユーザーがスクロールすると、区切り線とヘッダーの後ろにあるコンテンツがスクロールされます。

リスト内の区切り線

ユーザーがリスト内の各項目を個別に選択できるように、区切り線を使用して縦方向のリスト項目を区切ります。

良い例

horizontal divider line

ユーザーがリスト内の各項目を個別に選択できるように、区切り線を使用して縦方向のリスト項目を区切ります。

悪い例

horizontal divider line

横方向のリストには区切り線を使用しないでください。

試してみる

APLドキュメントの作成と編集を参照してください。

開発者向けドキュメント