I have created a User Onboarding as a Collection View
with 5 cells (pages).
The Collection View
has a UIPageControl
which shows an active page user currently on and 2 UIButtons
(previous and next) which needed to manually scroll the pages if user don't want to swipe.
Here is how I manage the buttons IBAction
when user taps:
@IBAction func prevButtonClicked(_ sender: UIButton) {
if currentPage != 0 {
currentPage -= 1
let indexPath = IndexPath(item: currentPage, section: 0)
collectionView.scrollToItem(at: indexPath, at: .centeredHorizontally, animated: true)
}
}
@IBAction func nextButtonClicked(_ sender: UIButton) {
if currentPage == slides.count - 1 {
//hide onboarding
} else {
currentPage = 1
let indexPath = IndexPath(item: currentPage, section: 0)
collectionView.scrollToItem(at: indexPath, at: .centeredHorizontally, animated: true)
}
}
Also if user swipes a page instead of tap on buttons I use scrollViewDidScroll()
method to update UIPageControl
dot:
func scrollViewDidScroll(_ scrollView: UIScrollView) {
let visibleRectangle = CGRect(origin: collectionView.contentOffset, size: collectionView.bounds.size)
let visiblePoint = CGPoint(x: visibleRectangle.midX, y: visibleRectangle.midY)
currentPage = collectionView.indexPathForItem(at: visiblePoint)?.row ?? 0
}
The currentPage
is a computed property:
private var currentPage = 0 {
didSet {
pageControl.currentPage = currentPage
currentPage == 0 ? hidePreviousButton() : showPreviousButton()
}
}
I have a problem: when tap on buttons I force collectionView
to scroll and update currentPage
, therefore scrollViewDidScroll
called and currentPage
updates again.
Because of that when I tap on buttons I can see that UIPageControl
dot and backButton
are flicker since the code runs twice:
didSet {
pageControl.currentPage = currentPage
currentPage == 0 ? hidePreviousButton() : showPreviousButton()
}
Here is a GIF with the problem: GIF
How can I avoid the double call to scrollViewDidScroll
when tap on buttons?
CodePudding user response:
Add a Bool var to your OnboardingViewController
:
var programmedScroll: Bool = false
then, when prev or next button is tapped, instead of:
@IBAction func prevButtonPressed(_ sender: UIButton) {
if currentPage != 0 {
currentPage -= 1
let indexPath = IndexPath(item: currentPage, section: 0)
collectionView.scrollToItem(at: indexPath, at: .centeredHorizontally, animated: true)
}
}
do this:
@IBAction func prevButtonPressed(_ sender: UIButton) {
if currentPage != 0 {
currentPage -= 1
let indexPath = IndexPath(item: currentPage, section: 0)
// instead of this
//collectionView.scrollToItem(at: indexPath, at: .centeredHorizontally, animated: true)
self.programmedScroll = true
UIView.animate(withDuration: 0.3, animations: {
self.collectionView.scrollToItem(at: indexPath, at: .centeredHorizontally, animated: false)
}, completion: { _ in
self.programmedScroll = false
})
}
}
Now your scrollViewDidScroll
won't be called during that animation.
CodePudding user response:
You can set tag for each collectionView and check tag of scrollView in scrollViewDidScroll.