SwiftUI: как позволить ScrollView переместить один элемент один раз

Question

Мой список изображений представляет собой горизонтальный список прокрутки. И изображение в списке представлено как полная ширина экрана. По умолчанию он движется непрерывно, однако я хочу позволить ему перемещать один элемент за раз, как я мог это сделать.

Я ищу здесь, есть некоторые похожие вопросы, связанные с Android, но не с iOS, в частности с SwiftUI.

private struct PresentedImageList: View {
    var images: [ImageViewModel]

    var body: some View {

        GeometryReader { gr in
            ScrollView(.horizontal, showsIndicators: false) {
                HStack(alignment: .top, spacing: 6) {
                    ForEach(self.images, id: \.self) { image in
                        KFImage(source: .network(image.fileURL))
                            .resizable()
                            .frame(width: gr.size.width)
                            .aspectRatio(1.77, contentMode: .fit)

                    }
                }
            }.background(Color.black)
        }
    }
}

Answer 1

в SwiftUI это не доступно. поэтому нужно сделать, используя UIKit

struct ContentView: View {
  var images: [ImageViewModel]

  var body: some View {
    GeometryReader { gr in
        ScrollViewUI(hideScrollIndicators: false) {
            HStack(alignment: .top, spacing: 0) {
                ForEach(self.images, id: \.self) { image in
                    VStack {
                        KFImage(source: .network(image.fileURL))
                            .resizable()
                            .frame(width: gr.size.width-6,alignment: .center)
                            .aspectRatio(1.77, contentMode: .fit)
                    }
                    .frame(width: gr.size.width,alignment: .center)
                }
            }
        }
    }
  }
}

ScrollViewUI

struct ScrollViewUI<Content: View>: UIViewControllerRepresentable {

  var content: () -> Content
  var hideScrollIndicators: Bool = false

  init(hideScrollIndicators: Bool, @ViewBuilder content: @escaping () -> Content) {
      self.content = content
      self.hideScrollIndicators = hideScrollIndicators
  }

  func makeUIViewController(context: Context) -> ScrollViewController<Content> {
      let vc = ScrollViewController(rootView: self.content())
      vc.hideScrollIndicators = hideScrollIndicators
      return vc
  }

  func updateUIViewController(_ viewController: ScrollViewController<Content>, context: Context) {
      viewController.hostingController.rootView = self.content()
  }
}

ScrollViewController

class ScrollViewController<Content: View>: UIViewController, UIScrollViewDelegate {

  var hideScrollIndicators: Bool = false

  lazy var scrollView: UIScrollView = {
      let view = UIScrollView()
      view.delegate = self
      view.showsVerticalScrollIndicator = !hideScrollIndicators
      view.showsHorizontalScrollIndicator = !hideScrollIndicators
      view.bounces = false
      view.backgroundColor = .clear
      view.isPagingEnabled = true
      return view
  }()

  init(rootView: Content) {
      self.hostingController = UIHostingController<Content>(rootView: rootView)
      self.hostingController.view.backgroundColor = .clear
      super.init(nibName: nil, bundle: nil)
  }

  required init?(coder: NSCoder) {
      fatalError("init(coder:) has not been implemented")
  }

  var hostingController: UIHostingController<Content>! = nil

  override func viewDidLoad() {
      super.viewDidLoad()

      view.addSubview(scrollView)
      view.backgroundColor = .clear

      self.makefullScreen(of: self.scrollView, to: self.view)
      self.hostingController.willMove(toParent: self)
      self.scrollView.addSubview(self.hostingController.view)
      self.makefullScreen(of: self.hostingController.view, to: self.scrollView)
      self.hostingController.didMove(toParent: self)
  }

  func makefullScreen(of viewA: UIView, to viewB: UIView) {
      viewA.translatesAutoresizingMaskIntoConstraints = false
      viewB.addConstraints([
          viewA.leadingAnchor.constraint(equalTo: viewB.leadingAnchor),
          viewA.trailingAnchor.constraint(equalTo: viewB.trailingAnchor),
          viewA.topAnchor.constraint(equalTo: viewB.topAnchor),
          viewA.bottomAnchor.constraint(equalTo: viewB.bottomAnchor),
      ])
  }
}