文档章节

自定义UITabBarController

哥特复心
 哥特复心
发布于 2014/03/09 23:44
字数 704
阅读 518
收藏 5

下面我们来看图片 在此输入图片描述

效果如上图所示 实现思路如下: 思路:1.定义一个GXViewController类继承自UITabBarController

    2.将原先的tabbar隐藏,自定义一个控件覆盖在上面

    3.在控件内增加可以点击的按钮,调整控件和按钮的具体细节,以达到上图中的效果。

<!-- lang: cpp -->
#import "GXViewController.h"

#import "GXCustomButton.h"

@interface GXViewController () {

UIImageView *_tabBarView; //自定义的覆盖原先的tarbar的控件

GXCustomButton *_previousBtn; //记录前一次选中的按钮

}

@end

@implementation GXViewController

  • (void)viewDidLoad {

    [super viewDidLoad];

    self.tabBar.hidden = YES; //隐藏原先的tabBar CGFloat tabBarViewY = self.view.frame.size.height - 49;

    _tabBarView = [[UIImageView alloc] initWithFrame:CGRectMake(0, tabBarViewY, 320, 49)]; _tabBarView.userInteractionEnabled = YES; //这一步一定要设置为YES,否则不能和用户交互 _tabBarView.image = [UIImage imageNamed:@"背景图片"];

    [self.view addSubview:_tabBarView];

    // 下面的方法是调用自定义的生成按钮的方法 [self creatButtonWithNormalName:@"图片1"andSelectName:@"图片2"andTitle:@"消息"andIndex:0]; [self creatButtonWithNormalName:@"图片3"andSelectName:@"图片4"andTitle:@"联系人"andIndex:1]; [self creatButtonWithNormalName:@"图片5"andSelectName:@"图片6"andTitle:@"动态"andIndex:2]; [self creatButtonWithNormalName:@"图片7"andSelectName:@"图片8"andTitle:@"设置"andIndex:3];

    GXCustomButton *btn = _tabBarView.subviews[0];

    [self changeViewController:btn]; //自定义的控件中的按钮被点击了调用的方法,默认进入界面就选中第一个按钮

}

#pragma mark 创建一个按钮

  • (void)creatButtonWithNormalName:(NSString *)normal andSelectName:(NSString *)selected andTitle:(NSString )title andIndex:(int)index { / GXCustomButton是自定义的一个继承自UIButton的类,自定义该类的目的是因为系统自带的Button可以设置image和title属性,但是默认的image是在title的左边,若想想上面图片中那样,将image放在title的上面,就需要自定义Button,设置一些东西。(具体GXCustomButton设置了什么,放在下面讲) */

    GXCustomButton *button = [GXCustomButton buttonWithType:UIButtonTypeCustom]; button.tag = index;

    CGFloat buttonW = _tabBarView.frame.size.width / 4; CGFloat buttonH = _tabBarView.frame.size.height; button.frame = CGRectMake(80 *index, 0, buttonW, buttonH);

    [button setImage:[UIImage imageNamed:normal] forState:UIControlStateNormal]; [button setImage:[UIImage imageNamed:selected] forState:UIControlStateDisabled]; [button setTitle:title forState:UIControlStateNormal];

    [button addTarget:self action:@selector(changeViewController:) forControlEvents:UIControlEventTouchDown];

    button.imageView.contentMode = UIViewContentModeCenter; // 让图片在按钮内居中 button.titleLabel.textAlignment = NSTextAlignmentCenter; // 让标题在按钮内居中 button.font = [UIFont systemFontOfSize:12]; // 设置标题的字体大小

    [_tabBarView addSubview:button];

}

#pragma mark 按钮被点击时调用

  • (void)changeViewController:(GXCustomButton *)sender { self.selectedIndex = sender.tag; //切换不同控制器的界面

    sender.enabled = NO;

    if (_previousBtn != sender) {

      _previousBtn.enabled = YES;
    

    }

    _previousBtn = sender;

}

@end

自定义的GXCustomButton按钮.m中的代码如下:

<!-- lang: cpp -->
#import "GXCustomButton.h"

@implementation GXCustomButton

