Segmented control

WantedSegmentedControl

문자열 리스트 기반의 Segmented Control 컴포넌트입니다. 선택된 항목을 강조 표시하며, 애니메이션되는 Knob으로 선택 상태를 표현합니다.

val items = listOf("전체", "읽음", "안읽음")
var selectedIndex by remember { mutableIntStateOf(0) }

WantedSegmentedControl(
    items = items,
    selectedIndex = selectedIndex,
    onClick = { selectedIndex = it }
)

Parameters

Overload

사용자 정의 항목으로 구성할 수 있는 Segmented Control 컴포넌트입니다. 각 항목을 커스텀 컴포넌트로 구성할 수 있으며, 선택 애니메이션은 Knob 위치 이동으로 표현됩니다. iconOnly = true 로 설정하면 각 세그먼트가 사이즈별 고정 너비로 배치되고, [LocalWantedSegmentedIconOnly] 를 통해 하위 [WantedSegmentedControlItem] 이 아이콘 전용으로 렌더링됩니다.

var selectedIndex by remember { mutableIntStateOf(0) }

WantedSegmentedControl(
    itemCount = 3,
    selectedIndex = selectedIndex,
    item = { index ->
        WantedSegmentedControlItem(
            title = "옵션 $index",
            isSelected = index == selectedIndex,
            icon = { Icon(...) }
        )
    },
    onClick = { selectedIndex = it }
)

Advanced

WantedSegmentedControlItem

SegmentedControl 내 개별 항목을 구성하는 컴포넌트입니다. 선택 여부에 따라 텍스트·아이콘 색상이 변경되며, 선택 시 강조 색상(foregroundNeutralPrimary)이 적용됩니다. 사이즈별 타이포·아이콘 크기·간격은 [LocalWantedSegmentedSize] 로 전달된 값을 따릅니다. 아이콘 전용(Icon Only) 여부는 파라미터가 아니라 상위 컨트롤이 제공하는 [LocalWantedSegmentedIconOnly] 로 결정됩니다. 컨트롤([WantedSegmentedControl])에서 iconOnly = true 로 설정하면 이 항목은 텍스트 없이 아이콘만 중앙 정렬하며, 사이즈별 고정 너비(iconOnlyWidth)를 갖습니다. 아이콘 크기도 icon + text 모드(iconSize)보다 한 단계 큰 iconOnlyIconSize 를 사용합니다. 아이콘 슬롯은 사이즈별 크기(iconSize / iconOnlyIconSize)를 가진 Box 로 감쌉니다. 이 Box 는 최대 크기만 제한하므로 슬롯보다 작은 아이콘은 확대되지 않습니다. 스펙 크기로 꽉 채우려면 호출측에서 아이콘에 Modifier.fillMaxSize() 를 지정해야 합니다. (Modifier.requiredSize 처럼 제약을 무시하는 Modifier 는 슬롯을 벗어나므로 사용하지 않습니다.)

// text / icon + text
WantedSegmentedControlItem(
    title = "알림",
    isSelected = true,
    icon = { Icon(modifier = Modifier.fillMaxSize(), ...) }
)

// icon only — 컨트롤에서 iconOnly = true 를 지정하면 title 없이 아이콘만 렌더링됩니다.
WantedSegmentedControlItem(
    isSelected = true,
    icon = { Icon(modifier = Modifier.fillMaxSize(), ...) }
)

WantedSegmentedDefaults

SegmentedControl 컴포넌트에서 사용하는 설정값을 정의하는 객체입니다.

Enum

SegmentedSize