PageTabViewStyle 显示列表，而不是轮播

Posted 2023-02-23

【中文标题】PageTabViewStyle 显示列表，而不是轮播

【英文标题】：PageTabViewStyle displays List, not Carousel

【发布时间】：2020-11-29 20:01:46

【问题描述】：

我正在为食谱应用构建分步视图。现在，我使用PageTabViewStyle，每个步骤都有自己的视图；目前它无法正常工作，因为每一步（除了第一步，请参见 GIF）都会在此列表中返回，并且无法向左或向右滑动。有没有人有同样的经历？ TabViewStyle 有页数限制吗？

CurrentUIGIF

我的数据文件：

struct Recipe: Identifiable 
    var id = UUID()
    var directions: [String]


let recipesData: [Recipe] = [
    Recipe(
        directions: [
            "Gather all ingredients on your countertop. Peas, onions, mineral water, walnuts, almond   butter, olive oil, parsley and mint.",
            "Make the pesto by washing the parsley and mint. Remove the leaves from the stems and set aside.",
            "Peel the two onions and roughly chop them.",
        ]
    )
]

我的 pageTabView 视图：

struct DirectionsView: View 
    var recipe: Recipe

    var body: some View 
        TabView 
            ForEach(recipe.directions, id: \.self)  item in
                VStack(alignment: .leading) 
                    Text(item)
                
            .tabViewStyle(PageTabViewStyle())
        
    


struct DirectionsView_Previews: PreviewProvider 
    static var previews: some View 
        DirectionsView(recipe: recipesData[0])
    

【问题讨论】：

拥有 2 个NavigationViews 可能有问题。帮助您的唯一方法是提供最小的、可重现的产品。我们可以复制和粘贴的东西，然后查看行为代码。

@loremipsum 感谢您的推荐。我编辑了代码，因此很容易重现。在这个新的最小产品中，没有 NavigationView 并且仍然出现错误。

【参考方案1】：

您需要将.tabViewStyle(PageTabViewStyle()) 附加到TabView（而不是ForEach）：

struct DirectionsView: View 
    var recipe: Recipe

    var body: some View 
        TabView 
            ForEach(recipe.directions, id: \.self)  item in
                VStack(alignment: .leading) 
                    Text(item)
                
            
        
        .tabViewStyle(PageTabViewStyle())