我有一个应用程序，该应用程序从远程API获取带有图像URL的项目列表，然后必须从该项目位置内的给定url获取每个项目的图像。 问题是，当上下滚动从而从视图中删除列表项并将它们移回到视图中时，它们确实会显示出来。但是，在初始加载时，它们永远保持“加载”状态，直到移出和移入。 我的代码：
import SwiftUI
struct ContentView: View {
@EnvironmentObject var artObjectStore: ArtObjectStore
@State private var pageCount = 1
@State private var tappedLink: String? = nil
@Environment(\.imageCache) var cache: ImageCache
var body: some View {
NavigationView {
Form {
Section(header: Text("Art")) {
List {
ForEach(artObjectStore.artObjects, id: \.self) { artObject in
self.link(for: artObject)
}
Button(action: loadMore) {
Text("")
}
.onAppear {
DispatchQueue.global(qos: .background).asyncAfter(deadline: DispatchTime(uptimeNanoseconds: 10)) {
self.loadMore()
}
}
}
}
}
.navigationBarTitle("Art objects")
}
.onAppear(perform: loadMore)
}
func loadMore() {
pageCount += 1
artObjectStore.loadMore(pageCount)
}
private func link(for artObject: ArtObject) -> some View {
let selection = Binding(get: { self.tappedLink },
set: {
UIApplication.shared.endEditing()
self.tappedLink = $0
})
return NavigationLink(destination: DetailView(artObject: artObject, cache: self.cache),
tag: artObject.id,
selection: selection) {
HStack(alignment: .center) {
VStack(alignment: .leading){
Text("\(artObject.title)").font(.system(size: 12))
Text("\(artObject.principalOrFirstMaker)").font(.system(size: 9)).foregroundColor(.gray)
}
Spacer()
AsyncImage(
url: URL(string: artObject.headerImage.url)!,
cache: self.cache,
width: 200,
height: 50
)
}
}
}
}
extension UIApplication {
func endEditing() {
sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
图片容器：
import SwiftUI
import Combine
import Foundation
class ImageLoader: ObservableObject {
let objectWillChange = ObservableObjectPublisher()
private var cancellable: AnyCancellable?
@Published var image: UIImage? {
willSet {
objectWillChange.send()
}
}
private let url: URL
private var cache: ImageCache?
init(url: URL, cache: ImageCache? = nil) {
self.url = url
self.cache = cache
}
deinit {
cancellable?.cancel()
}
private func cache(_ image: UIImage?) {
image.map { cache?[url] = $0 }
}
func load() {
if let image = cache?[url] {
self.image = image
return
}
cancellable = URLSession.shared.dataTaskPublisher(for: url)
.map { UIImage(data: $0.data) }
.replaceError(with: nil)
.handleEvents(receiveOutput: { [weak self] in self?.cache($0) })
.receive(on: DispatchQueue.main)
.assign(to: \.image, on: self)
}
func cancel() {
cancellable?.cancel()
}
}
struct AsyncImage: View {
@ObservedObject private var loader: ImageLoader
private let width: CGFloat?
private let height: CGFloat?
@State var spin = false
init(url: URL, cache: ImageCache? = nil, width: CGFloat? = nil, height: CGFloat? = nil) {
loader = ImageLoader(url: url, cache: cache)
self.width = width
self.height = height
}
var body: some View {
image
.onAppear(perform: loader.load)
.onDisappear(perform: loader.cancel)
}
private var image: some View {
Group {
if loader.image != nil {
Image(uiImage: loader.image!)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: width, height: height)
} else {
Image("loadingCircle")
.resizable()
.frame(width: 20, height: 20)
.rotationEffect(.degrees(spin ? 360 : 0))
.animation(Animation.linear(duration: 0.8).repeatForever(autoreverses: false))
.onAppear() {
self.spin.toggle()
}
}
}
}
}
protocol ImageCache {
subscript(_ url: URL) -> UIImage? { get set }
}
struct TemporaryImageCache: ImageCache {
private let cache = NSCache<NSURL, UIImage>()
subscript(_ key: URL) -> UIImage? {
get { cache.object(forKey: key as NSURL) }
set { newValue == nil ? cache.removeObject(forKey: key as NSURL) : cache.setObject(newValue!, forKey: key as NSURL) }
}
}
struct ImageCacheKey: EnvironmentKey {
static let defaultValue: ImageCache = TemporaryImageCache()
}
extension EnvironmentValues {
var imageCache: ImageCache {
get { self[ImageCacheKey.self] }
set { self[ImageCacheKey.self] = newValue }
}
}
我确实尝试在图像上添加willSet，但这似乎不起作用。你能帮我吗？
答案 0 :(得分：0)
以下所有内容均通过Xcode 11.4 / iOS 13.4进行了测试
修改后的作品Model: "sequential_33"
_________________________________________________________________
Layer (type) Output Shape Param #
=================================================================
masking_24 (Masking) (None, 2720, 16) 0
_________________________________________________________________
lstm_61 (LSTM) (None, 2720, 32) 6272
_________________________________________________________________
dropout_51 (Dropout) (None, 2720, 32) 0
_________________________________________________________________
lstm_62 (LSTM) (None, 16) 3136
_________________________________________________________________
dropout_52 (Dropout) (None, 16) 0
_________________________________________________________________
dense_67 (Dense) (None, 16) 272
_________________________________________________________________
dense_68 (Dense) (None, 8) 136
_________________________________________________________________
dense_69 (Dense) (None, 1) 9
=================================================================
Total params: 9,825
Trainable params: 9,825
Non-trainable params: 0
_________________________________________________________________
我将ValueError Traceback (most recent call last)
<ipython-input-354-afdba8dea179> in <module>()
----> 1 model.fit(train_x, train_y, epochs=1000, batch_size=128,validation_split = 0.2, callbacks=[tensorboard_callback,checkpoint])
5 frames
/usr/local/lib/python3.6/dist-packages/tensorflow_core/python/keras/engine/training_utils.py in check_loss_and_target_compatibility(targets, loss_fns, output_shapes)
808 raise ValueError('A target array with shape ' + str(y.shape) +
809 ' was passed for an output of shape ' + str(shape) +
--> 810 ' while using as loss `' + loss_name + '`. '
811 'This loss expects targets to have the same shape '
812 'as the output.')
更改为AsyncImage，并开始更新
Group修改后的图片加载器
VStack