Tab

관련된 콘텐츠를 그룹화하고, 한 번에 하나의 콘텐츠만 표시하는 네비게이션 요소입니다. 제한된 공간에서 여러 정보를 효율적으로 구성할 때 사용하며, 사용자가 콘텐츠 간 빠르게 전환할 수 있도록 돕습니다.

@MainActor struct Tab

Overview

Tab은 여러 항목 중 하나를 선택할 수 있는 수평 탭 메뉴를 제공합니다. 선택된 탭은 하단에 강조 표시되며, 탭 너비와 크기를 다양하게 커스터마이징할 수 있습니다.

@State private var selectedTab = 0
let tabItems = ["전체", "인기", "최신", "추천"]

Tab(selectedIndex: $selectedTab, items: tabItems) { index in
    print("탭 \(index) 선택됨")
}
.size(.medium)
.resize(.fill)
.horizontalPadding(true)

Topics

Initializers

init(selectedIndex: Binding<Int>, items: [String], itemDisabled: (_ index: Int) -> Bool, actions: (Int) -> Void)

탭 컴포넌트를 초기화합니다.

  • Parameters
    ParameterDescription
    selectedIndex현재 선택된 탭의 인덱스를 바인딩하는 변수
    items탭 항목 텍스트 배열
    itemDisabled탭 항목 비활성화 여부를 결정하는 클로저, 인덱스를 파라미터로 받음, 생략하면 기본값으로 false를 리턴하는 클로저 적용
    actions탭 선택 시 호출되는 클로저, 선택된 인덱스를 파라미터로 받음, 생략하면 기본값으로 빈 클로저 적용

Instance Properties

var body: some View

뷰의 내용과 동작을 정의합니다.

Instance Methods

func horizontalPadding(Bool) -> Tab

탭 컴포넌트의 좌우 여백 사용 여부를 설정합니다.

  • Parameters

    ParameterDescription
    horizontalPadding좌우 여백 사용 여부, 생략하면 기본값으로 true 적용

  • Return Value

    수정된 Tab 인스턴스

func iconButton(Icon, action: () -> Void) -> Tab

탭 컴포넌트의 오른쪽에 아이콘 버튼을 추가합니다.

  • Parameters

    ParameterDescription
    icon표시할 아이콘
    action아이콘 버튼 탭 시 실행될 클로저

  • Return Value

    수정된 Tab 인스턴스

  • Discussion

    .resize(.hug) 모드에서만 표시됩니다.

func resize(Resize) -> Tab

탭 아이템의 너비 조정 방식을 설정합니다.

  • Parameters

    ParameterDescription
    resize탭 아이템 너비 조정 방식

  • Return Value

    수정된 Tab 인스턴스

func size(Size) -> Tab

탭 컴포넌트의 크기를 설정합니다.

  • Parameters

    ParameterDescription
    size적용할 탭 크기

  • Return Value

    수정된 Tab 인스턴스

Enumerations

enum Resize

탭 아이템 너비를 결정하는 열거형입니다.

Enumeration Cases

case fill

전체 너비를 균등하게 분할하여 탭 아이템 배치

case hug

콘텐츠 크기에 맞게 탭 아이템의 너비 조정

enum Size

탭 아이템의 크기를 결정하는 열거형입니다.

Enumeration Cases

case large

큰 크기

case medium

중간 크기

case small

작은 크기

Relationships

Conforms To

Swift.Sendable

SwiftUICore.View

© 2026 Wanted Lab, Inc.