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

2022-01-12 498

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

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

前言

技术实现关键点：通过layer.shadowOpacity和View.layer.shadowOffset实现

原文地址

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

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

setupshadowColor

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

@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挡住

错误约束

   [_vcView mas_makeConstraints:^(MASConstraintMaker *make) {
            make.edges.offset(0);
        }];

正确约束

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

 // 适配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基类，给页面添加右滑返回手势

@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;
}