持续创作,加快成长!这是我参加「日新计划 6 月更文挑战」的第25天,点击查看活动详情

前言

  1. iOS Masonry以动画的方式更新束缚

使用场景:挑选视图的显现与隐藏的时分带上动画来提升用户体验

  1. 使用dividedBy进行九宫格布局
  2. Masonry束缚宽高比的例子demo
  3. 设置束缚的优先级: 常用于复杂交互视图的束缚

I Masonry以动画的方式更新束缚

在改动完束缚后,在动画块内,使用办法layoutIfNeeded,能够完成一般一般的动画作用

1.1 完成方式

  1. 在改动完束缚后,在动画块内,使用办法layoutIfNeeded,能够完成一般一般的动画作用。

iOS小技能:以动画的形式更新Masonry约束、宽高比约束、约束优先级、九宫格布局

  1. Facebok的动画结构pop

github.com/facebookarc… Facebook Pop其实是基于CADisplayLink(Mac平台上使用的CVDisplayLink)完成的独立于Core Animation之外的动画计划

1.2 完成代码

- (void)setupProductCategoryTreeFilterViewHidden:(BOOL)hidden{
    float hiddenTime = 0.5;
    WS(weakSelf);
               if (hidden) {// 隐藏的时分需求dispatch_after hiddenTime,才有动画作用
                   dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(hiddenTime * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
                       [weakSelf.ProductCategoryTreeFilterView setHidden:hidden];
                   });
                   [self.ProductCategoryTreeFilterView mas_updateConstraints:^(MASConstraintMaker *make) {
                       make.left.equalTo(weakSelf).offset(kAdjustRatio(SCREENW));
                       make.right.equalTo(weakSelf).offset(kAdjustRatio(SCREENW));
                   }];
               }else{//显现的时分直接设置hidden 即可
                   [weakSelf.ProductCategoryTreeFilterView setHidden:hidden];
                   [self.ProductCategoryTreeFilterView mas_updateConstraints:^(MASConstraintMaker *make) {
                       make.left.equalTo(weakSelf).offset(kAdjustRatio(50));
                       make.right.equalTo(weakSelf).offset(kAdjustRatio(0));
                   }];
               }
//Masonry的以动画的方式更新束缚
    [self setNeedsUpdateConstraints];//  // 告知self束缚需求更新
    [self updateConstraintsIfNeeded];//  // 调用此办法告知self检测是否需求更新束缚,若需求则更新,下面增加动画作用才起作用
    [UIView animateWithDuration:hiddenTime animations:^{
        [self layoutIfNeeded];// gengxin frame
    }];
}
  • 核心代码
        if (hidden) {// 隐藏
            [self.ProductCategoryTreeFilterView mas_updateConstraints:^(MASConstraintMaker *make) {
                make.left.equalTo(weakSelf).offset(kAdjustRatio(SCREENW));
                make.right.equalTo(weakSelf).offset(kAdjustRatio(SCREENW));
            }];
        }else{//显现
            [self.ProductCategoryTreeFilterView mas_updateConstraints:^(MASConstraintMaker *make) {
                make.left.equalTo(weakSelf).offset(kAdjustRatio(50));
                make.right.equalTo(weakSelf).offset(kAdjustRatio(0));
            }];
        }
//Masonry的以动画的方式更新束缚
    [self setNeedsUpdateConstraints];//  // 告知self束缚需求更新
    [self updateConstraintsIfNeeded];//  // 调用此办法告知self检测是否需求更新束缚,若需求则更新,下面增加动画作用才起作用
    [UIView animateWithDuration:hiddenTime animations:^{
        [self layoutIfNeeded];// gengxin frame
    }];

II 使用dividedBy完成九宫格布局

  • Masonry份额用法demo
/**
 Masonry份额用法
 */
- (void)setModel:(QCTtodoContentTableViewCellModel *)model{
    _model = model;
    // 构建子试图
    QCTsubStatusBtnView * lasttmp;
    NSInteger col = 4;// 总列数
    for (int i = 0; i<col; model.models) {
        QCTtodoStatusInfoModel *obj = model.models[i];
        QCTsubStatusBtnView * tmp = [QCTsubStatusBtnView new];
        tmp.model = obj;
        [self addSubview:tmp];
        __weak __typeof__(self) weakSelf = self;
        [tmp mas_makeConstraints:^(MASConstraintMaker *make) {
            make.centerY.equalTo(weakSelf);
            make.width.equalTo(weakSelf).dividedBy(col);
//            make.left.equalTo(tmp.mas_width).multipliedBy(i);
            if (i%col == 0) {
                make.left.equalTo(weakSelf);
            }else{
                make.left.equalTo(lasttmp.mas_right);
            }
//            make.centerX.equalTo(tmp.mas_width).multipliedBy(i*2+1);
            make.bottom.equalTo(weakSelf);
            make.top.equalTo(weakSelf);
        }];
        lasttmp = tmp;
        i++;
    }
}

III 进行视图宽高比束缚

    [self.kuangImgView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(weakSelf.tishiLabel.mas_bottom).offset(kAdjustRatio(0));        
        make.left.right.offset((0));
//multipliedBy
        //dividedBy
        //设置高/宽为388:375.0
     make.height.equalTo(weakSelf.view.mas_width).multipliedBy(388/375.0);
    }];

kunnan.blog.csdn.net/article/det…

iOS13扫描证件&银行卡信息辨认;身份证辨认 (正反) ;矩形边缘辨认 ;自定义证件相机 (含demo源码)

iOS小技能:以动画的形式更新Masonry约束、宽高比约束、约束优先级、九宫格布局

IV 设置束缚的优先级

需求: 设备描绘最多展现三行,如果超越三行显现下拉icon。

iOS小技能:以动画的形式更新Masonry约束、宽高比约束、约束优先级、九宫格布局

例子: 设置购买按钮的地步束缚优先级最高,来完成动态控制cell的高度。

iOS小技能:以动画的形式更新Masonry约束、宽高比约束、约束优先级、九宫格布局

        [tmpView mas_makeConstraints:^(MASConstraintMaker *make) {
            make.right.equalTo(weakSelf).offset(kAdjustRatio(-kSideMargin));
            make.top.greaterThanOrEqualTo(weakSelf.skuLab.mas_bottom).offset(kAdjustRatio(6));
                        make.bottom.lessThanOrEqualTo(weakSelf).offset(kAdjustRatio(-20)).priorityHigh();
        }];

iOS小技能:以动画的形式更新Masonry约束、宽高比约束、约束优先级、九宫格布局

see also

iOS设置tableView的点击事情优先级,低于cell的选中事情【场景:比方挑选视图,监听蒙版的点击事情就隐藏挑选视图】

blog.csdn.net/z929118967/…