? ? ? 系統(tǒng)的UISegmentControl雖然可以動(dòng)態(tài)計(jì)算寬度拘荡,但是不能滾動(dòng)。0..0鑒于需求撬陵,所以還是苦逼自己擼了一個(gè)Swift版珊皿。滿足動(dòng)態(tài)調(diào)節(jié)segment寬度网缝,以及自動(dòng)調(diào)整滾動(dòng)位置,選擇紅點(diǎn)顯示蟋定。?
效果圖:
主要的一些思路(同時(shí)希望大神能提下意見~~):
a.添加scrollView粉臊,然后在上面布局各個(gè)item,達(dá)到可供滾動(dòng)的需求驶兜。通過autoAdjustWidth屬性判斷是否自動(dòng)計(jì)算各個(gè)item的寬度扼仲。如果不自動(dòng)的話,就width = frame/numbersOfSegment抄淑,自動(dòng)的話則計(jì)算label顯示所需要的寬度屠凶。
b.在可供滾動(dòng)的需求上,繼續(xù)挖出一個(gè)自動(dòng)調(diào)整位置的需求蝇狼。讓選擇的item顯示在可視范圍阅畴,同時(shí)顯示出盡頭是否還有item的情況。額迅耘,挺簡(jiǎn)單的贱枣,直接上代碼:
private func scrollItemToPoint(index : Int,point:CGPoint) {
? ? ? ? let currentX = currentItemX(index: index)
? ? ? ? let scrollViewWidth = scrollView.bounds.size.width
? ? ? ? var scrollX = currentX - point.x + segmentWidth(index: index) * 0.5
? ? ? ? let maxScrollX = scrollView.contentSize.width - scrollViewWidth
? ? ? ? if scrollX > maxScrollX {
? ? ? ? ? ? ? ? ? ? scrollX = maxScrollX
? ? ? ? ? }
? ? ? ? ?if scrollX < 0.0 {
? ? ? ? ? ? ? ? ? ? ?scrollX = 0.0
? ? ? ? ? ? ?}
? ? ? ? ? scrollView.setContentOffset(CGPoint(x: scrollX, y: 0.0), animated: true)
}
c.紅點(diǎn)添加〔ǎ考慮到要顯示紅點(diǎn)纽哥,所以不直接使用UILabel當(dāng)Item,而是自定義JTItemView栖秕,里面放著label春塌,和一個(gè)紅點(diǎn)CALayer視圖。(本來想著自定義一個(gè)label子類簇捍,然后添加layer當(dāng)做紅點(diǎn)就行只壳,但是考慮到可能以后還要擴(kuò)展item的特性,所以直接使用了UIView的子類暑塑。)吼句。
提供了一個(gè)方法進(jìn)行紅點(diǎn)控制:func showBridge(show:Bool, index:Int)。
0.0接下來說說腫么使用~
1.平分布局:
var frame = CGRect(x: 10.0, y: 130.0, width: self.view.bounds.size.width - 20.0, height: 44.0)
let segmentControl = JTSegmentControl(frame: frame)
segmentControl.delegate = self
segmentControl.items = ["first", "second", "third", "fouth"]
segmentControl.showBridge(show: true, index: 1)
segmentControl.autoScrollWhenIndexChange = false
view.addSubview(segmentControl)
2.自動(dòng)計(jì)算item寬度(autoAdjustWidth)
frame = CGRect(x: 10.0, y: 250.0, width: self.view.bounds.size.width - 20.0, height: 44.0)
let autoWidthControl = JTSegmentControl(frame: frame)
autoWidthControl.delegate = self
autoWidthControl.items = ["first", "second", "third", "fouth", "fifth", "sixth", "seventh", "eighth"]
autoWidthControl.selectedIndex = 1
autoWidthControl.autoAdjustWidth = true
autoWidthControl.bounces = true
view.addSubview(autoWidthControl)
~還有一些樣式的屬性可供修改:
// JTSegmentPattern.swift
static let itemTextColor //item字體顏色
static let itemSelectedTextColor //選擇狀態(tài)的顏色
static let itemBackgroundColor //背景色
static let itemSelectedBackgroundColor //選中狀態(tài)背景色
//MARK - Text font
static let textFont //字體
static let selectedTextFont //選中狀態(tài)字體
//MARK - slider
static let sliderColor //滑動(dòng)條顏色
static let sliderHeight ?//滑動(dòng)條高度
//MARK - bridge
static let bridgeColor //紅點(diǎn)顏色
提供代理方法通知外界:
optional func didSelected(segement:JTSegmentControl, index: Int) //選擇了Item后觸發(fā)
=============STOP=================
//就是辣么簡(jiǎn)單事格。惕艳。。驹愚。远搪。。
//求鼓勵(lì)