Я использую SwiftUI и хотел бы иметь вертикальную прокрутку для отображения ряда элементов (событий). Эти элементы содержат подэлементы (участники), которые представлены фотографиями. Я хотел бы показать 4 фотографии в матрице 2x2. Если участников больше 4, я хотел бы провести пальцем влево, чтобы показать следующие 4 фотографии. (Пожалуйста, смотрите прикрепленный скриншот).
Чтобы понять, что я реализовал пейджинг (PageView, PageViewController и PageControl) с помощью UIViewRepresentable или UIViewControllerRepresentable. (Я также пробовал TabView)
У меня проблемы с использованием этого пейджинга в ScrollView, элемент пейджинга недоступен, он не отображается. Он хорошо работает в VStack или списке, но это не помогает мне в прокрутке.
Очень упрощенные примеры:
Встроен в VStack -> РАБОТАЕТ
import SwiftUI
struct TestView2: View {
@State var currentPage = 0
var body: some View {
VStack() {
Text("Below the Paging")
PageView([
TestView(),
TestView()
], currentPage: $currentPage)
}
}
}
Встроен в ScrollView -> НЕ РАБОТАЕТ
import SwiftUI
struct TestView2: View {
@State var currentPage = 0
var body: some View {
ScrollView() {
// It also does not work if I add a VStack() into the ScrollView.
// VStack(){
Text("Below the Paging")
PageView([
TestView(),
TestView()
], currentPage: $currentPage)
// }
}
}
}
Должен ли я обращать внимание на что-то в случае ScrollView? Должен ли я что-то предварительно загрузить. Его нужно специально встраивать? Или это пейджинг, как я его реализовал, неправильный подход?
Если вам нужно больше используемого кода, пожалуйста, дайте мне знать.
Кстати. ScrollView сводит меня с ума. В дополнение к этой проблеме, у меня есть еще проблема, что кнопки не работают в некоторых местах, пока я не прокрутил.





Похоже, это ошибка, но она устранена в 14.3.
struct NestedPageController: View {
@State var currentPage = 0
@State var currentPage2 = 0
var body: some View {
ScrollView() {
VStack{
Text("Below the Paging")
TabView(selection: $currentPage){
TestView2(tag: 1).tag(1)
TestView2(tag: 2).tag(2)
TestView2(tag: 3).tag(3)
TestView2(tag: 4).tag(4)
}
.tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
TabView(selection: $currentPage2){
TestView2(tag: 10).tag(10)
TestView2(tag: 20).tag(20)
TestView2(tag: 30).tag(30)
TestView2(tag: 40).tag(40)
}
.tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
}
}
}
}
struct TestView2: View {
var tag: Int
var body: some View {
VStack{
Text(tag.description)
Image(systemName: "checkmark")
}.frame(width: 200, height: 200, alignment: .center).background(Color.green)
}
}
Вы можете попробовать collectionView, это проще и гибче