Наложение прямоугольника при наведении курсора на пользовательскую кнопку

Question

Я пытаюсь определить собственный стиль кнопки, при наведении которого вокруг этой кнопки появляется прямоугольник.

struct CustomButtonStyle: ButtonStyle {
@State private var isOverButton = false

func makeBody(configuration: Self.Configuration) -> some View {

    ZStack {
        configuration.label
            .frame(minWidth: 0, maxWidth: .infinity)
            .padding()
            .foregroundColor(.white)
            .background(Color("Frost1"))
    }
    .padding(3)
    .onHover { over in
        self.isOverButton = over
        print("isOverButton:", self.isOverButton, "over:", over)
    }
    .overlay(VStack {
        if self.isOverButton {
            Rectangle()
                .stroke(Color("Frost1"), lineWidth: 2)
        } else {
            EmptyView()
        }
    })
}}

Строка печати показывает мне, что установка переменной isOverButton не работает. Какой тип состояния переменной я должен использовать, который можно обновить из onHover и обновить оверлей?

Answer 1

Вот решение. Протестировано с Xcode 11.4.

struct TestOnHoverButton: View {
    var body: some View {
        Button("Button") {}
            .buttonStyle(CustomButtonStyle())
    }
}

struct CustomButtonStyle: ButtonStyle {

    private struct CustomButtonStyleView<V: View>: View {
        @State private var isOverButton = false

        let content: () -> V

        var body: some View {
            ZStack {
                content()
                    .frame(minWidth: 0, maxWidth: .infinity)
                    .padding()
                    .foregroundColor(.white)
                    .background(Color.blue)
            }
            .padding(3)
            .onHover { over in
                self.isOverButton = over
                print("isOverButton:", self.isOverButton, "over:", over)
            }
            .overlay(VStack {
                if self.isOverButton {
                    Rectangle()
                        .stroke(Color.blue, lineWidth: 2)
                } else {
                    EmptyView()
                }
            })
        }
    }

    func makeBody(configuration: Self.Configuration) -> some View {
        CustomButtonStyleView { configuration.label }
    }
}