[SwiftUI]Button(ボタン)の押している間(isPressed)の色(color)を変えるには？

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

Buttonのタップ中の色を変える方法を紹介します。

方法
使用例

方法

Buttonの押している間の色を変えるには、ButtonStyleを使います。

まず、ButtonStyleの構造体を用意します。

struct TapButtonStyle : ButtonStyle {
    func makeBody(configuration: Configuration) -> some View {
        configuration.label //Button本体
    }
}

そして、makeBodyメソッドの「configuration.label」にボタンの装飾をします。

また、makeBodyメソッドの引数「configuration」の「isPressed」プロパティで押している間に色が変わるようにします。

struct TapButtonStyle : ButtonStyle {
    func makeBody(configuration: Configuration) -> some View {
        configuration.label //Button本体
            .background(configuration.isPressed ? タップ中の色: 通常時の色)
    }
}

「configuration.isPressed」は、押している間は「true」、通常時は「false」になります。

最後に、用意したButtonStyleをButtonに適用します。

Button(・・・)
   .buttonStyle(TapButtonStyle())

ButtonStyleを使うことで、押している間の色を変えることが出来ます。

使用例

struct ContentView: View {
    var body: some View {
        VStack {
            Button(action: {
                print("Tap!")
            }){
                Text("Button")
            }
            .buttonStyle(TapButtonStyle())      
        }
    }
}

struct TapButtonStyle : ButtonStyle {
    func makeBody(configuration: Configuration) -> some View {
        configuration.label
            .foregroundColor(.white)
            .padding()
            .background(configuration.isPressed ? Color.red : Color.blue )
    }
}