为什么拖动时导航栏会与其下方的视图重叠？

Question

我有一个带有大标题的导航栏，该导航栏旁边有一个自定义按钮，该自定义按钮旁边有一个表格视图。但是当我尝试下拉导航栏时，它与自定义按钮重叠。我需要自定义按钮在我下拉时应与导航栏一起移动。有人可以帮忙吗？

我需要自定义按钮在我下拉时应与导航栏一起移动。有人可以帮忙吗？

Answer 1

如果您希望滚动时

toolBar

内容一直向下，则必须对其进行自定义。默认情况下，它始终粘在导航栏的顶部。试试这个：

var body: some View {
    NavigationStack {
        ZStack {
            ScrollView {
                VStack {
                    Spacer()
                        .frame(height: 60) // <- fixed height to align center on `inline` mode.
                    
                    HStack {
                        Image(systemName: "person.crop.circle")
                            .padding(.leading)
                        
                        Spacer()
                        
                        HStack {
                            Image(systemName: "ellipsis.circle")
                            Spacer()
                                .frame(width: 20)
                            Image(systemName: "magnifyingglass")
                        }
                        .padding(.trailing)
                    }

                    //Another views from here:
                }
            }
        }
        .edgesIgnoringSafeArea(.top)
        .navigationTitle("Jobs")
    }
}