Skip to content

Instantly share code, notes, and snippets.

@brascene
Created July 13, 2018 07:48
Show Gist options
  • Save brascene/f275d8e6b289cb5ba5fdeeb9c3d41540 to your computer and use it in GitHub Desktop.
Save brascene/f275d8e6b289cb5ba5fdeeb9c3d41540 to your computer and use it in GitHub Desktop.
Custom UIPageControl for replacing the default circles with desired icons
class CustomPageControl: UIPageControl {
// active and inactive images
let imgActive: UIImage = #imageLiteral(resourceName: "activeImage").withRenderingMode(.alwaysTemplate)
let imgInactive: UIImage = #imageLiteral(resourceName: "inactiveImage")
// adjust these parameters for specific case
let customActiveYOffset: CGFloat = 5.0
let customInactiveYOffset: CGFloat = 3.0
var hasCustomTintColor: Bool = false
let customActiveDotColor: UIColor = UIColor(rgb: 0xe62f3e, alphaVal: 1.0)
override var numberOfPages: Int {
didSet {
updateDots()
}
}
override var currentPage: Int {
didSet {
updateDots()
}
}
override func awakeFromNib() {
super.awakeFromNib()
self.pageIndicatorTintColor = .clear
self.currentPageIndicatorTintColor = .clear
self.clipsToBounds = false
}
func updateDots() {
var i = 0
let activeSize = self.imgActive.size
let inactiveSize = self.imgInactive.size
let activeRect = CGRect(x: 0, y: 0, width: activeSize.width / 2, height: activeSize.height / 2)
let inactiveRect = CGRect(x: 0, y: 0, width: inactiveSize.width, height: inactiveSize.height)
for view in self.subviews {
if let imageView = self.imageForSubview(view) {
if i == self.currentPage {
imageView.image = self.imgActive
if self.hasCustomTintColor {
imageView.tintColor = customActiveDotColor
}
imageView.frame = activeRect
imageView.frame.origin.y = imageView.frame.origin.y - customActiveYOffet
} else {
imageView.image = self.imgInactive
imageView.frame = inactiveRect
imageView.frame.origin.y = imageView.frame.origin.y - customInactiveYOffset
}
i = i + 1
} else {
var dotImage = self.imgInactive
if i == self.currentPage {
dotImage = self.imgActive
}
view.clipsToBounds = false
let addedImageView: UIImageView = UIImageView(image: dotImage)
if dotImage == self.imgActive {
addedImageView.frame = activeRect
addedImageView.frame.origin.y = addedImageView.frame.origin.y - customActiveYOffet
if self.hasCustomTintColor {
addedImageView.tintColor = customActiveDotColor
}
} else {
addedImageView.frame.origin.y = addedImageView.frame.origin.y - customInactiveYOffset
}
view.addSubview(addedImageView)
i = i + 1
}
}
}
func imageForSubview(_ view:UIView) -> UIImageView? {
var dot: UIImageView?
if let dotImageView = view as? UIImageView {
dot = dotImageView
} else {
for foundView in view.subviews {
if let imageView = foundView as? UIImageView {
dot = imageView
break
}
}
}
return dot
}
@plusend
Copy link

plusend commented Sep 22, 2020

This has some issue, the image's origin.x has not set up correctly.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment