前言
多视图滑动点击切换这个视图在很多app都有用到,我对这个view进行了封装,外界只需要调用一个接口,就能实现这个效果,使用方法和系统的tabbarcontroller很相似。
外界只需要调用下面这个接口即可集成.
1
2
3
4
|
/**
* 添加一个子控制器
*/
- ( void )addsubitemwithviewcontroller:(uiviewcontroller *)viewcontroller;
|
hytabbarview效果图如下
hytabbarview可灵活配置一屏宽显示多少个标题,以及标题栏的高度,具体看项目需求
1
2
|
#define hytabbarviewheight 49 //顶部标签条的高度
#define hycolumn 4 //一屏幕宽显示4个标题
|
实现思路详解
1、界面分析:分为上下部分,顶部uiscrollview
,底部uicollectionview
.再实现两部分的联动即可实现 (底部视图相对复杂,占用内存大,底部用uicollectionview
实现会比用uiscrollview
性能好很多)
2、每一个标题对应一个view视图,view视图交由相应的控制器来管理,代码结构十分清晰.做到不同view上的业务逻辑高聚合.也不会产生耦合性
3、上下两部分的联动,这里是同过kvo实现的,监听当前的selectedindex
,底部视图滚动时,修改selectedindex
的值.在kvo监听的回调方法里让标题居中.
4、其他细节相对简单,大家不看代码都知道如何处理,比如:点击顶部标题,设置按钮选中,切换到对应的collectioncell
等
ui结构示意图
代码片段:
1.外界传个控制器和一个标题,添加一个栏目
1
2
3
4
5
6
7
8
9
|
//外界传个控制器,添加一个栏目
- ( void )addsubitemwithviewcontroller:(uiviewcontroller *)viewcontroller{
uibutton * btn = [uibutton buttonwithtype:uibuttontypecustom];
[self.tabbar addsubview:btn];
[self setupbtn:btn withtitle:viewcontroller.title];
[btn addtarget:self action:@selector(itemselected:) forcontrolevents:uicontroleventtouchupinside];
[self.subviewcontrollers addobject:viewcontroller];
}
|
2.kvo监听当前选中view的序号值
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
|
//viewdidload中添加观察者
[self addobserver:self forkeypath:@ "selectedindex" options:nskeyvalueobservingoptionold |nskeyvalueobservingoptionnew context:@ "scrolltonextitem" ];
//让标题按钮居中算法
- ( void )observevalueforkeypath:(nsstring *)keypath ofobject:(id)object change:(nsdictionary *)change context:( void *)context{
if (context == @ "scrolltonextitem" ) {
self.prevselectedindex = [change[@ "old" ] integervalue];
if (self.prevselectedindex == self.selectedindex) {
return ;
}
//设置按钮选中
[self itemselectedindex:self.selectedindex];
uibutton * btn = self.titles[self.selectedindex];
//让选中按钮居中
nsinteger min = hycolumn / 2 ;
if (_selectedindex = self.titles.count - min) {
uibutton * tempbtn = self.titles[self.titles.count - min - 1];
cgfloat btnx = (hycolumn % 2 ) ? tempbtn.center.x : (tempbtn.center.x + btn.frame.size.width * 0.5) ;
cgfloat offsetx = _tabbar.center.x - btnx;
[uiview animatewithduration:0.25 animations:^{
_tabbar.contentoffset = cgpointmake(- offsetx, 0);
}];
} else if (_selectedindex > min && _selectedindex < self.titles.count - min && self.titles.count > hycolumn ) {
cgfloat btnx = (hycolumn % 2 ) ? btn.center.x : (btn.center.x - btn.frame.size.width * 0.5) ;
cgfloat offsetx = _tabbar.center.x - btnx;
[uiview animatewithduration:0.25 animations:^{
_tabbar.contentoffset = cgpointmake( - offsetx, 0);
}];
}
} else {
[super observevalueforkeypath:keypath ofobject:object change:change context:context];
}
}
|
控制器代码如下
使用方法类似系统的uitabbarcontroller
,外界只需直接传入控制器.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
- ( void )viewdidload {
[super viewdidload];
[self.view addsubview:self.tabbarview];
} //懒加载- (hytabbarview *)tabbarview{ if (!_tabbarview) {
_tabbarview = ({
hytabbarview * tabbar = [[hytabbarview alloc]initwithframe:cgrectmake(0,30,[uiscreen mainscreen].bounds.size.width,600)];
for (nsinteger i = 0; i< 10; i ++) {
uiviewcontroller * vc = [[uiviewcontroller alloc]init];
vc.title = [nsstring stringwithformat:@ "第%ld个" ,i+1];
[tabbar addsubitemwithviewcontroller:vc];
}
tabbar;
});
} return _tabbarview;
}
|
总结
以上就是ios多视图滑动点击切换的集成的全部内容,希望对大家开发ios的时候能有所帮助。