如何从View对象调用ContentView函数?

时间:2020-02-24 02:37:31

标签: swift xcode view swiftui

我有一个演示来演示我的问题,您可以在下面查看。我想要此SwipeBar更改主ContentView的背景颜色,但我不知道该怎么做。我之前使用过ObservableObject来完成类似的操作,但是View的类型不能为ObservableObject,因此我不确定如何使SwipeBar与创建它的ContentView“通信”。有什么办法吗?

此代码的作用的快速预览:https://imgur.com/gallery/JhomUmu

整个ContentView.swift:

import SwiftUI

struct ContentView: View {

    @State var backGroundColor: Color = .purple

    var body: some View {
        VStack {
            Spacer()

            SwipeBar()

            Spacer()
        }.background(backGroundColor)
    }

    func changeBackgroundColor(color: Color) {
        self.backGroundColor = color
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

整个SwipeBar.swift:

import SwiftUI

struct SwipeBar: View {

    @State var draggedOffset = CGSize.zero
    @State var greenOpacityLevel: Double = 0.3
    @State var redOpacityLevel: Double = 0.3

    var body: some View {
        ZStack {
            ZStack {
                HStack {
                    ZStack {
                        RoundedRectangle(cornerRadius: 30, style: .continuous)
                            .fill(Color.green)
                            .frame(width: 100, height: 70)
                        Text("GREEN")
                            .padding(10)
                            .foregroundColor(.white)
                            .font(.system(size: 25))
                    }.padding(.leading, 20)
                     .opacity(self.greenOpacityLevel)

                    Spacer()

                    ZStack {
                        RoundedRectangle(cornerRadius: 30, style: .continuous)
                            .fill(Color.red)
                            .frame(width: 100, height: 70)
                        Text("RED")
                            .padding(10)
                            .foregroundColor(.white)
                            .font(.system(size: 25))
                    }.padding(.trailing, 20)
                     .opacity(self.redOpacityLevel)
                }

                ZStack {
                    RoundedRectangle(cornerRadius: 30, style: .continuous)
                        .fill(Color.blue)
                        .frame(width: 375, height: 70)
                    Text("SWIPE LEFT OR RIGHT")
                        .foregroundColor(.white)
                        .font(.system(size: 20))
                }
                .offset(x: self.draggedOffset.width)
                .gesture(DragGesture(minimumDistance: 20, coordinateSpace: .local)
                .onChanged { value in
                    self.draggedOffset = value.translation

                    if self.draggedOffset.width >= 120 {
                        self.greenOpacityLevel = 1.0
                        self.draggedOffset.width = 120
                    } else {
                        self.greenOpacityLevel = 0.4
                    }

                    if self.draggedOffset.width <= -120 {
                        self.redOpacityLevel = 1.0
                        self.draggedOffset.width = -120
                    } else {
                        self.redOpacityLevel = 0.4
                    }
                }
                .onEnded { value in
                    if self.draggedOffset.width <= -120 {
                        // Call the ContentView's changeBackGround function and pass in Color.red
                        print("background should change to red")
                    }
                    if self.draggedOffset.width >= 120 {
                        // Call the ContentView's changeBackGround function and pass in Color.green
                        print("background should change to green")
                    }
                    self.draggedOffset = CGSize.zero
                    self.redOpacityLevel = 0.4
                    self.greenOpacityLevel = 0.4
                    }
                )
            }
        }
    }
}

真正的问题在于代码的最后一部分。如何调用ContentView的功能来更改背景颜色?

if self.draggedOffset.width <= -120 {
    // Call the ContentView's changeBackGround function and pass in Color.red
    print("background should change to red")
}
if self.draggedOffset.width >= 120 {
    // Call the ContentView's changeBackGround function and pass in Color.green
    print("background should change to green")
}

1 个答案:

答案 0 :(得分:0)

SwipeBar更改为BindingColor

struct SwipeBar: View {
    @Binding var color: Color
    ...

,然后在color中的适当位置更新SwipeBar的值:

.onEnded { value in
    if self.draggedOffset.width <= -120 { self.color = .red }
    else if self.draggedOffset.width >= 120 { self.color = .green }
    ...
}

ContentView中,为Binding属性创建一个backGroundColor并将其传递给SwipeBar

SwipeBar(color: self.$backGroundColor)