SegmentedControl

値選択とニュートラルな Xcode 風タブロールを持つ、ネイティブのセグメントピッカーです。

#インポート

@quickgui/solid/swift-ui から SegmentedControl をインポートします。

import { Host, SegmentedControl } from "@quickgui/solid/swift-ui";

#使い方

<Host matchContents>
  <SegmentedControl
    role="tabs"
    selection={layout()}
    options={[
      { value: "list", label: "List" },
      { value: "grid", label: "Grid" },
    ]}
    onSelectionChange={setLayout}
  />
</Host>

#API リファレンス

項目を展開すると説明と完全なシグネチャが表示されます。ダッシュは宣言に既定値が記載されていないことを示します。

`SegmentedControl`

ソースを見る

SegmentedControl(props: SegmentedControlProps): NativeNode

testIDstring—

Stable identifier exposed to macOS accessibility and UI testing.

string

ソースを見る

modifiersViewModifier[]—

SwiftUI modifiers, applied in array order.

ViewModifier[]

ソースを見る

selectionstring—

Controlled selected option value.

string

ソースを見る

optionsreadonly PickerOption[]—

Declares options. Reactive JSX expressions update this property in place.

readonly PickerOption[]

ソースを見る

labelstring—

Declares label (optional). Reactive JSX expressions update this property in place.

string

ソースを見る

onSelectionChange(selection: string, event: QuickGuiEvent) => void—

Declares onSelectionChange (optional). Reactive JSX expressions update this property in place.

(selection: string, event: QuickGuiEvent) => void

ソースを見る

ref((node: NativeNode) => void) | NativeNode—

Declares ref (optional). Reactive JSX expressions update this property in place.

((node: NativeNode) => void) | NativeNode

ソースを見る

roleSegmentedControlRole—

Use `tabs` for Xcode-style neutral segmented tab navigation on macOS 27.

SegmentedControlRole

ソースを見る