前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >iOS给TabBar顶部黑线添加发光的阴影

iOS给TabBar顶部黑线添加发光的阴影

作者头像
公众号iOS逆向
发布于 2021-07-29 08:10:41
发布于 2021-07-29 08:10:41
1.5K00
代码可运行
举报
文章被收录于专栏:iOS逆向与安全iOS逆向与安全
运行总次数:0
代码可运行

前言

技术实现关键点:通过layer.shadowOpacityView.layer.shadowOffset实现

原文地址

https://blog.csdn.net/z929118967/article/details/93181646

I 、去掉TabBar的顶部黑线,并添加发光的阴影

在这里插入图片描述

  • setupshadowColor
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制


- (void)setupshadowColor{
    
    UIView * tmpView = self;
    tmpView.layer.shadowColor = [UIColor blackColor].CGColor;//设置阴影的颜色
    tmpView.layer.shadowOpacity = 0.08;//设置阴影的透明度
    tmpView.layer.shadowOffset = CGSizeMake(kAdjustRatio(0), kAdjustRatio(0));//设置阴影的偏移量,阴影的大小,x往右和y往下是正
    tmpView.layer.shadowRadius = kAdjustRatio(5);//设置阴影的圆角,//阴影的扩散范围,相当于blur radius,也是shadow的渐变距离,从外围开始,往里渐变shadowRadius距离

    
//去掉TabBar的顶部黑线    
[self setBackgroundImage:[UIImage createImageWithColor:[UIColor clearColor]]];
[self setShadowImage:[UIImage createImageWithColor:[UIColor clearColor]]];
    
}

II 、给视图底部添加发光的阴影

2.1 效果

在这里插入图片描述

在这里插入图片描述

2.2 代码实现

  • QCTShadowView
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
@implementation QCTShadowView


- (instancetype)init
{
    self = [super init];
    if (self) {
        
        [self setupshadowColor];
//

    }
    return self;
}

- (void)layoutSubviews{
    [super layoutSubviews];
    [self layoutIfNeeded];
    [self.layer layoutIfNeeded];

    [self setupshadowColor];
    
}


- (void) setupshadowColor{
    
    UIView * tmpView = self;
    tmpView.layer.shadowColor = [UIColor blackColor].CGColor;//设置阴影的颜色
    tmpView.layer.shadowOpacity = 0.08;//设置阴影的透明度
    tmpView.layer.shadowOffset = CGSizeMake(kAdjustRatio(0), kAdjustRatio(5));//设置阴影的偏移量,阴影的大小,x往右和y往下是正
    tmpView.layer.shadowRadius = kAdjustRatio(5);//设置阴影的圆角,//阴影的扩散范围,相当于blur radius,也是shadow的渐变距离,从外围开始,往里渐变shadowRadius距离

    
}

III、小知识点

3.1 避免selectedViewController视图被TabBar挡住

  • 错误约束
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
        [_vcView mas_makeConstraints:^(MASConstraintMaker *make) {
            make.edges.offset(0);
        }];

  • 正确约束
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
        [_vcView mas_makeConstraints:^(MASConstraintMaker *make) {
                [tmp mas_makeConstraints:^(MASConstraintMaker *make) {
            
            make.left.equalTo(weakSelf.view).offset(0);
            make.right.equalTo(weakSelf.view).offset(- 0);
            make.top.equalTo(weakSelf.view).offset(0);
            make.bottom.equalTo(weakSelf.view).offset(-weakSelf.tabBarController.tabBar.bounds.size.height);//避免视图被TabBar挡住
            
        }];

            
        }];


3.2 iOS 13适配深色模式【设置UITabBarItem上title颜色】

https://blog.csdn.net/z929118967/article/details/104487015

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
    // 适配iOS13导致的bug
    if (@available(iOS 13.0, *)) {
        // iOS 13以上
//        self.tabBar.tintColor = ;
        self.tabBar.unselectedItemTintColor = ktabNorTextColor;
        
        self.tabBar.tintColor = ktabSelectedTextColor;
//        self.tabBar.unselectedItemTintColor = ;

//        UITabBarItem *item = [UITabBarItem appearance];
//        item.titlePositionAdjustment = UIOffse/tMake(0, -2);
//        [item setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:12]} forState:UIControlStateNormal];
//        [item setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:12]} forState:UIControlStateSelected];
    } else {
//        // iOS 13以下
//        UITabBarItem *item = [UITabBarItem appearance];
//        item.titlePositionAdjustment = UIOffsetMake(0, -2);
//        [item setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:12], NSForegroundColorAttributeName:RGB_HEX(0x999999)} forState:UIControlStateNormal];
//        [item setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:12], NSForegroundColorAttributeName:RGB_HEX(0xfb5400)} forState:UIControlStateSelected];
        //设置文字样式
        NSMutableDictionary *textAttr = [NSMutableDictionary dictionary];
        textAttr[NSForegroundColorAttributeName] = ktabNorTextColor;
        [childVC.tabBarItem setTitleTextAttributes:textAttr forState:UIControlStateNormal];
        //选择状态的文字颜色样式
        NSMutableDictionary *selectedTextAttr = [NSMutableDictionary dictionary];
        [selectedTextAttr setValue:ktabSelectedTextColor forKey:NSForegroundColorAttributeName];
        
        
        
        [childVC.tabBarItem setTitleTextAttributes:selectedTextAttr forState:UIControlStateSelected];

        
        
    }
    


