SwiftUI:使用 .fileImporter 加载图像 [英] SwiftUI: loading images with .fileImporter
本文介绍了SwiftUI:使用 .fileImporter 加载图像的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
目标是使用新的 .fileImporter 修饰符加载 2 个不同的图像(图像 1 和 2).
Goal is to load 2 different images (image 1 and 2) with the new .fileImporter modifier.
问题是我将相同的图像加载到两个缩略图(图像 1 和 2)中.
Problem is I get the same image loaded to both thumbnails (image 1 and 2).
有没有人用 .fileImporter 修饰符做到这一点?
Have anyone managed to do that with .fileImporter modifier?
import SwiftUI
struct ContentView: View {
@State var openFile = false
@State var img1 = UIImage()
@State var img2 = UIImage()
@State var fileName = ""
var body: some View {
Form {
//image 1
Button(action: {
self.openFile.toggle()
}){
Image(uiImage: self.img1)
.renderingMode(.original)
.resizable()
.frame(width: 48, height: 48)
.clipShape(Circle())
}
//image 2
Button(action: {
self.openFile.toggle()
}){
Image(uiImage: self.img2)
.renderingMode(.original)
.resizable()
.frame(width: 48, height: 48)
.clipShape(Circle())
}
}
.navigationTitle("File Importer")
//file importer
.fileImporter(isPresented: $openFile, allowedContentTypes: [.image]) { (res) in
do{
let fileUrl = try res.get()
print(fileUrl)
self.fileName = fileUrl.lastPathComponent
fileUrl.startAccessingSecurityScopedResource()
if let imageData = try? Data(contentsOf: fileUrl),
let image = UIImage(data: imageData) {
self.img1 = image
self.img2 = image
}
fileUrl.stopAccessingSecurityScopedResource()
} catch{
print ("error reading")
print (error.localizedDescription)
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
推荐答案
嗯...我会将文件导入器移动到单独的视图中以根据点击的按钮使用绑定.
Well... I would move file importer into separated view to use binding depending on which button tapped.
更新:Form 的工作变体.使用 Xcode 12.1/iOS 14.1 测试
Update: worked variant for Form. Tested with Xcode 12.1 / iOS 14.1
struct ContentView: View {
@State private var openFile = false
@State private var img1 = UIImage()
@State private var img2 = UIImage()
@State private var target: Binding<UIImage>? // dynamic target for importer
var body: some View {
Form {
//image 1
Button(action: {
self.target = $img1
self.openFile.toggle()
}){
Image(uiImage: self.img1)
.renderingMode(.original)
.resizable()
.frame(width: 48, height: 48)
.clipShape(Circle())
}
//image 2
Button(action: {
self.target = $img2
self.openFile.toggle()
}){
Image(uiImage: self.img2)
.renderingMode(.original)
.resizable()
.frame(width: 48, height: 48)
.clipShape(Circle())
}
}
.navigationTitle("File Importer")
//file importer
.fileImporter(isPresented: $openFile, allowedContentTypes: [.image]) { (res) in
do{
let fileUrl = try res.get()
print(fileUrl)
guard fileUrl.startAccessingSecurityScopedResource() else { return }
if let imageData = try? Data(contentsOf: fileUrl),
let image = UIImage(data: imageData) {
self.target?.wrappedValue = image
}
fileUrl.stopAccessingSecurityScopedResource()
} catch{
print ("error reading")
print (error.localizedDescription)
}
}
}
}
这是可能的解决方案(保留以防万一)，但不适用于Form:
struct ImportContentView: View {
@State var openFile = false
@State var img1 = UIImage()
@State var img2 = UIImage()
var body: some View {
//Form { // << does not work for Form !!
VStack {
//image 1
Button(action: {
self.openFile.toggle()
}){
Image(uiImage: self.img1)
.renderingMode(.original)
.resizable()
.frame(width: 48, height: 48)
.clipShape(Circle())
.background(LoaderView(isActive: $openFile, image: $img1))
}
//image 2
Button(action: {
self.openFile.toggle()
}){
Image(uiImage: self.img2)
.renderingMode(.original)
.resizable()
.frame(width: 48, height: 48)
.clipShape(Circle())
.background(LoaderView(isActive: $openFile, image: $img2))
}
}
.navigationTitle("File Importer")
}
}
struct LoaderView: View {
@Binding var isActive: Bool
@Binding var image: UIImage
var body: some View {
Color.clear
.fileImporter(isPresented: $isActive, allowedContentTypes: [.image]) { (res) in
do{
let fileUrl = try res.get()
print(fileUrl)
guard fileUrl.startAccessingSecurityScopedResource() else { return }
if let imageData = try? Data(contentsOf: fileUrl),
let image = UIImage(data: imageData) {
self.image = image
}
fileUrl.stopAccessingSecurityScopedResource()
} catch{
print ("error reading")
print (error.localizedDescription)
}
}
}
}
这篇关于SwiftUI:使用 .fileImporter 加载图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
