iOS實現(xiàn)動態(tài)自適應(yīng)標簽
本文實例為大家分享了iOS實現(xiàn)動態(tài)自適應(yīng)標簽的具體代碼,供大家參考,具體內(nèi)容如下
先上效果圖

設(shè)計要求
1、標簽的寬度是按內(nèi)容自適應(yīng)的
2、一行顯示的標簽個數(shù)是動態(tài)的,放得下就放,放不下就換行
3、默認選中第一個
4、至少選中一個標簽
實現(xiàn)思路
首先我們從這個效果上來看,這個標簽是有選中和不選中狀態(tài),那我們首選的控件肯定就是用 UIButton來實現(xiàn)了。
這個小程度的重點就在于標簽?zāi)茏詣訐Q行,還是智能的,不是固定一行多少個那種,這個我們通過計算每個按鈕實際寬度與屏幕的寬度進行比較就能判斷是否需要換行了。
還有一點就是處理 至少選中一個標簽的功能,我這里有一種方式,就是控制按鈕的 userInteractionEnabled 屬性來實現(xiàn),如果只有一個按鈕的時候就把那一個按鈕的這個屬性給設(shè)置成 NO,這樣就禁止用戶對它進行點擊事件了,這個時候其它按鈕是可以正常選中的,只要選中的按鈕大于1個,那就把剛才那個按鈕屬性再改成YES,這樣那個按鈕就又能點了。
具體看代碼
創(chuàng)建一個繼承于UIView的 XGTagView類
// // XGTagView.h // 動態(tài)標簽 // // Created by xgao on 17/3/22. // Copyright © 2017年 xgao. All rights reserved. // #import <UIKit/UIKit.h> @interface XGTagView : UIView /** * 初始化 * * @param frame frame * @param tagArray 標簽數(shù)組 * * @return */ - (instancetype)initWithFrame:(CGRect)frame tagArray:(NSMutableArray*)tagArray; // 標簽數(shù)組 @property (nonatomic,retain) NSArray* tagArray; // 選中標簽文字顏色 @property (nonatomic,retain) UIColor* textColorSelected; // 默認標簽文字顏色 @property (nonatomic,retain) UIColor* textColorNormal; // 選中標簽背景顏色 @property (nonatomic,retain) UIColor* backgroundColorSelected; // 默認標簽背景顏色 @property (nonatomic,retain) UIColor* backgroundColorNormal; @end
//
// XGTagView.m
// 動態(tài)標簽
//
// Created by xgao on 17/3/22.
// Copyright © 2017年 xgao. All rights reserved.
//
#import "XGTagView.h"
@interface XGTagView()
@end
@implementation XGTagView
/**
* 初始化
*
* @param frame frame
* @param tagArray 標簽數(shù)組
*
* @return
*/
- (instancetype)initWithFrame:(CGRect)frame tagArray:(NSArray*)tagArray{
self = [super initWithFrame:frame];
if (self) {
_tagArray = tagArray;
[self setUp];
}
return self;
}
// 初始化
- (void)setUp{
// 默認顏色
_textColorNormal = [UIColor darkGrayColor];
_textColorSelected = [UIColor whiteColor];
_backgroundColorSelected = [UIColor redColor];
_backgroundColorNormal = [UIColor whiteColor];
// 創(chuàng)建標簽按鈕
[self createTagButton];
}
// 重寫set屬性
- (void)setTagArray:(NSMutableArray *)tagArray{
_tagArray = tagArray;
// 重新創(chuàng)建標簽
[self resetTagButton];
}
- (void)setTextColorSelected:(UIColor *)textColorSelected{
_textColorSelected = textColorSelected;
// 重新創(chuàng)建標簽
[self resetTagButton];
}
- (void)setTextColorNormal:(UIColor *)textColorNormal{
_textColorNormal = textColorNormal;
// 重新創(chuàng)建標簽
[self resetTagButton];
}
- (void)setBackgroundColorSelected:(UIColor *)backgroundColorSelected{
_backgroundColorSelected = backgroundColorSelected;
// 重新創(chuàng)建標簽
[self resetTagButton];
}
- (void)setBackgroundColorNormal:(UIColor *)backgroundColorNormal{
_backgroundColorNormal = backgroundColorNormal;
// 重新創(chuàng)建標簽
[self resetTagButton];
}
#pragma mark - Private
// 重新創(chuàng)建標簽
- (void)resetTagButton{
// 移除之前的標簽
for (UIButton* btn in self.subviews) {
[btn removeFromSuperview];
}
// 重新創(chuàng)建標簽
[self createTagButton];
}
// 創(chuàng)建標簽按鈕
- (void)createTagButton{
// 按鈕高度
CGFloat btnH = 28;
// 距離左邊距
CGFloat leftX = 6;
// 距離上邊距
CGFloat topY = 10;
// 按鈕左右間隙
CGFloat marginX = 10;
// 按鈕上下間隙
CGFloat marginY = 10;
// 文字左右間隙
CGFloat fontMargin = 10;
for (int i = 0; i < _tagArray.count; i++) {
UIButton* btn = [UIButton buttonWithType:UIButtonTypeCustom];
btn.frame = CGRectMake(marginX + leftX, topY, 100, btnH);
btn.tag = 100+i;
// 默認選中第一個
if (i == 0) {
btn.selected = YES;
}
// 按鈕文字
[btn setTitle:_tagArray[i] forState:UIControlStateNormal];
//------ 默認樣式
//按鈕文字默認樣式
NSMutableAttributedString* btnDefaultAttr = [[NSMutableAttributedString alloc]initWithString:btn.titleLabel.text];
// 文字大小
[btnDefaultAttr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:13] range:NSMakeRange(0, btn.titleLabel.text.length)];
// 默認顏色
[btnDefaultAttr addAttribute:NSForegroundColorAttributeName value:self.textColorNormal range:NSMakeRange(0, btn.titleLabel.text.length)];
[btn setAttributedTitle:btnDefaultAttr forState:UIControlStateNormal];
// 默認背景顏色
[btn setBackgroundImage:[self imageWithColor:self.backgroundColorNormal] forState:UIControlStateNormal];
//----- 選中樣式
// 選中字體顏色
NSMutableAttributedString* btnSelectedAttr = [[NSMutableAttributedString alloc]initWithString:btn.titleLabel.text];
// 選中顏色
[btnSelectedAttr addAttribute:NSForegroundColorAttributeName value:self.textColorSelected range:NSMakeRange(0, btn.titleLabel.text.length)];
// 選中文字大小
[btnSelectedAttr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:13] range:NSMakeRange(0, btn.titleLabel.text.length)];
[btn setAttributedTitle:btnSelectedAttr forState:UIControlStateSelected];
// 選中背景顏色
[btn setBackgroundImage:[self imageWithColor:self.backgroundColorSelected] forState:UIControlStateSelected];
// 圓角
btn.layer.cornerRadius = btn.frame.size.height / 2.f;
btn.layer.masksToBounds = YES;
// 邊框
btn.layer.borderColor = [UIColor lightGrayColor].CGColor;
btn.layer.borderWidth = 0.5;
// 設(shè)置按鈕的邊距、間隙
[self setTagButtonMargin:btn fontMargin:fontMargin];
// 處理換行
if (btn.frame.origin.x + btn.frame.size.width + marginX > self.frame.size.width) {
// 換行
topY += btnH + marginY;
// 重置
leftX = 6;
btn.frame = CGRectMake(marginX + leftX, topY, 100, btnH);
// 設(shè)置按鈕的邊距、間隙
[self setTagButtonMargin:btn fontMargin:fontMargin];
}
// 重置高度
CGRect frame = btn.frame;
frame.size.height = btnH;
btn.frame = frame;
//----- 選中事件
[btn addTarget:self action:@selector(selectdButton:) forControlEvents:UIControlEventTouchUpInside];
[self addSubview:btn];
leftX += btn.frame.size.width + marginX;
}
// 檢測按鈕狀態(tài),最少選中一個
[self checkButtonState];
}
// 設(shè)置按鈕的邊距、間隙
- (void)setTagButtonMargin:(UIButton*)btn fontMargin:(CGFloat)fontMargin{
// 按鈕自適應(yīng)
[btn sizeToFit];
// 重新計算按鈕文字左右間隙
CGRect frame = btn.frame;
frame.size.width += fontMargin*2;
btn.frame = frame;
}
// 檢測按鈕狀態(tài),最少選中一個
- (void)checkButtonState{
int selectCount = 0;
UIButton* selectedBtn = nil;
for(int i=0;i < _tagArray.count; i++){
UIButton* btn = (UIButton*)[self viewWithTag:100+i];
if(btn.selected){
selectCount++;
selectedBtn = btn;
}
}
if (selectCount == 1) {
// 只有一個就把這一個給禁用手勢
selectedBtn.userInteractionEnabled = NO;
}else{
// 解除禁用手勢
for(int i=0;i < _tagArray.count; i++){
UIButton* btn = (UIButton*)[self viewWithTag:100+i];
if(!btn.userInteractionEnabled){
btn.userInteractionEnabled = YES;
}
}
}
}
// 根據(jù)顏色生成UIImage
- (UIImage*)imageWithColor:(UIColor*)color{
CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);
// 開始畫圖的上下文
UIGraphicsBeginImageContext(rect.size);
// 設(shè)置背景顏色
[color set];
// 設(shè)置填充區(qū)域
UIRectFill(CGRectMake(0, 0, rect.size.width, rect.size.height));
// 返回UIImage
UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
// 結(jié)束上下文
UIGraphicsEndImageContext();
return image;
}
#pragma mark - Event
// 標簽按鈕點擊事件
- (void)selectdButton:(UIButton*)btn{
btn.selected = !btn.selected;
// 檢測按鈕狀態(tài),最少選中一個
[self checkButtonState];
}
@end
好了,大家如果有什么地方看不明白的,留言給我就行。
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
iOS 中Swift仿微信添加提示小紅點功能(無數(shù)字)
這篇文章主要介紹了iOS 中Swift仿微信添加提示小紅點功能(無數(shù)字),非常不錯,具有參考借鑒價值,需要的朋友可以參考下2017-05-05
iOS ScrollView實現(xiàn)自動布局的方法(適用Swift 3.0 )
iOS11 WKWebView 無法加載內(nèi)容的解決方法

