本項目github地址：GitHub - wei287030375/WEIPageControl: 最新SWIFT 4.0 版自定義PageControl晃痴，橢圓，空心圓财忽，方形點倘核，圖片點
剛開始做swift項目，可用資源少而且每個swift版本變化太大即彪，以前的都不能拿來直接用紧唱，現(xiàn)在我參考一個object-C的PageControl自己做了一個swift版的， 參考OC資源鏈接：https://github.com/hackxhj/EllipsePageControl隶校，非常感謝原作者漏益。 本項目在原OC的功能基礎(chǔ)上進行的改進，增加了自定義點的寬度深胳，方形點绰疤，點的layer，點的圖片等功能舞终，能隨意組合使用轻庆， 基本滿足大部分的需求，寫的很簡單敛劝，大家一看就懂余爆，歡迎大家使用 由于水平有限，項目中有改進之處忘各位大神給與指點攘蔽，以求不斷完善
pageControl.gif
貼上部分代碼：
以下是部分代碼：
class WEIPageControl: UIControl {
var localNumberOfPages = NSInteger()//分頁數(shù)量
var localCurrentPage = NSInteger()//當(dāng)前點所在下標(biāo)
var localPointSize = CGSize()//點的大小
var localPointSpace = CGFloat()//點之間的間距
var localOtherColor = UIColor()//未選中點的顏色
var localCurrentColor = UIColor()//當(dāng)前點的顏色
var localOtherImage: UIImage?//未選中點的圖片
var localCurrentImage: UIImage?//當(dāng)前點的圖片
var localIsSquare = Bool()//是否是方形點
var localCurrentWidthMultiple = CGFloat()//當(dāng)前選中點寬度與未選中點的寬度的倍數(shù)
var localOtherBorderColor: UIColor?//未選中點的layerColor
var localOtherBorderWidth: CGFloat?//未選中點的layer寬度
var localCurrentBorderColor: UIColor?//未選中點的layerColor
var localCurrentBorderWidth: CGFloat?//未選中點的layer寬度
var clickIndex: ((_ result: NSInteger?) -> ())?
下面是創(chuàng)建PageControl龙屉，用UIView做的
func creatPointView() {
for view in self.subviews {
view.removeFromSuperview()
}
if localNumberOfPages <= 0 {//必須傳入總頁數(shù)
return
}
var startX: CGFloat = 0
var startY:CGFloat = 0
let mainWidth = CGFloat(localNumberOfPages) * (localPointSize.width + localPointSpace)
if self.frame.size.width > mainWidth {
startX = (self.frame.size.width - mainWidth) / 2
}
if self.frame.size.height > localPointSize.height {
startY = (self.frame.size.height - localPointSize.height) / 2
}
//創(chuàng)建點
for index in 0 ..< numberOfPages {
if index == localCurrentPage {//是當(dāng)前點
let currentPointView = UIView.init()
let currentPointViewWidth = localPointSize.width * localCurrentWidthMultiple
currentPointView.frame = CGRect.init(x: startX, y: startY, width: currentPointViewWidth, height: localPointSize.height)
currentPointView.backgroundColor = localCurrentColor
currentPointView.tag = index + 1000
currentPointView.layer.cornerRadius = localIsSquare ? 0 : localPointSize.height / 2
currentPointView.layer.masksToBounds = true
currentPointView.layer.borderColor = localCurrentBorderColor != nil ? localCurrentBorderColor?.cgColor : localCurrentColor.cgColor
currentPointView.layer.borderWidth = localCurrentBorderWidth != nil ? localCurrentBorderWidth! : 0
currentPointView.isUserInteractionEnabled = true
self.addSubview(currentPointView)
let tapGesture = UITapGestureRecognizer.init(target: self, action: #selector(clickAction(tapGesture:)))//添加小圓點點擊手勢
currentPointView.addGestureRecognizer(tapGesture)
startX = currentPointView.frame.maxX + localPointSpace
if localCurrentImage != nil {
currentPointView.backgroundColor = UIColor.clear
let localCurrentImageView = UIImageView.init()
localCurrentImageView.tag = index + 2000
localCurrentImageView.frame = currentPointView.bounds
localCurrentImageView.image = localCurrentImage
currentPointView.addSubview(localCurrentImageView)
}
} else {//其他點
let otherPointView = UIView.init()
otherPointView.frame = CGRect.init(x: startX, y: startY, width: localPointSize.width, height: localPointSize.height)
otherPointView.backgroundColor = localOtherColor
otherPointView.tag = index + 1000
otherPointView.layer.cornerRadius = localIsSquare ? 0 : localPointSize.height / 2;
otherPointView.layer.borderColor = localOtherBorderColor != nil ? localOtherBorderColor?.cgColor : localOtherColor.cgColor
otherPointView.layer.borderWidth = localOtherBorderWidth != nil ? localOtherBorderWidth! : 0
otherPointView.layer.masksToBounds = true
otherPointView.isUserInteractionEnabled = true
self.addSubview(otherPointView)
let tapGesture = UITapGestureRecognizer.init(target: self, action: #selector(clickAction(tapGesture:)))
otherPointView.addGestureRecognizer(tapGesture)
startX = otherPointView.frame.maxX + localPointSpace
if localOtherImage != nil {
otherPointView.backgroundColor = UIColor.clear
let localOtherImageView = UIImageView.init()
localOtherImageView.tag = index + 2000
localOtherImageView.frame = otherPointView.bounds
localOtherImageView.image = localOtherImage
otherPointView.addSubview(localOtherImageView)
}
}
}
}
滑動或者點擊圓點后切換當(dāng)前點和其他點
func exchangeCurrentView(oldSelectedIndex: NSInteger, newSelectedIndex: NSInteger) {//切換當(dāng)前點和其他點
let oldPointView = self.viewWithTag(1000 + oldSelectedIndex)
let newPointView = self.viewWithTag(1000 + newSelectedIndex)
oldPointView?.layer.borderColor = localOtherBorderColor != nil ? localOtherBorderColor?.cgColor : localOtherColor.cgColor
oldPointView?.layer.borderWidth = localOtherBorderWidth != nil ? localOtherBorderWidth! : 0
newPointView?.layer.borderColor = localCurrentBorderColor != nil ? localCurrentBorderColor?.cgColor : localCurrentColor.cgColor
newPointView?.layer.borderWidth = localCurrentBorderWidth != nil ? localCurrentBorderWidth! : 0
oldPointView?.backgroundColor = localOtherColor
newPointView?.backgroundColor = localCurrentColor
if localCurrentWidthMultiple != 1 {//如果當(dāng)前選中點的寬度與未選中的點寬度不一樣，則要改變選中前后兩點的frame
var oldPointFrame = oldPointView?.frame
if newSelectedIndex < oldSelectedIndex {
oldPointFrame?.origin.x += localPointSize.width * (localCurrentWidthMultiple - 1)
}
oldPointFrame?.size.width = localPointSize.width
oldPointView?.frame = oldPointFrame!
var newPointFrame = newPointView?.frame
if newSelectedIndex > oldSelectedIndex {
newPointFrame?.origin.x -= localPointSize.width * (localCurrentWidthMultiple - 1)
}
newPointFrame?.size.width = localPointSize.width * localCurrentWidthMultiple
newPointView?.frame = newPointFrame!
}
if localCurrentImage != nil {//切換選中圖片和未選中圖片
let view = oldPointView?.viewWithTag(oldSelectedIndex + 2000)
if view != nil {
let oldlocalCurrentImageView = view as! UIImageView
oldlocalCurrentImageView.frame = CGRect.init(x: 0, y: 0, width: localPointSize.width, height: localPointSize.height)
oldlocalCurrentImageView.image = localOtherImage
}
}
if localOtherImage != nil {//切換選中圖片和未選中圖片
let view = newPointView?.viewWithTag(newSelectedIndex + 2000)
if view != nil {
let oldlocalOtherImageView = view as! UIImageView
let width = localPointSize.width * localCurrentWidthMultiple
oldlocalOtherImageView.frame = CGRect.init(x: 0, y: 0, width: width, height: localPointSize.height)
oldlocalOtherImageView.image = localCurrentImage
}
}
if newSelectedIndex - oldSelectedIndex > 1 {//點擊圓點满俗，中間有跳過的點
for index in oldSelectedIndex + 1 ..< newSelectedIndex {
let view = self.viewWithTag(1000 + index)
var frame = view?.frame
frame?.origin.x -= localPointSize.width * (localCurrentWidthMultiple - 1)
frame?.size.width = localPointSize.width
view?.frame = frame!
}
}
if newSelectedIndex - oldSelectedIndex < -1 {//點擊圓點转捕，中間有跳過的點
for index in newSelectedIndex + 1 ..< oldSelectedIndex {
let view = self.viewWithTag(1000 + index)
var frame = view?.frame
frame?.origin.x += localPointSize.width * (localCurrentWidthMultiple - 1)
frame?.size.width = localPointSize.width
view?.frame = frame!
}
}
}
在ViewController中使用
//方形點舉例
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = UIColor.black
let width: CGFloat = UIScreen.main.bounds.size.width * 0.7
let height: CGFloat = 100
let left: CGFloat = 50
let pageCount = 5
//寬一點的方點
scrollView3.frame = CGRect.init(x: left, y: pageControl2.frame.maxY + 30, width: width, height: height)
scrollView3.delegate = self
scrollView3.tag = 3
scrollView3.isPagingEnabled = true
scrollView3.contentSize = CGSize.init(width: width * CGFloat(pageCount), height: 0)
for index in 0 ..< pageCount {
let imageView = UIImageView.init()
imageView.frame = CGRect.init(x: CGFloat(index) * width, y: 0, width: width, height: height)
imageView.backgroundColor = UIColor.init(red: CGFloat(arc4random()%255) / CGFloat(255), green: CGFloat(arc4random()%255) / CGFloat(255), blue: CGFloat(arc4random()%255) / CGFloat(255), alpha: 1)
scrollView3.addSubview(imageView)
}
pageControl3 = WEIPageControl()//初始化PageControl
pageControl3.frame = CGRect.init(x: left, y: scrollView3.frame.maxY, width: width, height: 20)
pageControl3.numberOfPages = pageCount//總頁數(shù)
pageControl3.isSquare = true//設(shè)置為方型點
pageControl3.currentWidthMultiple = 2.5//當(dāng)前點的寬度為其他點的2.5倍
pageControl3.currentColor = UIColor.red
pageControl3.otherColor = UIColor.blue
pageControl3.pointSize = CGSize.init(width: 14, height: 6)//方點的size
pageControl3.clickPoint { (index) in//方點的點擊事件
self.scrollView3.setContentOffset(CGPoint.init(x: width * CGFloat(index!), y: 0), animated: true)
}
self.view.addSubview(scrollView3)
self.view.addSubview(pageControl3)
}
代碼很簡單，一看就懂唆垃，歡迎各位大神給與指導(dǎo)意見以不斷完善五芝。
本項目github地址：GitHub - wei287030375/WEIPageControl: 最新SWIFT 4.0 版自定義PageControl，橢圓辕万，空心圓枢步，方形點，圖片點
如果覺得對你有幫助請給個star吧渐尿，也是對以后繼續(xù)創(chuàng)作的一種鼓勵醉途，謝謝
歡迎轉(zhuǎn)載
