美文网首页ios学习iOS开发界面
如何在UIBarButtonItem上显示数字(BadgeVal

如何在UIBarButtonItem上显示数字(BadgeVal

作者: 李小争 | 来源:发表于2015-12-09 11:56 被阅读2887次

    原因:项目中想要实现购物车右上角显示购物车中上品数量,但是直接用UIBarButtonItem不能实现要求

    这里是实现后的效果图:

    购物车动画.gif

    一开始直接创建的UIBarButtonItem,但是不能直接往上面添加想要的效果,因为

    NS_CLASS_AVAILABLE_IOS(2_0) @interface UIBarButtonItem : UIBarItem <NSCoding>
    

    而且

    NS_CLASS_AVAILABLE_IOS(2_0) @interface UIBarItem : NSObject <NSCoding, UIAppearance>
    

    退而求其次,我们知道UIBarButtonItem有一个属性

    @property(nullable, nonatomic,strong)  __kindof UIView     *customView;       // default is nil
    

    这说明我们可以使用UIButton来代替UIBarButtonItem,在UIButton上面添加想要的动画效果。

    
        static CGFloat const kButtonWidth = 43.0f;
        static CGFloat const kButtonHeight = 43.0f;
        
        UIImage *cartImage = [[UIImage imageNamed:@"iconfont-cart"]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
        
        UIButton *cartButton = [UIButton buttonWithType:UIButtonTypeCustom];
        cartButton.frame = CGRectMake(0.0f, 0.0f, kButtonWidth, kButtonHeight);
        cartButton.backgroundColor = [UIColor clearColor];
        [cartButton setImage:cartImage forState:UIControlStateNormal];
        [cartButton setImageEdgeInsets:UIEdgeInsetsMake(0.0f,(kButtonHeight- cartImage.size.width), 0.0f, 0.0f)];
        [cartButton addTarget:self action:@selector(changeStatus:) forControlEvents:UIControlEventTouchUpInside];
        [cartButton addSubview:self.numberLabel];
    
        UIBarButtonItem *rightBarButtonItem = [[UIBarButtonItem alloc]initWithCustomView:cartButton];
        self.navigationItem.rightBarButtonItem = rightBarButtonItem;
    

    创建Label使用懒加载:

    #pragma mark 购物车上面显示的按钮
    -(UILabel *)numberLabel
    {
        if (!_numberLabel) {
            
            static CGFloat const kNameLabelWidth = 14;
            static CGFloat const kNameLabelHeight = 14;
            static CGFloat const kNameLabelX = 40; // 父视图宽44,UI说改到这个位置
            static CGFloat const kNameLabelY = 6;
            
            _numberLabel = [UILabel new];
            _numberLabel.hidden = YES;
            _numberLabel.frame = CGRectMake(kNameLabelX, kNameLabelY, kNameLabelWidth, kNameLabelHeight);
            
            _numberLabel.backgroundColor = [UIColor redColor];
            _numberLabel.textColor = [UIColor whiteColor];
            _numberLabel.font = [UIFont systemFontOfSize:9];
            _numberLabel.textAlignment = NSTextAlignmentCenter;
            _numberLabel.layer.cornerRadius = kNameLabelHeight * 0.5;
            _numberLabel.layer.masksToBounds = YES;
            
        }
        return _numberLabel;
    }
    

    这里说下为什么设置为hidden,因为要求数量为0的时候不显示,数量不为0显示,如果删除后还要添加不如直接控制hidden。
    其他的就是设置Label显示的数字了,这里就不写了。

    相关文章

      网友评论

      本文标题:如何在UIBarButtonItem上显示数字(BadgeVal

      本文链接:https://www.haomeiwen.com/subject/oqnehttx.html