如何在UIScrollView中将起始页面更改为另一个页面

Question

我创建了一个滚动视图，用户可以在其中循环浏览我分配的页面。第一个按钮指向page1作为起始页面。然而，我希望当前的起始页是第2页，当我按下按钮2，导致我的页面浏览量，但我似乎找不到一种方法，

我在ViewController中的代码如下:

var pages : [View] {

get {
let page1: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page1.colorLabel.text = "Apartment A3"
page1.priceLabel.text = "N$ 504 500"
page1.imageView.image = UIImage(named: "apartment_a3_1")


let page2: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page2.colorLabel.text = "Apartment A4"
page2.priceLabel.text = "N$ 481 000"
page2.imageView.image = UIImage(named: "apartment_a4_1")

let page3: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page3.colorLabel.text = "Apartment A5"
page3.priceLabel.text = "N$ 541 000"
page3.imageView.image = UIImage(named: "apartment_a5_1")

let page4: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page4.colorLabel.text = "Apartment A6"
page4.priceLabel.text = "N$ 553 000"
page4.imageView.image = UIImage(named: "apartment_a6_1")

let page5: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page5.colorLabel.text = "Apartment A8"
page5.priceLabel.text = "N$ 588 000"
page5.imageView.image = UIImage(named: "apartment_a8_1")

let page6: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page6.colorLabel.text = "Apartment A9"
page6.priceLabel.text = "N$ 775 000"
page6.imageView.image = UIImage(named: "apartment_a9a1")

let page7: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page7.colorLabel.text = "Apartment A12"
page7.priceLabel.text = "N$ 775 000"
page7.imageView.image = UIImage(named: "apartment_a12_a")

return [page1, page2, page3, page4, page5, page6, page7]
}
}
@IBOutlet weak var scrollView: UIScrollView!
@IBOutlet weak var pageControl: UIPageControl!
override func viewDidLoad() {
super.viewDidLoad()

//view.bringSubviewToFront(pageControl)

setupScrollView(pages: pages)

pageControl.numberOfPages = pages.count
pageControl.currentPage = 0
}
func setupScrollView(pages: [View]) {
//scrollView.frame = CGRect(x: 0, y: 0, width: view.frame.width, height: view.frame.height)
scrollView.contentSize = CGSize(width: view.frame.width * CGFloat(pages.count), height: view.frame.height)
scrollView.isPagingEnabled = true


for i in 0 ..< pages.count {
pages[i].frame = CGRect(x: view.frame.width * CGFloat(i), y: 0, width: view.frame.width, height: view.frame.height)
scrollView.addSubview(pages[i])
}
}
extension ViewController: UIScrollViewDelegate {
func scrollViewDidScroll(_ scrollView: UIScrollView) {
let pageIndex = round(scrollView.contentOffset.x/view.frame.width)
pageControl.currentPage = Int(pageIndex)
}
}

我试过把PageControl.currentPage = 0改成1，但是运气不好。

Answer 1

注意事项…

首先，你应该使用自动布局——使它更容易管理框架和滚动视图的内容。

第二，保持你的大小计算相对于滚动视图的框架，而不是视图的框架…这将使事情更加一致，并避免问题，如果你决定使滚动视图不是"全屏";(你不应该这样做，因为你总是想要尊重安全区域)。

第三，如果你只有7"pages"这种方法应该没问题。如果你有更多的数据，你可能会遇到内存问题。如果是这种情况，您应该查看UICollectionView或UIPageViewController。

那么，假设你可以坚持使用滚动视图方法…

从第二页开始你可以在viewDidLayoutSubviews期间设置滚动视图的.contentOffset.x。

首先添加一个var属性来跟踪滚动视图框架的宽度:

var scrollViewWidth: CGFloat = 0

则实现viewDidLayoutSubviews():

override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()

// we only want to call this once
if scrollViewWidth != scrollView.frame.width {
scrollViewWidth = scrollView.frame.width
scrollView.contentOffset.x = scrollView.frame.width
}
}

下面是一些你可能想要做的改变来利用自动布局的好处:

