SwiftUI：如何在自定义ButtonStyle中修改自定义Shape的颜色？

方案一：让自定义Shape响应环境中的foregroundColor #

这种方法让你的Shape和Text等原生视图保持一致的行为，通过foregroundColor修饰符控制填充色，无需额外环境变量。

步骤1：修改自定义Shape，读取环境色作为填充色 #

struct RingSegment: Shape {
    // 读取环境中的前景色
    @Environment(\.foregroundColor) private var foregroundColor
    
    func path(in rect: CGRect) -> Path {
        // 替换为你的自定义Shape绘制逻辑
        var path = Path()
        path.addArc(
            center: CGPoint(x: rect.midX, y: rect.midY),
            radius: rect.width / 2,
            startAngle: .degrees(0),
            endAngle: .degrees(90),
            clockwise: false
        )
        path.addLine(to: CGPoint(x: rect.midX, y: rect.midY))
        path.closeSubpath()
        return path
    }
    
    // 重写fill方法，使用环境色填充
    func fill() -> some View {
        self.fill(foregroundColor ?? .blue) // 环境色为空时使用默认色
    }
}

步骤2：修改Button的Label调用自定义fill方法 #

Button {
    action()
} label: {
    RingSegment().fill() // 调用我们定义的fill方法
}
.buttonStyle(LightGrayButtonStyle())

步骤3：保留原有的ButtonStyle #

你的LightGrayButtonStyle无需修改，foregroundColor的变化会自动传递给Shape：

struct LightGrayButtonStyle: ButtonStyle {
    func makeBody(configuration: Self.Configuration) -> some View {
        configuration.label
            .foregroundColor(configuration.isPressed ? .black : .red)
    }
}

方案二：通过自定义环境变量传递按压状态 #

如果需要更灵活的颜色控制（比如不依赖foregroundColor），可以通过自定义环境键传递按钮的按压状态，让Shape自行切换颜色。

步骤1：定义自定义环境键 #

private struct ButtonPressedKey: EnvironmentKey {
    static let defaultValue: Bool = false
}

extension EnvironmentValues {
    var isButtonPressed: Bool {
        get { self[ButtonPressedKey.self] }
        set { self[ButtonPressedKey.self] = newValue }
    }
}

步骤2：修改ButtonStyle注入按压状态 #

struct LightGrayButtonStyle: ButtonStyle {
    func makeBody(configuration: Configuration) -> some View {
        configuration.label
            .environment(\.isButtonPressed, configuration.isPressed)
    }
}

步骤3：修改Shape监听环境状态切换颜色 #

struct RingSegment: Shape {
    @Environment(\.isButtonPressed) private var isPressed
    
    func path(in rect: CGRect) -> Path {
        // 替换为你的自定义Shape绘制逻辑
        var path = Path()
        path.addArc(
            center: CGPoint(x: rect.midX, y: rect.midY),
            radius: rect.width / 2,
            startAngle: .degrees(0),
            endAngle: .degrees(90),
            clockwise: false
        )
        path.addLine(to: CGPoint(x: rect.midX, y: rect.midY))
        path.closeSubpath()
        return path
    }
    
    func fill() -> some View {
        self.fill(isPressed ? .black : .red)
    }
}

步骤4：使用Button #

Button {
    action()
} label: {
    RingSegment().fill()
}
.buttonStyle(LightGrayButtonStyle())

内容的提问来源于stack exchange，提问作者linus_hologram