美文网首页
JSBadgeView 小红点的设置

JSBadgeView 小红点的设置

作者: 小神猫 | 来源:发表于2017-03-02 14:36 被阅读240次
    • 一般类似微信,QQ消息的右上角小红点大家都自己写吧 ,刚好项目上有用到,就看看没有优秀第三方的框架
    • 然后就发现这个了** " JSBadgeView "** ,废话不多少,直接cocoapods集成到项目中
    //Podfile添加框架和版本号
    pod 'JSBadgeView', '~> 1.4.1'
    
    • 然后终端打开 pod install --no-repo-update 就可以愉快的玩耍了
    右上角的数字
    #import <JSBadgeView.h>
    @interface HomeViewController ()
    @property (nonatomic, strong) JSBadgeView *badgeView;
    @property (nonatomic, strong) UIButton *consultButton;
    @end
    
    @implementation HomeViewController
    - (void)viewDidLoad {
       [self addView];
    }
    
    -(void)addView{
        _consultButton = ({
            UIButton *button = [UIButton buttonWithTopAndBottomTitle:MOXConsultRecord titleColor:MOXConsultRecordTextColor fontSize:MOXHomeButtonFont imageName:@"publish-text" selectedImageName:@"publish-text" target:self action:@selector(consultButtonClick:)];
            [self.topView addSubview:button];
            [button mas_makeConstraints:^(MASConstraintMaker *make) {
                make.centerY.equalTo(_topView).offset(-13);
                make.centerX.equalTo(_topView);
                make.width.height.equalTo(@50);
            }];
            
            button;
        });
        
        _badgeView = ({
            JSBadgeView *view = [[JSBadgeView alloc] initWithParentView:_consultButton alignment:JSBadgeViewAlignmentTopRight];
            view.badgeBackgroundColor = [UIColor redColor];   //setting color
            view.badgePositionAdjustment = CGPointMake(-20, 10); //这里可以自己调整小红点位置
            view.badgeOverlayColor = [UIColor clearColor]; //设置外圈颜色
            view.badgeText = @"13";                           //设置右上角的数字
            view.tag = IN_AREA_NEW_TASKS_TAG;  //设置tag
            view.badgeBackgroundColor = [UIColor redColor];  //设置背景色
            [view mas_makeConstraints:^(MASConstraintMaker *make) {
                make.width.equalTo(@10);
                make.height.equalTo(@10);
            }];
            
            view;
        });
    
          /*****设置右上角的数字****/  
          //1、用字符
          self.badgeView.badgeText = @"13";  
          //2、如果不显示就设置为空
          self.badgeView.badgeText = nil; 
    
        //这里有个小注意点,更新数字时,最好刷新一下
          [self.badgeView setNeedsLayout];
    }
    
    • 😔每个周末想出去逛逛,可是一到周末就宅在家两天不出门
    • 现在每天宁愿在公司加班都不愿意回家,爱好也越来越窄,二次元,电子产品依然是我的最爱,偶尔听听陈奕迅的歌
    • 突然发现大多数程序员也都是这样的爱好,哎,死宅一个

    相关文章

      网友评论

          本文标题:JSBadgeView 小红点的设置

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