探索flutter框架开发的app在移动应用市场的潜力与挑战
716
2022-10-25
iOS小技能: 按钮标题自动适配的中英文长度 & 动态控制子视图按钮的显示与隐藏 (Masonry版本)
前言
按钮标题自动适配的中英文长度
比如打印小票,或者提货,是使用同一个按钮,这个时候还要适配中英文。可以采用以下方式Masonry约束视图的宽度的最小值
动态控制子视图按钮的显示与隐藏
I、按钮标题的中英文长度适配适配(Masonry版本)
关键API make.width.mas_greaterThanOrEqualTo(kAdjustRatio(70));
3)); make.right.offset(kAdjustRatio(-3)); }];
整体代码
- (QCTStoreOrderButton *)receiptBtn{ if (!_receiptBtn) { _receiptBtn = [[QCTStoreOrderButton alloc]init]; [_receiptBtn setTitle:QCTLocal(@"store_order_printing_tickets") forState:UIControlStateNormal]; __weak __typeof__(self) weakSelf = self; [self addSubview:_receiptBtn]; [_receiptBtn mas_makeConstraints:^(MASConstraintMaker *make) {// make.size.mas_equalTo(CGSizeMake(kAdjustRatio(74), kAdjustRatio(28))); make.height.mas_equalTo(kAdjustRatio(25)); make.width.mas_greaterThanOrEqualTo(kAdjustRatio(70)); make.right.equalTo(weakSelf).offset(-kAdjustRatio(kSideMargin)); make.centerY.equalTo(weakSelf); }]; [_receiptBtn.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) { make.left.offset(kAdjustRatio(3)); make.right.offset(kAdjustRatio(-3)); }]; _receiptBtn.titleLabel.textAlignment = NSTextAlignmentCenter;// _receiptBtn rac } return
II、动态控制子视图按钮的显示与隐藏
需求: 动态控制子视图按钮的显示与隐藏
定义分配终端按钮属性
/** 分配终端按钮 */@property (strong, nonatomic) QCTStoreOrderButton *allocationBtn;- (QCTStoreOrderButton *)allocationBtn{ if (!_allocationBtn) { QCTStoreOrderButton *tmp = [[QCTStoreOrderButton alloc]init]; _allocationBtn = tmp; [tmp setTitle:QCTLocal(@"分配终端") forState:UIControlStateNormal]; __weak __typeof__(self) weakSelf = self; [self addSubview:tmp]; [tmp mas_makeConstraints:^(MASConstraintMaker *make) { make.height.mas_equalTo(kAdjustRatio(25)); make.width.mas_greaterThanOrEqualTo(kAdjustRatio(70)); make.right.equalTo(weakSelf).offset(-kAdjustRatio(kSideMargin)); make-.equalTo(weakSelf.quantityAllottedLab.mas_bottom).offset(kAdjustRatio(6)); make.bottom.equalTo(weakSelf).offset(-kAdjustRatio(13)); // make.size.mas_equalTo(CGSizeMake(kAdjustRatio(74), kAdjustRatio(28))); }]; [tmp.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) { make.left.offset(kAdjustRatio(3)); make.right.offset(kAdjustRatio(-3)); }]; tmp.titleLabel.textAlignment = NSTextAlignmentCenter; } return
根据模型的上下级类型控制视图的高度的约束,进而控制视图地显示与隐藏
weak __typeof__(self) weakSelf = self; [self.allocationBtn mas_updateConstraints:^(MASConstraintMaker *make) { if(!models.isLowerOrder){// "isLowerOrder" : "false", 本级 make-.equalTo(weakSelf.quantityAllottedLab.mas_bottom).offset(kAdjustRatio(0)); make.height.mas_equalTo(kAdjustRatio(0)); }else{// 下级 make-.equalTo(weakSelf.quantityAllottedLab.mas_bottom).offset(kAdjustRatio(6)); make.height.mas_equalTo(kAdjustRatio(30)); } }];
III 按钮标题换行处理
3.1 按钮标题换行
案例:角色权限选择
UIButton* tmp = [[UIButton alloc]init]; tmp.titleLabel.numberOfLines = 2; __weak __typeof__(self) weakSelf = self; [tmp mas_makeConstraints:^(MASConstraintMaker *make) { make-.equalTo(weakSelf).offset(kAdjustRatio(16)); make.left.offset(0); make.right.lessThanOrEqualTo(weakSelf).offset(-10); make.bottom.offset(kAdjustRatio(-0)); }]; [tmp.imageView mas_makeConstraints:^(MASConstraintMaker *make) { make.left.offset(kAdjustRatio(0)); make.centerY.offset(0); }];
控制按钮是否可响应事件,推荐使用userInteractionEnabled属性。因为enabled属性会影响按钮的selected状态失效。
self.rememberBtn.userInteractionEnabled = model.enabled;
更改按钮选中状态:
UIControlEventTouchUpInside]subscribeNext:^( UIButton
3.2 解决Label文字左右参差不齐的问题
使用富文本排版setAttributedTitle替换方法setTitle:使用NSTextAlignmentJustified 对齐方式
3.3 设置按钮的文字和图片间距
mage是默认居左的,右边是相对于title的。
UIEdgeInsetsMake(0, 0,0,space);
CGFloat labelWidth = _titleBtn.titleLabel.intrinsicContentSize.width; //注意不能直接使用titleLabel.frame.size.width,原因为有时候获取到0值 CGFloat imageWidth = _titleBtn.imageView.frame.size.width; CGFloat space = 3.f; //定义两个元素交换后的间距 _titleBtn.titleEdgeInsets = UIEdgeInsetsMake(0, - imageWidth - space,0,imageWidth + space); _titleBtn.imageEdgeInsets = UIEdgeInsetsMake(0, labelWidth + space, 0, -labelWidth - space);
IV 附:以上两个例子的自定义按钮
自定义按钮
#import "QCTStoreOrderButton.h"@implementation QCTStoreOrderButton- (void)layoutSubviews{ [super layoutSubviews]; [self layoutIfNeeded]; self.layer.cornerRadius = self.height*0.5;// [self.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {// // make-.offset(kAdjustRatio(4));// make.left.offset(kAdjustRatio(4));// make.right.offset(kAdjustRatio(-6));// make.bottom.offset(kAdjustRatio(-6));//// // }];}- (void)setHighlighted:(BOOL)highlighted{ [super setHighlighted:highlighted]; return ; UIButton *_receiptBtn = self; if (highlighted) { _receiptBtn.layer.borderColor = ktabSelectedTextColor.CGColor; _receiptBtn.layer.borderWidth = 1; }else{ _receiptBtn.layer.borderColor = rgb(231,231,231).CGColor; _receiptBtn.layer.borderWidth = 1; }}- (instancetype)init{ self = [super init]; if (self) { UIButton *_cancelBtn = self;// rgb(231,231,231) _cancelBtn.layer.borderColor = BASE_RED_COLOR.CGColor; _cancelBtn.layer.borderWidth = 0.5; _cancelBtn.clipsToBounds = YES; _cancelBtn.titleLabel.font = kPingFangFont(11);// rgb(51,51,51) [_cancelBtn setTitleColor:BASE_RED_COLOR forState:UIControlStateNormal]; [_cancelBtn setTitleColor:ktabSelectedTextColor forState:UIControlStateHighlighted]; } return self;}@end
版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。
发表评论
暂时没有评论,来抢沙发吧~