SwiftUI TabView PageTabViewStyle崩溃没有显示任何错误

Question

我正在尝试使用tabview和从firebase加载图片创建图像轮播。没有显示任何错误信息或代码表视图崩溃。请说明这里出了什么问题。

struct HomeView : View{
var body : View{
NavigationView{
VStack{
ScrollView{
CategoryView(homeViewModel: homeViewModel)
PosterView(homeViewModel: homeViewModel)
}
}
.navigationBarTitleDisplayMode(.inline)
.navigationBarTitle("")
}
}
}

struct PosterView : View {
@StateObject var homeViewModel : HomeViewModel = HomeViewModel()
@State var currentIndex: Int = 0
var timer = Timer.publish(every: 3, on: .main, in: .common)
func next(){
withAnimation{
currentIndex = currentIndex < homeViewModel.posterList.count ? currentIndex + 
1 : 0
}
}

var body: some View{
Divider()
GeometryReader{ proxy in
VStack{
TabView(selection: $currentIndex){
ForEach(homeViewModel.posterList){ item in
let imgURL = homeViewModel.trendingImgDictionary[item.id ?? ""]
AnimatedImage(url: URL(string: imgURL ?? ""))
}
}.tabViewStyle(PageTabViewStyle())
.padding()
.frame(width: proxy.size.width, height: proxy.size.height)
.onReceive(timer) { _ in
next()
}
.onTapGesture {
print("Tapped")
}

}
}
}
}

ViewModel:它包含两个从Firebase获取数据和图片的方法。这工作得很好，我得到了适当的数据。唯一的问题是在显示它时tabview崩溃而没有显示任何错误消息。

class HomeViewModel : ObservableObject {
@Published var posterList : [TrendingBanner] = []
@Published var trendingImgDictionary : [String : String] = [:]
init() {
self.fetchTrendingList()
}
func fetchTrendingList()  {
self.posterList.removeAll()
firestore.collection(Constants.COL_TRENDING).addSnapshotListener { snapshot, error in
guard let documents = snapshot?.documents else{
print("No Documents found")
return
}
self.posterList = documents.compactMap({ (queryDocumentSnapshot) -> TrendingBanner? in
return try? queryDocumentSnapshot.data(as:TrendingBanner.self )
})
print("Trending list (self.posterList.count)")
print(self.posterList.first?.id)
let _ = self.posterList.map{ item in
self.LoadTrendingImageFromFirebase(id: item.id ?? "")
}
}
}

func LoadTrendingImageFromFirebase(id : String) {
let storageRef = storageRef.reference().child("trending/(id)/(id).png")
storageRef.downloadURL { (url, error) in
if error != nil {
print((error?.localizedDescription)!)
return
}
self.trendingImgDictionary[id] = url!.absoluteString
print("Trending img (self.trendingImgDictionary)")
}
}

Answer 1

如果你打开SwiftUI模块源代码，你会看到TabView顶部的注释:

选项卡视图仅支持Text、Image类型的选项卡项或图像然后是文本。传递任何其他类型的视图都会导致一个可见的但是

您正在使用AnimatedImage,TabView可能不支持。

我做了一个库来解放SwiftUI_PageView，它可以用来构建一个漂亮的标签栏。看看我的报道。

Answer 2

最近在运行iOS 14.5的设备上遇到了同样的问题。在TabView上添加.id()修饰符解决了这个问题。例子:

TabView(selection: $currentIndex) {
ForEach(homeViewModel.posterList) { item in
content(for: item)
}
}
.tabViewStyle(PageTabViewStyle())
.id(homeViewModel.posterList.count)