TabView 导致预览崩溃

Posted

技术标签:

【中文标题】TabView 导致预览崩溃【英文标题】:TabView causing preview to crash 【发布时间】:2021-02-19 21:18:42 【问题描述】:

我目前正在尝试在我的应用中制作特色游戏部分。我在 SwiftUI 中使用 TabView 来执行此操作,但遇到了预览崩溃的问题。我没有收到任何错误,也无法实时运行。下面是导致预览崩溃的视图代码。

import SwiftUI

struct FeaturedGamesView: View 
    var numberOfImages: Int
    @ObservedObject var featuredGames: GameQuery
    @State private var currentIndex: Int = 0
    
    private let timer = Timer.publish(every: 3, on: .main, in: .common).autoconnect()
    
    
    var body: some View 
     
        VStack(alignment: .leading) 
            Text("Featured")
                .font(.headline)
                .padding(.leading, 15)
                              .padding(.top, 1)
                HStack(alignment: .top, spacing: 0) 
                          TabView() 
                                ForEach(featuredGames.games.results)  game in
                                    NavigationLink(destination: NavigationLazyView(GameDetailsView(gameDetailsQuery: GameQuery(gameName: game.slug))))
                                        GameItem(game: game)
                                    
                                  
                              
                              .offset(x: (CGFloat(self.currentIndex) * -185), y: 0)
                              .animation(.spring())
                              .onReceive(self.timer)  _ in
                                  self.currentIndex = (self.currentIndex + 1) % 19
                              
                              
                          
                          .frame(height: 200)
                          .tabViewStyle(PageTabViewStyle())
                          .indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .always))
                          
                      
                  
    




struct FeaturedGamesView_Previews: PreviewProvider 
    static var previews: some View 
        FeaturedGamesView(numberOfImages: 3, featuredGames: GameQuery(gameCategory: GameCategory.featured))
    

从我的一些实验来看,它似乎不喜欢我用来获取数据数组以填充 tabview 的可观察对象。任何帮助将不胜感激。

更新:我创建了一个更简单的示例,但仍然会产生错误。在这种情况下,一切都是通用的,除了正在使用的数组是一个可观察的对象。切换 ForEach 中使用的数据结构可以修复它,但我希望了解为什么我的可观察对象在这里不起作用。

import SwiftUI

struct Test: View 
    @State private var selection = 0
    @ObservedObject var featuredGames: GameQuery
     
        var body: some View 
            VStack(alignment: .leading) 
                Text("Featured")
                    .font(.headline)
                    .padding(.leading, 15)
                                  .padding(.top, 1)
                HStack 
                    TabView() 
                        ForEach(featuredGames.games.results)  game in
                            Text("Hi")
                        
                    .frame(height: 170)
                    .tabViewStyle(PageTabViewStyle(indexDisplayMode: .automatic))
                    .indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .always))
                    
                
            
     
        


struct Test_Previews: PreviewProvider 
    static var previews: some View 
        Test(featuredGames: GameQuery(gameCategory: GameCategory.featured))
    

【问题讨论】:

【参考方案1】:

请看下面的代码。

我将以下部分固定为简单,然后它就可以工作了。

也许这有问题。

ForEach(featuredGames.games.results)  game in
                                NavigationLink(destination: NavigationLazyView(GameDetailsView(gameDetailsQuery: GameQuery(gameName: game.slug))))
                                    GameItem(game: game)
                                
                              

工作代码(我自己做了简单的 GameQuery observableObject)

import SwiftUI

struct FeaturedGamesView: View 
    var numberOfImages: Int
    @ObservedObject var featuredGames: GameQuery
    @State private var currentIndex: Int = 0
    
    private let timer = Timer.publish(every: 3, on: .main, in: .common).autoconnect()


var body: some View 
 
    VStack(alignment: .leading) 
        Text("Featured")
            .font(.headline)
            .padding(.leading, 15)
                          .padding(.top, 1)
            HStack(alignment: .top, spacing: 0) 
                      TabView() 
                        ForEach(featuredGames.results, id:\.self)  game in
                                NavigationLink(destination: VStack )
                                    Text("Hello")
                                
                              
                          
                          .offset(x: (CGFloat(self.currentIndex) * -185), y: 0)
                          .animation(.spring())
                          .onReceive(self.timer)  _ in
                              self.currentIndex = (self.currentIndex + 1) % 19
                          
                          
                      
                      .frame(height: 200)
                      .tabViewStyle(PageTabViewStyle())
                  

    .indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .always))
                          
                      
                  
    


final class GameQuery: ObservableObject 
    var gameCagetory: Int = 0
    var results: [Int] = [1,2,3]


struct FeaturedGamesView_Previews: PreviewProvider 
    static var previews: some View 
        FeaturedGamesView(numberOfImages: 3, featuredGames: GameQuery())
    

【讨论】:

它似乎不喜欢我提供的数据数组,但我不知道为什么。如果我删除数组的使用并添加您提供的简单示例,它可以工作,但这并不能解决我的问题。

以上是关于TabView 导致预览崩溃的主要内容,如果未能解决你的问题,请参考以下文章

NavigationBarTitle 导致 TabView 内部出错

在 SwifUI TabView 中禁用滑动手势

LVGL|lvgl教程之修改lvgl tabview部件顶部框(选项卡)的默认样式

LVGL v8学习笔记 | 10 - Tabview控件的使用方法

LVGL v8学习笔记 | 10 - Tabview控件的使用方法

将新项目添加到绑定的 ItemsSource 时,WinUI 3 UWP TabView 不显示新选项卡