В SwiftUI ScrollView — это универсальный контейнер, который позволяет пользователям прокручивать контент, превышающий доступное пространство экрана. Однако центрирование содержимого по вертикали внутри ScrollView иногда может быть проблемой. В этой статье мы рассмотрим несколько методов достижения вертикального центрирования в ScrollView в SwiftUI, а также приведем примеры кода.
Метод 1: GeometryReader и Spacer
struct ContentView: View {
var body: some View {
ScrollView {
VStack {
GeometryReader { geometry in
VStack {
Spacer(minLength: (geometry.size.height - contentHeight) / 2)
// Your content here
Text("Centered Content")
.font(.largeTitle)
Spacer(minLength: (geometry.size.height - contentHeight) / 2)
}
}
}
}
}
}
Метод 2: GeometryReader и выравнивание
struct ContentView: View {
var body: some View {
ScrollView {
VStack {
GeometryReader { geometry in
VStack(alignment: .center) {
// Your content here
Text("Centered Content")
.font(.largeTitle)
.frame(height: geometry.size.height)
}
}
}
}
}
}
Метод 3. Пользовательский модификатор
() ->Содержание
var body: some View {
GeometryReader { geometry in
ScrollView {
VStack {
Spacer(minLength: (geometry.size.height – contentHeight) / 2)
content( )
Spacer(minLength: (geometry.size.height – contentHeight) / 2)
// Использование:
struct ContentView: View {
var body: some View {
CenteredScrollView {
// Здесь ваш контент
Text(“Centered Content”)
.font(.largeTitle)
}
Метод 4: GeometryReader и ScrollViewReader
struct ContentView: View {
var body: some View {
GeometryReader { geometry in
ScrollViewReader { scrollViewProxy in
ScrollView {
VStack {
Spacer(minLength: (geometry.size.height - contentHeight) / 2)
Button("Scroll to Center") {
withAnimation {
scrollViewProxy.scrollTo(100) // Adjust to your content position
}
}
Spacer(minLength: (geometry.size.height - contentHeight) / 2)
}
}
}
}
}
}
В этой статье мы рассмотрели несколько методов центрирования контента по вертикали в ScrollView в SwiftUI. Используя такие методы, как GeometryReader, Spacer, Alignment и ScrollViewReader, мы можем добиться желаемого эффекта центрирования. Выберите метод, который лучше всего соответствует вашим потребностям, и примените его к своим проектам SwiftUI, чтобы создавать визуально приятные и удобные интерфейсы.
Не забудьте адаптировать примеры кода к вашему конкретному варианту использования и не стесняйтесь экспериментировать с различными подходами. Приятного кодирования!