淺析iOS多視圖滑動點擊切換的整合_IOS

來源:互聯網
上載者:User

前言

多視圖滑動點擊切換這個視圖在很多App都有用到,我對這個View進行了封裝,外界只需要調用一個介面,就能實現這個效果,使用方法和系統的tabbarController很相似。

外界只需要調用下面這個介面即可整合.

/** * 添加一個子控制器 */- (void)addSubItemWithViewController:(UIViewController *)viewController;

HYTabbarView效果圖如下

HYTabbarView可靈活配置一屏寬顯示多少個標題,以及標題列的高度,具體看項目需求

#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.外界傳個控制器和一個標題,添加一個欄目

//外界傳個控制器,添加一個欄目- (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的序號值

//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,外界只需直接傳入控制器.

- (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的時候能有所協助。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.