如何解决如何从图像选择器中获取图像并显示为添加表单?
我有下面的结构来处理图像选择器,但我无法将选定的图像传递给要显示的视图。下面的选定路径打印文件的正确位置,但如何将此选定文件分配给图片到视图中?
struct FileView: View {
var body: some View {
Button("Select File") {
let openPanel = NSOpenPanel()
openPanel.prompt = "Select File"
openPanel.allowsMultipleSelection = false
openPanel.canChooseDirectories = false
openPanel.canCreateDirectories = false
openPanel.canChooseFiles = true
openPanel.allowedFileTypes = ["png","jpg","jpeg"]
openPanel.begin { (result) -> Void in
if result.rawValue == NSApplication.ModalResponse.OK.rawValue {
let selectedPath = openPanel.url!.path
print(selectedPath)
}
}
}
}
}
在我显示所选图像的位置下方:
struct NewPost: View {
@Environment(\.presentationMode) var presentationMode
var postToEdit: Item?
var viewContext: NSManagedObjectContext
...
@State var fileUrl: URL?
var header: String {
postToEdit == nil ? "Create Post" : "Edit Post"
}
var body: some View {
...Form Code
// Displaying Image if its selected...
Section(header: Text("Picture").foregroundColor(Color("blue")).font(.title2)) {
if let fileUrl = fileUrl,let img = NSImage(contentsOf: fileUrl) {
Image(nsImage: img)
.resizable()
.scaledToFill()
.clipShape(Circle())
.overlay(Circle().stroke(Color.white,lineWidth: 1))
.opacity(1)
.frame(minWidth: 120,maxWidth: 120,minHeight: 120,maxHeight: 120)
}
if pic.count != 0 {
Image(nsImage: NSImage(data: pic)!)
.resizable()
.scaledToFill()
.clipShape(Circle())
.overlay(Circle().stroke(Color.white,lineWidth: 1))
.opacity(1)
.frame(minWidth: 120,maxHeight: 120)
}
}
.cornerRadius(10)
根据下面的回复更新了上面的代码。
提前致谢。
解决方法
您可以使用 Binding
将数据从子视图传递回父视图:
struct FileView: View {
@Binding var fileUrl : URL?
var body: some View {
Button("Select File") {
let openPanel = NSOpenPanel()
openPanel.prompt = "Select File"
openPanel.allowsMultipleSelection = false
openPanel.canChooseDirectories = false
openPanel.canCreateDirectories = false
openPanel.canChooseFiles = true
openPanel.allowedFileTypes = ["png","jpg","jpeg"]
openPanel.begin { (result) -> Void in
if result.rawValue == NSApplication.ModalResponse.OK.rawValue {
fileUrl = openPanel.url
}
}
}
}
}
struct ContentView: View {
@State var fileUrl: URL?
var body: some View {
VStack {
FileView(fileUrl: $fileUrl)
if let fileUrl = fileUrl,let image = NSImage(contentsOf: fileUrl) {
Image(nsImage: image)
}
}
}
}
请注意,在子进程中,它是 @Binding
,而在父进程中,它是 @State
。
更新版本,使用Data
:
struct FileView: View {
@Binding var fileData : Data?
var body: some View {
Button("Select File") {
let openPanel = NSOpenPanel()
openPanel.prompt = "Select File"
openPanel.allowsMultipleSelection = false
openPanel.canChooseDirectories = false
openPanel.canCreateDirectories = false
openPanel.canChooseFiles = true
openPanel.allowedFileTypes = ["png","jpeg"]
openPanel.begin { (result) -> Void in
if result.rawValue == NSApplication.ModalResponse.OK.rawValue {
guard let url = openPanel.url,let data = try? Data(contentsOf: url) else {
//handle errors here
return
}
fileData = data
}
}
}
}
}
struct ContentView: View {
@State var fileData: Data?
var body: some View {
VStack {
FileView(fileData: $fileData)
if let fileData = fileData,let image = NSImage(data: fileData) {
Image(nsImage: image)
}
}
}
}
注意:显然,对于无法从 URL 或本示例中的任何内容读取的内容,不做任何错误处理
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。