[SwiftUI]セグメントピッカー(segmented picker)の横幅(width)を変えるには？

どうも、ちょげ(@chogetarou)です。

SegmentedPickerStyleのPickerの横幅を変える方法を紹介します。

方法
使用例

方法

SegementedPickerの横幅を変えるには、frame修飾子を使います。

まず、Pickerにframe修飾子を付与します。

そして、frameの引数「width」に横幅を指定します。

Picker(・・・)
    .pickerStyle(SegmentedPickerStyle())
    .frame(width : width) //widthに横幅を指定

frame修飾子を使うことで、セグメントのPickerの横幅を変えることができます。

セグメントピッカーの高さをframe修飾子で変えることはできません。

高さは、scaleEffect修飾子で変えることができます。

ただ、scaleEffect修飾子を使った場合、レイアウトが崩れる可能性があります。

使用例

struct ContentView: View {
    
    @State private var selectedIndex = 0
    
    var body: some View {
        VStack {
            
            Picker(selection: $selectedIndex, label: Text("Select").foregroundColor(.red)) {
                ForEach(0..<3) {
                    Text("Item \($0)")
                }
            }
            .pickerStyle(SegmentedPickerStyle())
            .frame(width : 200)
            
        }
    }
}