Skip to content

Instantly share code, notes, and snippets.

@gali8
Created May 15, 2020 00:22
Show Gist options
  • Save gali8/5a26772fd264757da699c1333041d691 to your computer and use it in GitHub Desktop.
Save gali8/5a26772fd264757da699c1333041d691 to your computer and use it in GitHub Desktop.
UIPageControl with custom dots and space
import UIKit
class NexorPageControl: UIPageControl {
fileprivate let activeDotFrame = CGRect(origin: .zero, size: CGSize(width: 21, height: 7))
fileprivate let inactiveDotFrame = CGRect(origin: .zero, size: CGSize(width: 7, height: 7))
fileprivate let dotPadding: CGFloat = 9 //default is 9
lazy var activeImage: UIImage = {
let view = UIView(frame: self.activeDotFrame)
view.backgroundColor = .red
view.alpha = 1
view.isOpaque = false
view.setNeedsDisplay()
view.layoutIfNeeded()
view.translatesAutoresizingMaskIntoConstraints = false
return view.toImage()!
}()
lazy var inactiveImage: UIImage = {
let view = UIView(frame: self.inactiveDotFrame)
view.backgroundColor = .red
view.alpha = 0.5
view.isOpaque = false
view.setNeedsDisplay()
view.layoutIfNeeded()
view.translatesAutoresizingMaskIntoConstraints = false
return view.toImage()!
}()
override func awakeFromNib() {
super.awakeFromNib()
#if DEBUG
self.backgroundColor = .yellow
#endif
self.tintColor = .clear
self.pageIndicatorTintColor = .clear
self.currentPageIndicatorTintColor = .clear
self.isUserInteractionEnabled = false
self.clipsToBounds = false
}
override var numberOfPages: Int {
didSet {
self.updateDots()
}
}
override var currentPage: Int {
didSet {
self.updateDots()
}
}
private func updateDots()
{
var dotOriginY: CGFloat = 0
for i in 0 ..< self.subviews.count
{
let subview = self.subviews[i]
let dot: UIImageView = imageViewForSubview(view: subview)
if (i == self.currentPage) {
dot.image = activeImage
dot.frame = activeDotFrame
}
else {
dot.image = inactiveImage
dot.frame = inactiveDotFrame
}
dot.frame.origin.x = dotOriginY
dotOriginY = dot.frame.origin.x + dot.frame.size.width + self.dotPadding
if i == self.subviews.count - 1 {
dotOriginY -= self.dotPadding
}
subview.snp.removeConstraints() //SnapKit Lib => remove constraints
subview.snp.remakeConstraints { make in //SnapKit Lib => remake constraints
make.width.equalTo(dot)
make.centerY.equalToSuperview()
}
}
print("dot \(dotOriginY)")
self.snp.remakeConstraints { make in //SnapKit Lib => remake constraints
make.width.equalTo(dotOriginY)
}
self.updateConstraints()
self.setNeedsLayout()
self.layoutIfNeeded()
}
private func imageViewForSubview(view: UIView) -> UIImageView {
var dot: UIImageView!
if let imgView = view as? UIImageView {
dot = imgView
}
else {
for subview: UIView in view.subviews {
if let subimgView = subview as? UIImageView {
dot = subimgView
}
}
if dot == nil {
dot = UIImageView(frame: .zero)
view.addSubview(dot!)
}
}
dot?.contentMode = .scaleAspectFit
return dot!
}
}
@gali8
Copy link
Author

gali8 commented Mar 31, 2023

@zipris you must return an image. The “!” means that the image always exists.

Look at this link for more informations how to return an image. https://stackoverflow.com/questions/30696307/how-to-convert-a-uiview-to-an-image

@hoang-lk
Copy link

Thank you

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