3.3 右滑返回手势

若项目有全局的UINavigationController基类,给页面添加右滑返回手势

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
@implementation NavigationController

- (void)viewDidLoad
{
    [super viewDidLoad];
    //设置右滑返回手势的代理为自身
    __weak typeof(self) weakself = self;
    if ([self respondsToSelector:@selector(interactivePopGestureRecognizer)]) {
        self.interactivePopGestureRecognizer.delegate = (id)weakself;
    }
}

#pragma mark - UIGestureRecognizerDelegate
//这个方法是在手势将要激活前调用:返回YES允许右滑手势的激活,返回NO不允许右滑手势的激活
- (BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer
{
    if (gestureRecognizer == self.interactivePopGestureRecognizer) {
        //屏蔽调用rootViewController的滑动返回手势,避免右滑返回手势引起死机问题
        if (self.viewControllers.count < 2 ||
 self.visibleViewController == [self.viewControllers objectAtIndex:0]) {
            return NO;
        }
    }
    //这里就是非右滑手势调用的方法啦,统一允许激活
    return YES;
}
本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2021-07-16,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 iOS逆向 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
iOS项目——基本框架搭建
项目开发过程中,在完成iOS项目——项目开发环境搭建之后,我们首先需要考虑的就是我们的项目的整体框架与导航架构设计,然后在这个基础上考虑功能模块的完成。 一 导航架构设计   一款App的导航架构设计
mukekeheart
2018/03/01
1.9K0
iOS项目——基本框架搭建
iOS TabBar 轮子
今天在GitHub上找了一个TabBar的轮子,Star 6.5k还不错,日常开发已经够用了,设置图片,选中图片,文本颜色,选中文本颜色,数字角标,选中动画,中间凸起按钮都有,日常开发已经够用了。具体可以去GitHub上看文档。 CYLTabBarController 自己写的Demo
赵哥窟
2021/12/16
1.1K0
iOS TabBar 轮子
六天完成一个简单iOS App - 第一天
项目介绍 仿照百思不得姐,通过看李明杰老师视频学习自己实践并简单总结项目开发过程中普遍遇到的问题,并且将可以用到其他项目中的分类方法进行简单总结,便于以后在别的项目中使用。 每天任务 1. 实现相应功能 2. 代码重构,简单优化 第一天任务: 配置项目基本环境 搭建框架 代码重构 配置项目基本环境 一. 接口获取 我们可以通过Charles等工具抓包来获取我们想做的App的接口,然后通过解析将每个接口的数据解析出来。也可以去知乎中有趣的 API 接口推荐找找看。 二. 项目图片获取方式 图片的获
xx_Cc
2018/05/10
1.2K0
新浪微博客户端(4)-设置导航栏主题
为了使整个项目的NavigationBar 上的UIBarButtonItem的颜色,字体大小一致,需要设置导航栏主题。
全栈程序员站长
2022/07/19
6570
新浪微博客户端(4)-设置导航栏主题
iOS去掉TabBar的顶部黑线,并添加发光的阴影
2.1 效果 2.2 添加发光的阴影的代码实现 3.1 避免selectedViewController视图被TabBar挡住 3.2 iOS 13适配深色模式【设置UITabBarItem上tit
公众号iOS逆向
2021/07/05
1.6K0
iOS去掉TabBar的顶部黑线,并添加发光的阴影
iOS广告轮播图
1.1 cell 头文件 1.2 cell 实现文件 1.3 cell的使用 引言 在这里插入图片描述 需求背景: 信用卡网申接入(IOS) 实现思路: 自定义cell封装CycleScrollVie
公众号iOS逆向
2021/07/05
7810
iOS广告轮播图
短视频APP源码中系统评论功能是如何实现的
短视频系统中评论功能的分量在短视频功能里可谓是举足轻重,下面简单介绍下,短视频系统中的评论功能的实现方式:
nicai123
2019/10/18
8170
短视频APP源码中系统评论功能是如何实现的
iOS_系统自带地图圆形区域选择范围
5.聚集操作:删除原理的大头针,在新经纬度添加大头针,并将地图移动到新的经纬度(反地理编码获得位置信息)
mikimo
2022/07/20
2.4K0
iOS_系统自带地图圆形区域选择范围
iOS项目——自定义UITabBar与布局
  在上一篇文章iOS项目——基本框架搭建中,我们详细说明了如何对TabBarItem的图片属性以及文字属性进行一些自定义配置。但是,很多时候,我们需要修改TabBarItem的图片和文字属性之外,还需要自定义TabBarItem的位置,这样系统自带的TabBar的样式并不能满足我们的项目需求,所以我们需要对系统的UITabBar进行自定义,以达到我们的项目需求。例如新浪微博App的底部tab的item就无法用自带的TabBarItem进行实现,最中间那个【+】发布微博并不是用来切换tab的,而是在当前的页
mukekeheart
2018/03/26
3.2K0
iOS项目——自定义UITabBar与布局
iOS UICollectionView 从右向左对齐的实现
iOS UICollectionView 从右向左对齐(Aligning right to left on UICollectionView)
公众号iOS逆向
2021/07/29
2.8K0
iOS小技能:适配安全区域距离(safeAreaInsets)
应用场景3: 适配上拉加载更多控件 _vcView.tableView.mj_footer.ignoredScrollViewContentInsetBottom = k_ignoredScrollViewContentInsetBottom;
公众号iOS逆向
2022/08/22
5K0
iOS小技能:适配安全区域距离(safeAreaInsets)
iOS TABAnimated 使用技巧一
由于第一次使用TABAnimated,遇到了很多问题,首先就是对xib支持不怎么友好。
赵哥窟
2021/07/21
1.4K0
iOS TABAnimated 使用技巧一
iOS自动布局框架之Masonry
目前iOS开发中大多数页面都已经开始使用Interface Builder的方式进行UI开发了,但是在一些变化比较复杂的页面,还是需要通过代码来进行UI开发的。而且有很多比较老的项目,本身就还在采用纯代码的方式进行开发。而现在iPhone和iPad屏幕尺寸越来越多,虽然开发者只需要根据屏幕点进行开发,而不需要基于像素点进行UI开发。但如果在项目中根据不同屏幕尺寸进行各种判断,写死坐标的话,这样开发起来是很吃力的。所以一般用纯代码开发UI的话,一般都是配合一些自动化布局的框架进行屏幕适配。苹果为我们提供的适配
xiangzhihong
2018/01/26
2.2K0
iOS 自定义tab滑块: segment功能+label混合显示;( Slider 双区间)【修订】
从CSDN下载Demo:https://download.csdn.net/download/u011018979/19790950
公众号iOS逆向
2021/07/05
8311
iOS 自定义tab滑块: segment功能+label混合显示;( Slider 双区间)【修订】
iOS 自定义tab滑块: segment功能+label混合显示;( Slider 双区间)
前言 在这里插入图片描述 原文: https://blog.csdn.net/z929118967/article/details/105076636 需求:商户交易汇总表使用tab滑块进行切换/筛
公众号iOS逆向
2021/03/24
9230
iOS 自定义tab滑块: segment功能+label混合显示;( Slider 双区间)
iOS视图滚动的时候控制导航条标题及公告视图的alpha(显示与隐藏)
应用场景:比如设计给我们的是一张黑色的返回箭头图.我们某个页面需要弄成白色的话.又不想重新设计一下新的图片
公众号iOS逆向
2021/07/29
1.8K0
iOS开中设置UITabBar的背景图片以及各个item的选中图片和未选中
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u010105969/article/details/51944019
用户1451823
2018/09/13
2.9K0
NavigationBar&tabBar调色那些事儿1. 导航栏调色那些事儿2. 标签栏TableBar那些事儿
Paste_Image.png 1. 导航栏调色那些事儿 小规律: 要设置内容,全找item 要修改颜色及文字属性,找bar 1.1 改变 NavigationBar 的背景颜色 [UINavigationBar appearance].barTintColor = [UIColor blueColor]; //如果使用的是backgroundColor,就会自带毛玻璃效果 self.navigationBar.backgroundColor = [UIcolor blueColor]; 1.2 改变 Na
stanbai
2018/06/28
1.6K0
iOS小技能: 网络加载中处理、接口暂无数据处理、全局监听用户点击事件
在日常开发中经常涉及数据列表的查询,处理服务侧无数据返回的情况或者网络异常的手段是iOS必备小技能。
公众号iOS逆向
2022/08/22
8280
iOS小技能: 网络加载中处理、接口暂无数据处理、全局监听用户点击事件
iOS小技能:设置状态栏背景颜色(图片)
解决办法:既然定位到问题所在,办法就是保证iOS 13 之后,每次也都能拿到有去只有一个对象。方法有很多,我的方法代码如下:使用 static 配合 gcd
公众号iOS逆向
2022/08/22
2.2K0
iOS小技能:设置状态栏背景颜色(图片)
推荐阅读
相关推荐
iOS项目——基本框架搭建
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验