В SwiftUI NavigationView — это мощное представление-контейнер, позволяющее легко перемещаться между различными представлениями в приложении. По умолчанию NavigationView отображает заголовок в верхней части экрана. Однако бывают случаи, когда вам может потребоваться скрыть заголовок, чтобы добиться определенного дизайна или пользовательского опыта. В этой статье мы рассмотрим различные методы скрытия заголовка в NavigationView SwiftUI, а также приведем примеры кода.
Простой способ скрыть заголовок — использовать собственный NavigationBarTitle с пустой строкой. Это эффективно скрывает заголовок по умолчанию.
NavigationView {
VStack {
// Content of your view here
}
.navigationBarTitle("", displayMode: .inline)
}
Метод 2: полное скрытие панели навигации
Если вы хотите скрыть всю панель навигации, включая кнопку «Назад» и заголовок, вы можете использовать модификатор navigationBarHidden
.
NavigationView {
VStack {
// Content of your view here
}
.navigationBarHidden(true)
}
Метод 3. Использование пользовательского представления
Другой вариант — заменить заголовок по умолчанию на собственный вид. Вы можете создать собственное представление и установить его как navigationBarItems
элемента NavigationView, чтобы добиться желаемого внешнего вида заголовка.
NavigationView {
VStack {
// Content of your view here
}
.navigationBarItems(trailing:
HStack {
// Custom view for header
}
)
}
Метод 4. Использование панели инструментов
Начиная с iOS 15, в SwiftUI появилось представление Toolbar
, которое обеспечивает большую гибкость при создании пользовательских заголовков. Вы можете использовать панель инструментов, чтобы скрыть заголовок по умолчанию и создать собственный заголовок с помощью элементов панели инструментов.
NavigationView {
VStack {
// Content of your view here
}
.toolbar {
ToolbarItemGroup(placement: .navigationBarLeading) {
// Custom view for header
}
}
}
Метод 5: скрытие панели навигации с помощью анимации
Если вы хотите скрыть заголовок с помощью анимации, вы можете объединить модификатор navigationBarHidden
с модификатором animation
, чтобы создать эффект плавного перехода.
NavigationView {
VStack {
// Content of your view here
}
.navigationBarHidden(true)
.animation(.default)
}