寫在前面
“工欲善其事,必先利其器”-《論語·衛(wèi)靈公》
說到自定義控件,其實系統(tǒng)的控件已經(jīng)基本滿足了簡單的開發(fā)需要。但是對于一些app系統(tǒng)的控件是無法滿足的或者說系統(tǒng)的控件不能達(dá)到產(chǎn)品的需求。那么遇到這種怎么辦呢?很簡單 自己手?jǐn)]一個就可以了太抓。又有人說,現(xiàn)在網(wǎng)上那么多令杈,去git或者code4app上get一份下來就可以了走敌。是的 這也是一種方法。網(wǎng)上的固然好逗噩,不嘗試自己弄掉丽,那你永遠(yuǎn)沒有進(jìn)步的機(jī)會。如果項目有時間的話给赞,還是自己手?jǐn)]一個吧
自定義索引控件
相信好多人都用過系統(tǒng)的索引控件机打,但系統(tǒng)的限制就比較多了。而像下面這樣的 系統(tǒng)就無能無力了片迅。
看到這個效果残邀,細(xì)細(xì)想下 還是很簡單。主要還是動畫效果。當(dāng)點(diǎn)擊移動的時候 會有一個動畫效果芥挣,同時會有個toast提示驱闷。
1.首先 能夠點(diǎn)擊移動 說明有響應(yīng)事件發(fā)生。而能夠接受響應(yīng)事件空免,有UIButton空另,手勢等。但這個自定義控件中 還有移動事件蹋砚,因此用UIButton就不合適了扼菠。用手勢也可以做,不過在這里不用手勢來做坝咐,而用下面這幾個:
- (void)touchesBegan:(NSSet*)touches withEvent:(UIEvent *)event{ }
- (void)touchesMoved:(NSSet*)touches withEvent:(UIEvent *)event{ }
- (void)touchesEnded:(NSSet*)touches withEvent:(UIEvent *)event{ }
- (void)touchesCancelled:(NSSet*)touches withEvent:(UIEvent *)event{}
這幾個方法就可以接受開始 滑動 結(jié)束等事件循榆。
2.接下來就應(yīng)該考慮動畫了。你會發(fā)現(xiàn)動畫其實就是一個半圓形的圓弧墨坚。確定圓心和半徑后秧饮,在根據(jù)UILabel 的位置 根據(jù)勾股定理(x^2 + y^2 = z^2)就可以確定UILabel在該圓弧上的位置。在滑動的過程中 不停的改變UILabel在圓弧上的位置 就出現(xiàn)了這種動畫效果:
UITouch *touch = [touches anyObject];
CGPoint point = [touch locationInView:self];
CGFloat height = self.frame.size.height / self.array.count;
NSInteger index = point.y / height;
for (NSInteger i = 0; i< self.array.count; i++) {
UILabel *label = [self viewWithTag:indexTag + i];
if (fabs(point.y - label.center.y) < maxRadius) {
CGFloat centerX = self.frame.size.width * 0.5 - sqrt(maxRadius * maxRadius - fabs(point.y - label.center.y) *fabs(point.y - label.center.y));
[UIView animateWithDuration:0.2 animations:^{
label.center = CGPointMake(centerX, label.center.y);
}else{
[UIView animateWithDuration:0.2 animations:^{
label.center = CGPointMake(self.frame.size.width * 0.5, i * height + height *0.5);
}];
}}
3.選中回調(diào):當(dāng)接觸屏幕或者滑動的時候 都會隨時回調(diào)選中的結(jié)果泽篮。而這個選中事件在哪里寫比較好呢盗尸?不可能在結(jié)束的時候,因為在結(jié)束時 那么滑動的時候就不會回調(diào)了帽撑。所以只能在滑動中來處理選中事件泼各。其實也簡單,在上面的for循環(huán)中 加入一個判斷就可以了:
if (index <= self.array.count - 1 && index >= 0 && index != self.currentIndex) {
self.toastLabel.text = self.array[index];
self.toastLabel.alpha = 1;
self.currentIndex = index;
if (self.handler) {
self.handler(index);
};}
4.選中后油狂,手離開屏幕的事件了历恐。這個比較好弄 寸癌,手離開屏幕后专筷,所有的UILabel恢復(fù)原狀就可以了。
這樣蒸苇,這個自定義控件就OK了磷蛹。查看完整代碼