前言
多視圖滑動(dòng)點(diǎn)擊切換這個(gè)視圖在很多App都有用到,我對這個(gè)View進(jìn)行了封裝,外界只需要調(diào)用一個(gè)接口,就能實(shí)現(xiàn)這個(gè)效果,使用方法和系統(tǒng)的tabbarController很相似。
外界只需要調(diào)用下面這個(gè)接口即可集成.
/** * 添加一個(gè)子控制器 */- (void)addSubItemWithViewController:(UIViewController *)viewController;
HYTabbarView效果圖如下

HYTabbarView可靈活配置一屏寬顯示多少個(gè)標(biāo)題,以及標(biāo)題欄的高度,具體看項(xiàng)目需求
#define HYTabbarViewHeight 49 //頂部標(biāo)簽條的高度#define HYColumn 4 //一屏幕寬顯示4個(gè)標(biāo)題
實(shí)現(xiàn)思路詳解
1、界面分析:分為上下部分,頂部UIScrollView,底部UICollectionView.再實(shí)現(xiàn)兩部分的聯(lián)動(dòng)即可實(shí)現(xiàn) (底部視圖相對復(fù)雜,占用內(nèi)存大,底部用UICollectionView實(shí)現(xiàn)會(huì)比用UIScrollView性能好很多)
2、每一個(gè)標(biāo)題對應(yīng)一個(gè)View視圖,View視圖交由相應(yīng)的控制器來管理,代碼結(jié)構(gòu)十分清晰.做到不同View上的業(yè)務(wù)邏輯高聚合.也不會(huì)產(chǎn)生耦合性
3、上下兩部分的聯(lián)動(dòng),這里是同過KVO實(shí)現(xiàn)的,監(jiān)聽當(dāng)前的selectedIndex,底部視圖滾動(dòng)時(shí),修改selectedIndex的值.在KVO監(jiān)聽的回調(diào)方法里讓標(biāo)題居中.
4、其他細(xì)節(jié)相對簡單,大家不看代碼都知道如何處理,比如:點(diǎn)擊頂部標(biāo)題,設(shè)置按鈕選中,切換到對應(yīng)的CollectionCell等
UI結(jié)構(gòu)示意圖

代碼片段:
1.外界傳個(gè)控制器和一個(gè)標(biāo)題,添加一個(gè)欄目
//外界傳個(gè)控制器,添加一個(gè)欄目- (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監(jiān)聽當(dāng)前選中View的序號值
//viewDidLoad中添加觀察者[self addObserver:self forKeyPath:@"selectedIndex" options:NSKeyValueObservingOptionOld |NSKeyValueObservingOptionNew context:@"scrollToNextItem"]; //讓標(biāo)題按鈕居中算法- (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; } //設(shè)置按鈕選中 [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]; }} 控制器代碼如下
使用方法類似系統(tǒng)的UITabbarController,外界只需直接傳入控制器.
- (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個(gè)",i+1]; [tabbar addSubItemWithViewController:vc]; } tabbar; }); } return _tabbarView;}總結(jié)
以上就是iOS多視圖滑動(dòng)點(diǎn)擊切換的集成的全部內(nèi)容,希望對大家開發(fā)IOS的時(shí)候能有所幫助
新聞熱點(diǎn)
疑難解答
圖片精選