文档章节

iOS TabBar 自定义

别情花如依丶
 别情花如依丶
发布于 2017/05/05 17:50
字数 221
阅读 24
收藏 0

如图,项目需求:

项目需求图

完成该 tabBar 需要对 TabBar 进行自定义.多数都会采用自定义 UITabBar 通过重写 layoutSubviews 方法实现,这种方法比较麻烦,对中间按钮点击事件特殊处理.

简单方式可以通过设置 UITabBarItem 的 Image 偏移量来实现这种效果:tabBarItem.imageInsets = UIEdgeInsetsMake(-15, 0, 15, 0);

如果中间按钮点击不需要跳转页面,则可通过代理方法:tabBarController:shouldSelectViewController:实现

线条采用 UIBezierPath 绘制,代码如下:

    UIBezierPath *path = [UIBezierPath bezierPath];
    [path moveToPoint:CGPointMake(0, width / 2 * (1 - sin(M_PI / 12)))];
    [path addLineToPoint:CGPointMake((KScreenWidth -width ) / 2, width / 2 * (1 - sin(M_PI / 12)))];
    [path addArcWithCenter:CGPointMake(KScreenWidth / 2, width / 2 ) radius:width / 2 / cos(M_PI / 12) startAngle:(M_PI + M_PI / 12) endAngle:M_PI * 2 - M_PI / 12  clockwise:YES];
    [path addLineToPoint:CGPointMake(KScreenWidth, width / 2 * (1 - sin(M_PI / 12)))];
    CAShapeLayer *shapLayer = [CAShapeLayer layer];
    shapLayer.frame = CGRectMake(0, - width / 2 + 2, KScreenWidth, width / 2);
    shapLayer.strokeColor = kCOLORWITH_RGB(165, 165, 165).CGColor;
    shapLayer.lineWidth = 2;
    shapLayer.fillColor = [UIColor clearColor].CGColor;
    shapLayer.path = path.CGPath;
    [self.tabBar.layer addSublayer:shapLayer];

 

© 著作权归作者所有

共有 人打赏支持
别情花如依丶

别情花如依丶

粉丝 5
博文 78
码字总数 20405
作品 6
程序员
私信 提问
IOS开发—无需自定义,修改tabbar背景颜色

最近修改的项目都是基于IOS 5.0或以上的版本的,在IOS 6一下的版本中,系统默认的tabbar是黑色的,但是此项目需要改成兼容IOS 7和IOS 8的,大家都知道IOS 7开始,IOS的 UI 进入了扁平的时代,...

TomatosX
2015/03/18
0
1
完美结局iPhoneX自定义tabBar重影问题

对于iOS开发者来说,底部的tabBar通常都是需要自定义,因为系统自带的或多或少和我们要求的总有一点的出入。 在自定义tabBar后,通常做法就是移除系统的tabBar来防止出现重影的问题。 在iPh...

会飞的海豚哦
05/24
0
0
fir.im Weekly - iOS 开发中的 Git 流程

本期 fir.im Weekly 收集了微博上的热转资源,包含 Android、iOS 开发工具、源码等好用的轮子,还有一些 APP 设计的 Tips,希望对你有用。 精仿知乎日报 iOS 端 @我偏笑_NSNirvana花了将近一...

风起云飞fir_im
2015/11/03
0
0
react native 类库(一)

计时器类库 https://github.com/react-native-component/react-native-smart-timer-enhance TabBar底部导航(兼容Android和IOS)--react-native-tab-navigator 下载依赖: npm install react-n......

Chason-洪
2017/09/19
0
0
React Navigation

https://reactnavigation.org/docs/intro/nesting 官网 http://blog.csdn.net/u013718120/article/details/72357698 http://www.jianshu.com/p/2f575cc35780 这里只是基本用法,高级详情用法......

Chason-洪
2017/11/15
0
0

没有更多内容

加载失败,请刷新页面

加载更多

java.util.concurrent.atomic.AtomicLong 源码

类图: 源码: package java.util.concurrent.atomic;import java.util.function.LongUnaryOperator;import java.util.function.LongBinaryOperator;import sun.misc.Unsafe;......

狼王黄师傅
25分钟前
1
0
Java每天10道面试题,跟我走,offer有!(六)

51.HashMap的实现原理 HashMap的主干是一个Entry数组。Entry是HashMap的基本组成单元,每一个Entry包含一个key-value键值对。HashMap基于hashing原理,我们通过put()和get()方法储...

Java干货分享
31分钟前
1
0
剧调查黑客偏爱用 Python,可能是世界上最好的语言

导读 Python 变得越来越流行,在之前 9 月份的 TIOBE 排行榜中,Python 甚至挤下 C++,拿到第三名。而这有一部分原因应当归于黑客对 Python 的热衷。 据 Threatpost 报导,在 Imperva 最近一...

问题终结者
36分钟前
1
0
apollo生产环境配置-实践笔记(附搭建框架图)

前言 我们这个月上线了apollo1.1.1版本(生产环境),目前一切运行良好,故在此记个笔记。 首先,附上流程图: 简要介绍 一套apollo portal配置管理服务来同时管理pro、dev环境,但pro、dev...

开源小菜鸟2333
38分钟前
3
0
angular6 利用 ngContentOutlet 实现组件位置交换

这篇文章主要介绍了angular6 利用 ngContentOutlet 实现组件位置交换(重排),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧 ngContentOutlet指令介绍 ngCont...

嫣然丫丫丫
45分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部