List cell
콘텐츠를 하나의 리스트 단위로 표현하는 요소로, 이미지, 텍스트, 인터랙션 요소 등을 유연하게 조합하여 구성할 수 있습니다. 일관되고 정돈된 형태로 정보를 탐색할 수 있도록 돕습니다.
Inset, Full 2가지 형태를 제공합니다. Inset은 좌우 여백 없이 모서리를 둥글게 사용하고, Full은 좌우 여백을 포함해 컨테이너 너비를 모두 채워 사용합니다.
화면 레이아웃에 따라 상하 여백을 변경해 사용할 수 있습니다. 기본 제공하는 여백 외에 다른 값 적용이 필요한 경우 커스터마이징해 사용할 수 있습니다.
인터랙션과 구분선을 함께 쓰는 것을 권장하지 않습니다. 단순한 항목을 나열할 때에는 구분선을 지양하며 콘텐츠의 복잡도가 올라갈 시 구분선을 사용하여 화면의 명확성을 올립니다.
Selected 상태를 통해 사용자가 선택했음을 시각적으로 명확하게 표시할 수 있습니다. 선택되면 Label이 강조되고, Trailing content가 없을 때는 우측에 체크 아이콘이 표시됩니다. Leading content에 Checkbox나 Radio를 사용하는 경우에는 체크 아이콘을 함께 표시하지 않습니다.
Leading content, Trailing content, Label trailing, Extra content에 추가 요소를 넣어 부가적인 정보를 표기하거나 액션을 제공할 수 있습니다.
Label과 Description 텍스트는 최대 표시 줄 수를 초과한 경우 말줄임 처리합니다. 기본 최대 줄 수는 한 줄로 하되, 필요에 따라 최대 줄 수를 커스터마이징할 수 있습니다.
인터랙션 영역을 고려하여 간격, Divider 사용 여부를 정의합니다.
그룹 내에서 다른 형태의 Leading content를 함께 사용하지 않습니다.