如何修复 TabView 中 NavigationView 列表下的灰色条？

Question

所以我遇到了一个问题，在我的列表下方出现了一个灰色条，当我单击一个单元格转到另一个视图时，出现了一个更大的灰色条。这是列表视图的代码：

 VStack{
             NavigationView{
                VStack{



                List{
                    ForEach(answersArray.indices, id: \.self) { day in
                        NavigationLink(destination: DetailView(questions: self.answersArray[day].questions, answers: self.answersArray[day].answers, date: self.answersArray[day].dayDone.toString(dateFormat: "MM/dd/yy"))) {


                        HStack{
                            VStack{
                                ForEach(self.answersArray[day].questions.indices) { question in
                                    //Text(question)
                                    Text(self.answersArray[day].questions[question])
                                    .lineLimit(1)
                                        .frame(width: 250, height: 30, alignment: .leading)
                                      //  .padding(.vertical, 5)
                                    //.padding(.bottom)

                                }

                            }
                           // .truncationMode(.tail)
                            //.frame(minWidth: 0, idealWidth: 200, maxWidth: .infinity, minHeight: 0, idealHeight: 50, maxHeight: 75, alignment: .leading)

                            Text(self.answersArray[day].dayDone.toString(dateFormat: "MM/dd/yy"))
                                .frame(minWidth: 0, idealWidth: 50, maxWidth: .infinity, minHeight: 0, idealHeight: 20, maxHeight: 20, alignment: .trailing)
                        }

                        .padding(.horizontal, 5)
                    }

                        //.frame(minWidth: 0, idealWidth: 250, maxWidth: .infinity, minHeight: 0, idealHeight: 50, maxHeight: 100, alignment: .center)
                    }
                    //.colorMultiply(Color("Background Green"))
                  //  .listRowBackground(Color("Background Green"))
                    //.listRowBackground(Color("Background Green"))

                    Button(action: {
                        self.answersArray.append(DailyAnswer(questions: ["Question 1", "Question 2"], answers: ["I am happy", "I am sad"], dayDone: Date().addingTimeInterval(100000), lastWeek: false))
                        self.answersArray.append(DailyAnswer(questions: ["Question 1", "Question 2"], answers: ["I am happy", "I am sad"], dayDone: Date(), lastWeek: false))
                        self.answersArray.append(DailyAnswer(questions: ["Question 1", "Question 2"], answers: ["I am happy", "I am sad"], dayDone: Date(), lastWeek: false))
                    }) {
                        Text("Create cells")
                    }
                    }
                 .navigationBarTitle("Title")
               //.colorMultiply(Color("Background Green"))




                }

             }

             .accentColor(Color("My Gray"))

            }

这里是单独视图的代码：

import SwiftUI

struct DetailView: View {
    var questions : [String];
    var answers : [String];
    var date : String;
    var body: some View {

            //Color("Background Green")
               //.edgesIgnoringSafeArea(.all)

        NavigationView{
            ZStack{
            Color("Background Green")
                   .edgesIgnoringSafeArea(.all)
                ScrollView{
                    VStack{
                        ForEach(questions.indices) { pair in
                            Text(self.questions[pair])
                                .font(.title)
                                .padding()
                            Text(self.answers[pair])
                            .padding()
                                .font(.body)
                            .frame(minWidth: 0, idealWidth: 250, maxWidth: 350, minHeight: 150, idealHeight: 200, maxHeight: .infinity, alignment: .topLeading)
                            .background(
                            RoundedRectangle(cornerRadius: 5)
                                .stroke(Color.black, lineWidth: 1)
                            )

                        }

                    }
                    .padding(.top)
                    .navigationBarTitle("\(date)", displayMode: .inline)
                }

        }
        }
    }
}

我也知道这看起来与非常相似，但是当我在该页面上实施解决方案时，它只会更改顶部导航栏标题的颜色，而不是底部的灰色。

此外，这是我设置选项卡栏和导航栏样式的地方

 init() {

       UINavigationBar.appearance().backgroundColor = UIColor(named: "Background Green")
       UITabBar.appearance().isTranslucent = false
       UITabBar.appearance().barTintColor = UIColor.black
       }

Answer 1

我看到堆栈中有很多 NavigationView:

 VStack{
             NavigationView{ // << here in first snapshot
                VStack{

和

        NavigationView{ // << here in second snapshot
            ZStack{

并且由于没有提供完整的代码，所以可能还有其他代码...

这是一个经验法则：在一个视图层次结构链中必须只有一个根 NavigationView。因此，请确保将一个 NavigationView 放置为 Past Journals 选项卡的选项卡项根视图（同样，假设仅基于提供的代码）。

Answer 2

将 UITabBar.appearance().isTranslucent 设置为 false 将打破 NavigationView 所依赖的约束。

要解决此问题，请替换以下代码行：

UITabBar.appearance().isTranslucent = false
UITabBar.appearance().barTintColor = UIColor.black

有了这些：

let tabBarAppearance = UITabBarAppearance()
tabBarAppearance.configureWithOpaqueBackground()
tabBarAppearance.backgroundColor = UIColor.black
UITabBar.appearance().standardAppearance = tabBarAppearance

如何修复 TabView 中 NavigationView 列表下的灰色条？

How to fix gray bar under List in NavigationView in TabView?

xcode

swiftui

uinavigationbar

uitabbar

swiftui-list