【SwiftUI】Toggleの使い方

SwiftUI

今回はToggleボタンの使い方について説明します。設定とかでよく使う、オンオフを切り替えるアレです。

環境

  • Xcode13.0
  • 動作はシミュレーターのiPhone13 miniで確認

Toggleの基本的な使い方

基本的には以下のようなコードで使用できます。

Toggle("ラベル", isOn : $isOn)

第1引数にはこのToggleについての説明をするStringを設定します。第2引数には、状態を表すBool型のプロパティを指定します。isOnは@State等で宣言をしておく必要があります。

最もシンプルな実装例は以下になります。

struct ContentView: View {
    @State private var isOn = true
        var body: some View {
            Toggle("トグル", isOn: $isOn)
        }
}

見た目のカスタマイズ

foregroundColorを制定することでテキストの色を、SwitchToggleStyleでボタンの色を変更できます。

struct ContentView: View {
    @State private var isOn = true
        var body: some View {
            Toggle("トグル", isOn: $isOn)
                .foregroundColor(.red)
                .toggleStyle(SwitchToggleStyle(tint: .orange))
        }
}

また、このtoggleStyleで様々な見た目のトグルボタンを実装できるのですが、長くなるのでその方法は次回説明しようと思います。

コメント

タイトルとURLをコピーしました