当用户从照片库中选择图像时如何显示另一个视图

时间:2021-01-09 15:03:18

标签: swiftui

我的问题是我无法在另一个视图中显示所选图像,因为我无法将变量 selected 设置为 true。

我的变量:

@State private var selectedImage: UIImage?
@State private var isImagePickerDisplay = false
@State private var selected: Bool = false

第 1 步 - 我为用户展示 ImagePicker(工作正常):

.sheet(isPresented: self.$isImagePickerDisplay) {
        ImagePickerView(selectedImage: self.$selectedImage, sourceType: .photoLibrary)
}

第 2 步 - 我找不到正确的方法来了解用户何时实际选择了图像。我试着这样做:

if selectedImage != nil {
        selected = true
}

但我得到错误:

<块引用>

类型'()'不能符合'View';只有 struct/enum/class 类型才能符合协议

第 3 步 - 然后我的计划是在用户实际从照片库中选择图像时显示另一个视图:

.fullScreenCover(isPresented: $selected) {
        EditView(selectedImage: $selectedImage)
}

请记住,我是 SwiftUI 的新手。我刚刚完成了教程,现在我正在尝试自己开发一个项目。

编辑(添加了我的整个 ContentView()):

struct ContentView: View {
    @State private var selectedImage: UIImage?
    @State private var isImagePickerDisplay = false
    @State private var selected: Bool = false
    
    var body: some View {
        Button(action: {
            self.isImagePickerDisplay.toggle()
        }) {
            Image(systemName: "plus")
                .renderingMode(.original)
                .font(.system(size: 16, weight: .medium))
                .aspectRatio(contentMode: .fit)
                .frame(width: 36, height: 36)
                .background(Color(.white))
                .clipShape(Circle())
                .shadow(radius: 10)
        }.sheet(isPresented: self.$isImagePickerDisplay) {
            ImagePickerView(selectedImage: self.$selectedImage, sourceType: .photoLibrary)
        }
        
        if selectedImage != nil {
            selected = true
        }
        
        .fullScreenCover(isPresented: $selected) {
            EditView(selectedImage: $selectedImage)
        }
    }
}

2 个答案:

答案 0 :(得分:0)

可能的解决方案

struct ContentView: View {
    
    private enum SheetType {
        case pickImage, showImage
    }
    
    @State private var selectedImage: UIImage?
    @State private var selected: Bool = false
    
    @State private var currentSheetType: SheetType = .pickImage
    
    var body: some View {
        Button(action: {
            self.selected.toggle()
            self.currentSheetType = .pickImage
        }) {
            Image(systemName: "plus")
                .renderingMode(.original)
                .font(.system(size: 16, weight: .medium))
                .aspectRatio(contentMode: .fit)
                .frame(width: 36, height: 36)
                .background(Color(.white))
                .clipShape(Circle())
                .shadow(radius: 10)
        }
        .sheet(isPresented: self.$selected) {
            if currentSheetType == .pickImage {
                if selectedImage != nil {
                    self.selected.toggle()
                    self.currentSheetType = .showImage
                }
            }
        } content: {
            if currentSheetType == .pickImage {
                ImagePickerView(selectedImage: self.$selectedImage, sourceType: .photoLibrary)
            } else if currentSheetType == .showImage {
                EditView(selectedImage: $selectedImage)
            }
        }
    }
}

答案 1 :(得分:0)

可能你想要这个

struct DFContentView: View {
    @State private var selectedImage: UIImage?
    @State private var isImagePickerDisplay = false
    @State private var selected: Bool = false
    
    var body: some View {
        VStack {
            Button(action: {
                self.isImagePickerDisplay.toggle()
            }) {
                Image(systemName: "plus")
                    .renderingMode(.original)
                    .font(.system(size: 16, weight: .medium))
                    .aspectRatio(contentMode: .fit)
                    .frame(width: 36, height: 36)
                    .background(Color(.white))
                    .clipShape(Circle())
                    .shadow(radius: 10)
            }
            .sheet(isPresented: self.$isImagePickerDisplay, onDismiss: {  // << here !!
                self.selected = selectedImage != nil
            }) {
                ImagePickerView(selectedImage: self.$selectedImage, sourceType: .photoLibrary)
            }
            EmptyView()
                .fullScreenCover(isPresented: $selected) {
                    EditView(selectedImage: $selectedImage)
                }
        }
    }
}

更新: 感谢 @RajaKishan,关于 iOS 14.2 - 更新为将 .sheet.fullScreenCover 分隔成不同的视图。经测试有效。