class ViewController: UIViewController {
var pages : [View] {

get {
let page1: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page1.colorLabel.text = "Apartment A3"
page1.priceLabel.text = "N$ 504 500"
page1.imageView.image = UIImage(named: "apartment_a3_1")


let page2: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page2.colorLabel.text = "Apartment A4"
page2.priceLabel.text = "N$ 481 000"
page2.imageView.image = UIImage(named: "apartment_a4_1")

let page3: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page3.colorLabel.text = "Apartment A5"
page3.priceLabel.text = "N$ 541 000"
page3.imageView.image = UIImage(named: "apartment_a5_1")

let page4: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page4.colorLabel.text = "Apartment A6"
page4.priceLabel.text = "N$ 553 000"
page4.imageView.image = UIImage(named: "apartment_a6_1")

let page5: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page5.colorLabel.text = "Apartment A8"
page5.priceLabel.text = "N$ 588 000"
page5.imageView.image = UIImage(named: "apartment_a8_1")

let page6: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page6.colorLabel.text = "Apartment A9"
page6.priceLabel.text = "N$ 775 000"
page6.imageView.image = UIImage(named: "apartment_a9a1")

let page7: View = Bundle.main.loadNibNamed("View", owner: self, options: nil)?.first as! View
page7.colorLabel.text = "Apartment A12"
page7.priceLabel.text = "N$ 775 000"
page7.imageView.image = UIImage(named: "apartment_a12_a")


return [page1, page2, page3, page4, page5, page6, page7]
}
}
@IBOutlet weak var scrollView: UIScrollView!
@IBOutlet weak var pageControl: UIPageControl!

override func viewDidLoad() {
super.viewDidLoad()

setupScrollView(pages: pages)

pageControl.numberOfPages = pages.count
pageControl.currentPage = 0
}

var scrollViewWidth: CGFloat = 0
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()

// we only want to call this once
if scrollViewWidth != scrollView.frame.width {
scrollViewWidth = scrollView.frame.width
scrollView.contentOffset.x = scrollView.frame.width
}
}
func setupScrollView(pages: [View]) {

let stack = UIStackView()
stack.translatesAutoresizingMaskIntoConstraints = false

let clg = scrollView.contentLayoutGuide
let flg = scrollView.frameLayoutGuide

scrollView.addSubview(stack)
NSLayoutConstraint.activate([
// constrain all 4 sides of stack view to scroll view's Content Layout Guide
stack.topAnchor.constraint(equalTo: clg.topAnchor),
stack.leadingAnchor.constraint(equalTo: clg.leadingAnchor),
stack.trailingAnchor.constraint(equalTo: clg.trailingAnchor),
stack.bottomAnchor.constraint(equalTo: clg.bottomAnchor),

// constrain height of stack view to scroll view's Frame Layout Guide
stack.heightAnchor.constraint(equalTo: flg.heightAnchor),
])

for i in 0 ..< pages.count {
// add each page to the stack view
stack.addArrangedSubview(pages[i])
// make each page the same width as the scroll view's Frame Layout Guide width
pages[i].widthAnchor.constraint(equalTo: flg.widthAnchor).isActive = true
}

scrollView.isPagingEnabled = true
scrollView.delegate = self
}

@IBAction func pageControlChanged(_ sender: UIPageControl) {
UIView.animate(withDuration: 0.3, animations: {
self.scrollView.contentOffset.x = CGFloat(sender.currentPage) * self.scrollView.frame.width
})
}
}
extension ViewController: UIScrollViewDelegate {
func scrollViewDidScroll(_ scrollView: UIScrollView) {
let pageIndex = round(scrollView.contentOffset.x / scrollView.frame.width)
pageControl.currentPage = Int(pageIndex)
}
}

---

编辑-回复评论…

如果你有按钮"转到另一个页面"你可以这样实现一个函数:

func showPage(_ pg: Int) {
UIView.animate(withDuration: 0.3, animations: {
self.scrollView.contentOffset.x = CGFloat(pg - 1) * self.scrollView.frame.width
})
}

并调用它，例如:

showPage(5)