ios 自定义uipickview
苹果一直推崇使用原生的组件，自带的uipickview其实也很漂亮了，看起来也很美观。但是有时候，产品会有一些特殊的设计和需求。本文将会讲解如何修改苹果原生的组件的属性，达到自定义uipickview的效果。
需求如下。需要自定义一个tab。自定义选中文字的颜色。自定义选中颜色背景，自定义未选中文字颜色。
修改未选中的文字的字体和颜色
经过分析，上面的取消和确定按钮实现起来还是很简单的。加一个条就好了，我就不介绍具体步骤，下面的没有选中时候文字的样色，已经字体大小，我们都可以在下面的代理方法里面修改。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
//change style
- (uiview *)pickerview:(uipickerview *)pickerview viewforrow:(nsinteger)row forcomponent:(nsinteger)component reusingview:(uiview *)view{
cgfloat width = [self pickerview:self.pickerview widthforcomponent:component];
cgfloat rowheight =[self pickerview:self.pickerview rowheightforcomponent:(component)];
uiview *myview = [[uiview alloc]init];
myview.frame =cgrectmake(0.0f, 0.0f, width, rowheight);
uilabel *txtlabel = [[uilabel alloc] init];
txtlabel.textcolor = self.plaincolor;
txtlabel.tag=200;
txtlabel.font = [uifont systemfontofsize:15*scale_6];
txtlabel.textalignment = nstextalignmentcenter;
txtlabel.frame = myview.frame;
txtlabel.text = [self pickerview:pickerview titleforrow:row forcomponent:component];
[myview addsubview:txtlabel];
return myview;
}
|
这样就可以修改未选中文字的颜色了。
修改选中的背景颜色和字体
但是背景颜色和字体如何修改呢。就是下图这个颜色和自体：
我一开始尝试了在这种方法，就是在上面加一层label。然后在代理方法中改变label的值。
|
1
2
3
4
5
6
7
8
9
10
11
|
-(nsstring*)pickerview:(uipickerview *)pickerview titleforrow:(nsinteger)row forcomponent:(nsinteger)component
{
if (component==0) {
return self.leftarray[row];
}else if(component==1){
return self.rightarray[row];
}else {
return self.rightarray[row];
}
}
|
不过这个方法在如果使用手指点击的话，索引值是对不上的，这样的后果就是，label会一卡一卡的。如果只在这个方法设置label的值，那快速滑动的时候获取不到值，label值变化就会很慢。完全没有了原生的那种效果了。
最后，我才用的是获取系统图层的方法，在选择器的代理方法里面获取相应的图层，然后进行修改。我们先看一下pickview的图层。
我们只需要在代理方面里面拿到对应的视图然后修改就好
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
|
//change style
- (uiview *)pickerview:(uipickerview *)pickerview viewforrow:(nsinteger)row forcomponent:(nsinteger)component reusingview:(uiview *)view{
cgfloat width = [self pickerview:self.pickerview widthforcomponent:component];
cgfloat rowheight =[self pickerview:self.pickerview rowheightforcomponent:(component)];
uiview *myview = [[uiview alloc]init];
myview.frame =cgrectmake(0.0f, 0.0f, width, rowheight);
uilabel *txtlabel = [[uilabel alloc] init];
txtlabel.textcolor = self.plaincolor;
txtlabel.tag=200;
txtlabel.font = [uifont systemfontofsize:15*scale_6];
txtlabel.textalignment = nstextalignmentcenter;
txtlabel.frame = myview.frame;
txtlabel.text = [self pickerview:pickerview titleforrow:row forcomponent:component];
[myview addsubview:txtlabel];
uiview* topline = [pickerview.subviews objectatindex:1];
uiview* botomline = [pickerview.subviews objectatindex:2];
topline.hidden = yes;
botomline.hidden = yes;
bool issetttingbackcolor = no;
uiview *subview = [self.pickerview.subviews firstobject];
for ( uiview *pickercolumnview in subview.subviews) {
nslog(@"pickercolumnview class %@",[pickercolumnview class]);
uiview *pickerview = [pickercolumnview.subviews lastobject];
if (!issetttingbackcolor) {
pickerview.backgroundcolor = self.selectedbackcolor;
issetttingbackcolor = !issetttingbackcolor;
}
uiview *tableview = [pickerview.subviews lastobject];
for (uiview *cell in tableview.subviews) {
nslog(@"cell class %@",[cell class]);
uiview *cellview = [cell.subviews lastobject];
uiview *labelsuper = [cellview.subviews lastobject];
uilabel *label = [labelsuper.subviews lastobject];
label.textcolor = [uicolor whitecolor];
}
}
return myview;
}
|
下面的代码是用户隐藏pickview自带的两根细线。
|
1
2
3
4
|
uiview* topline = [pickerview.subviews objectatindex:1];
uiview* botomline = [pickerview.subviews objectatindex:2];
topline.hidden = yes;
botomline.hidden = yes;
|
设置是否修改颜色bool issetttingbackcolor = no;这个变量是为了防止多次设置背景颜色。造成相互遮盖。
最后效果如下：
demo地址:jsdcustompickview-master.rar
感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！