I am trying to find out how to make the dot for the selected page be slightly bigger than the others as shown below:
Page 1:
Page 2:
I am able to change the dot color, size for all the dots, background, etc, but not for the specific dot of the current page.
How to change the dot size for the current page only?
This can be Swift or Objective-C.
func scrollViewWillEndDragging(_ scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>) {
let x = targetContentOffset.pointee.x
pageControl.currentPage = Int(x / self.frame.width)
// on each dot, call the transform of scale 1 to restore the scale of previously selected dot
pageControl.subviews.forEach {
$0.transform = CGAffineTransform(scaleX: 1, y: 1)
}
// transform the scale of the current subview dot, adjust the scale as required, but bigger the scale value, the downward the dots goes from its centre.
// You can adjust the centre anchor of the selected dot to keep it in place approximately.
let centreBeforeScaling = self.pageControl.subviews[self.pageControl.currentPage].center
self.pageControl.subviews[self.pageControl.currentPage].transform = CGAffineTransform(scaleX: 1.5, y: 1.5)
// Reposition using autolayout
self.pageControl.subviews[self.pageControl.currentPage].translatesAutoresizingMaskIntoConstraints = false
self.pageControl.subviews[self.pageControl.currentPage].centerYAnchor.constraint(equalTo: self.pageControl.subviews[0].centerYAnchor , constant: 0)
self.pageControl.subviews[self.pageControl.currentPage].centerXAnchor.constraint(equalTo: self.pageControl.subviews[0].centerXAnchor , constant: 0)
// self.pageControl.subviews[self.pageControl.currentPage].layer.anchorPoint = centreBeforeScaling
}