SwiftUI TabView PageTabViewStyle 崩溃而不显示任何错误答案

【问题标题】：SwiftUI TabView PageTabViewStyle crashes without showing any errorSwiftUI TabView PageTabViewStyle 崩溃而不显示任何错误
【发布时间】：2021-08-11 14:04:31
【问题描述】：

我正在尝试使用 tabview 创建一个图像轮播并从 firebase 加载图片。不显示任何错误消息或代码 tabview 崩溃。请说明这里出了什么问题。

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)")
    }
}

【问题讨论】：

标签： ios swift swiftui scrollview swiftui-tabview

【解决方案1】：

如果你打开 SwiftUI 模块源代码，你会看到 TabView 顶部的评论：

选项卡视图仅支持Text、Image 或图像类型的选项卡项其次是文字。传递任何其他类型的视图会导致可见但空标签项。

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

更新我制作了一个库，它释放了 SwiftUI _PageView，它可以用来构建一个漂亮的标签栏。检查我的story。

【讨论】：

感谢您的信息。知道我们如何使用轮播显示链接中的图像吗？就像它应该是自动滚动的，每个图像都应该是可点击的。非常感谢您的帮助。
我有可行的解决方案，但值得将其作为 GitHub 上的库。
太好了。你能指导我实现这一目标吗？
这个开源库支持任何类型的视图作为选项卡项。 github.com/xmartlabs/PagerTabStripView
嘿@Mac_Play 请检查我的答案的更新 - 现在有一种非常好的原生方式来构建标签。

【解决方案2】：

最近在运行 iOS 14.5...id() 修饰符添加到TabView 解决了它。示例：

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

【讨论】：