SwiftUI中使用原生Toolbar时如何隐藏滚动指示器

核心解决方法 #

滚动指示器的显示状态由ScrollView的修饰器控制，和Toolbar本身无直接关联。只需给目标ScrollView添加对应修饰器，就能隐藏滚动指示器：

.scrollIndicators(.hidden)

结合你的Toolbar代码的完整示例 #

假设你的页面结构是NavigationStack+Toolbar+ScrollView，完整代码如下：

struct ContentView: View {
    var body: some View {
        NavigationStack {
            ScrollView {
                // 滚动内容示例
                ForEach(1...20, id: \.self) { index in
                    Text("第\(index)条内容")
                        .padding()
                        .frame(maxWidth: .infinity)
                        .background(Color.gray.opacity(0.1))
                }
            }
            .scrollIndicators(.hidden) // 关键：隐藏滚动指示器
            .toolbar {
                ToolbarItem(placement: .navigation) {
                    Menu {
                        Button("选项1") {}
                        Button("选项2") {}
                    } label: {
                        Image(systemName: "ellipsis.circle")
                    }
                }
            }
            .navigationTitle("示例页面")
        }
    }
}

额外说明 #

• 若滚动指示器仍在Toolbar区域附近显示，检查是否给ScrollView设置了edgesIgnoringSafeArea(.top)，导致滚动视图延伸到Toolbar下方，可移除该属性或用.safeAreaInset调整布局。
• iOS 15及更早版本需使用.hideScrollIndicators()替代.scrollIndicators(.hidden)。

内容的提问来源于stack exchange，提问作者Daryl Wong