姬長信(Redy)

多视图滑动点击切换极速集成-ios学习从入门到精通尽在姬长信

分享最热门的ios资讯

导读:

下面这个视图(多视图滑动点击切换)在很多App都有用到.我对这个View进行了封装,外界只需要调用一个接口,就能实现这个效果.使用要领和系统的tabbarController很相似.外界只需要调用下面这个接口即可集成.

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

Github源码分享:https://github.com/HelloYeah/HYTabbarView.

大家checkout时顺手点个星星,与人为乐,自得其乐.

HYTabbarView效果图如下

HYTabbarView可灵活配置一屏宽显示几多个标题,以及标题栏的高度,具体看项目需求
#define HYTabbarViewHeight 49    //顶部标签条的高度
#define HYColumn 4      //一屏幕宽显示4个标题

实现思路详解

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  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

Github源码分享:https://github.com/HelloYeah/HYTabbarView.

大家checkout时顺手点个星星,与人为乐,自得其乐。

用意志战胜身体的惰性!

退出移动版