(JXPageControl 支持多種動(dòng)畫(huà)變換, 支持內(nèi)容布局變換, 支持Xib布局)

• 1. 開(kāi)發(fā)環(huán)境: Xcode 7
• 2. 運(yùn)行條件: iOS(8.0+)
• 開(kāi)源框架：github地址

?

（如果使用有什么問(wèn)題，可以留言，歡迎一起學(xué)習(xí)，歡迎star）

Installation [安裝]

安裝，只需將以下面代碼添加到您的Podfile:

platform :ios, '8.0'

target 'TargetName' do
pod 'JXPageControl'
end

UI效果

• JXPageControlChameleon

chamelon.gif

• JXPageControlExchange

exchange.gif

• JXPageControlFill

fill.gif

• JXPageControlJump

jump.gif

• JXPageControlScale

scare.gif

Frame set [框架集合]

• Common 框架公用類文件
• Jump 跳躍式動(dòng)畫(huà)效果類文件
• Transform 轉(zhuǎn)變式動(dòng)畫(huà)類文件

JXPageControl 介紹

?

• JXPageControlBase - 所有pageControl的基類
• JXPageControlType - 所有pageControl的準(zhǔn)守的協(xié)議, 它提供了很多自定義API供給開(kāi)發(fā)者使用

?

JXPageControlType - 提供的 - API。

?

• numberOfPages ---> 指示器個(gè)數(shù)。
• currentPage ---> 當(dāng)前指示器頁(yè)碼。
• progress ---> 當(dāng)前指示器頁(yè)碼進(jìn)程。
• hidesForSinglePage --->只有一個(gè)指示器時(shí),是否隱藏。
• inactiveColor ---> 不活躍指示器顏色
• activeColor ---> 活躍指示器顏色
• inactiveSize ---> 不活躍指示器大小
• activeSize ---> 活躍指示器大小
• indicatorSize ---> 所有指示器大小
• columnSpacing ---> 指示器水平間距
• contentAlignment ---> 內(nèi)容布局位置 (注意這個(gè)屬性很好用!!!!!)
• contentMode ---> 內(nèi)容布局位置,并且支持在Xib中變換,實(shí)時(shí)查看位置變化 (注意這個(gè)屬性很好用!!!!!)
• isInactiveHollow ---> 不活躍指示器是否是空心圖形
• isActiveHollow ---> 活躍指示器是否是空心圖形
• reload() ---> 刷新數(shù)據(jù)/UI

注意 :

JXPageControl 還提供了一些非 JXPageControlType 的 API?？梢栽诰唧w只用類中查看

?

[JXPageControl 使用] :

?

Example 1

• 在 xib, storyboard中使用 ( xib, storyboard 中可以完成屬性和布局設(shè)置 !!! )

• 注意 module要選擇 JXPageControl, 否則會(huì)顯示不出來(lái), 調(diào)用會(huì)報(bào)錯(cuò)

• View 中可以設(shè)置 contentMode , 變換內(nèi)容位置

?

377EC788-0C82-4F4F-BC81-45CDF5672231.png

F0A66BAE-61F5-4FB2-8429-03C27090DBB7.png

Example 2

• 使用純代碼編寫(xiě)

import JXPageControl

class ChamelonVC: UIViewController {

    lazy var codePageControl: JXPageControlJump = {
        let pageControl = JXPageControlJump(frame: CGRect(x: 0,
                                                          y: 0,
                                                          width: UIScreen.main.bounds.width,
                                                          height: 30))
        pageControl.numberOfPages = 4
        
        // JXPageControlType: default property
//        pageControl.currentPage = 0
//        pageControl.progress = 0.0
//        pageControl.hidesForSinglePage = false
//        pageControl.inactiveColor = UIColor.white.withAlphaComponent(0.5)
//        pageControl.activeColor = UIColor.white
//        pageControl.inactiveSize = CGSize(width: 10, height: 10)
//        pageControl.activeSize = CGSize(width: 10, height: 10)
//        pageControl.inactiveSize = CGSize(width: 10, height: 10)
//        pageControl.columnSpacing = 10
//        pageControl.contentAlignment = JXPageControlAlignment(.center,
//                                                              .center)
//        pageControl.contentMode = .center
//        pageControl.isInactiveHollow = false
//        pageControl.isActiveHollow = false
        
        // JXPageControlJump: default "custom property"
        pageControl.isAnimation  = true
        pageControl.isFlexible = true
        
        return pageControl
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        view.addSubview(codePageControl)
    }
    
}

extension ChamelonVC: UIScrollViewDelegate {
    func scrollViewDidScroll(_ scrollView: UIScrollView) {
        let progress = scrollView.contentOffset.x / scrollView.bounds.width
        let currentPage = Int(round(progress))
        
        // 方式一
        codePageControl.progress = progress
        
        // 方式二
//        codePageControl.currentPage = currentPage

    }
    
}

Example 2 and so on ...

import JXPageControl
...

Demo地址