#pragma mark 设置Button内部的image的范围

  • (CGRect)imageRectForContentRect:(CGRect)contentRect { CGFloat imageW = contentRect.size.width; CGFloat imageH = contentRect.size.height * 0.6;

    return CGRectMake(0, 0, imageW, imageH); }

#pragma mark 设置Button内部的title的范围

  • (CGRect)titleRectForContentRect:(CGRect)contentRect { CGFloat titleY = contentRect.size.height *0.6; CGFloat titleW = contentRect.size.width; CGFloat titleH = contentRect.size.height - titleY;

    return CGRectMake(0, titleY, titleW, titleH); }

@end

代码完成,基本核心代码如上!当然这只是一个简单的自定义tabbar,复杂的只是在这个基础上添加技术罢了!

© 著作权归作者所有

哥特复心
粉丝 109
博文 68
码字总数 40593
作品 0
长沙
高级程序员
私信 提问
高度自定义 TabBarController 组件--ESTabBarController

ESTabBarController 是一个高度自定义的 TabBarController 组件,继承自 UITabBarController,可轻松自定义 UI 样式,添加动画等。 功能 1、支持默认样式 如果直接使用ESTabBarController进行...

eggswift
2017/02/14
109
0
IOS 学习---视图,标签,导航控制器详解

当一个项目中UITabBarController,UIViewController三种控制器同时出现的时候,将标签控制器(UITabBarController)作为视图的根控制器,将创建的视图控制器作为标签控制器的子控制器。 //创建...

fengyun321
2015/09/12
38
0
UITabBarController的使用详解及其自定义

简介 UITabBarController - 选项卡控制器,与导航控制器一样,也被广泛用于各种ios应用程序。顾名思义,选项卡控制器在屏幕底部显示一系列“选显卡”,这些选项卡表示为图标和文本,用户触摸...

壹峰
2018/11/20
0
0
OSC客户端工具条是UITabBarController吗?

这个工具条是UITabBarController带的,还是几个按钮拼起来的? 点击中间的加号弹出的是模态视图,而不是切换视图效果。 QQ空间客户端也是这个风格,请问是怎么实现的? 我是觉得如果在UITab...

有谁知道光棍的好
2015/05/10
373
2
iOS开发简记(2):自定义tabbar

tabbar是放在APP底部的控件。常见的APP都使用tabbar来进行功能分类的管理,比如微信、QQ等等。 小程需要一个特殊一点的tabbar,要求突显中间的那个按钮,让中间按钮特别显眼,从而引导用户去...

jonlan
2018/11/17
0
0

没有更多内容

加载失败,请刷新页面

加载更多

利用mybatis generator生成实体类、Mapper接口以及对应的XML文件

项目中通常会遇到数据的持久化,如果是采用mybatis的orm,就会涉及到生成xml的问题,刚好mybatis官网提供了这么个插件MyBatis Generator,效果简直是棒呆。 1. 首先需要在build.gradle文件中...

啊哈关关
今天
2
0
SpringSocial相关的知识点

使用SprigSocial开发第三方登录 核心类 ServiceProvider(AbstractOauth2ServiceProvider):主要负责实现server提供商(例如QQ,微信等共有的东西),默认实现类是AbstractOauth2ServiceProvider...

chendom
今天
2
0
Java并发之AQS详解

一、概述   谈到并发,不得不谈ReentrantLock;而谈到ReentrantLock,不得不谈AbstractQueuedSynchronizer(AQS)!   类如其名,抽象的队列式的同步器,AQS定义了一套多线程访问共享资源...

群星纪元
昨天
2
0
Fabric-sdk-java最新教程

Fabric Java SDK是Fabric区块链官方提供的用于Java应用开发的SDK,全称为Fabric-sdk-java,网上可用资料不多,本文列出了精心整理的针对Fabric Java SDK的最新精选教程。 如果希望快速掌握F...

汇智网教程
昨天
3
0
react 子组件监听props 变化

componentWillReceiveProps //已经被废弃 getDerivedStateFromProps// 推荐使用//如果条件不存在必须要返回null static getDerivedStateFromProps(props, current_stat...

一箭落旄头
昨天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部