这是一个封装好的类TagListView,

1. 只需要调用两个方法 设置宽度,间距,边距 并赋给它需要显示的字符串数组;

2. 遵循tagListView的协议, 并实现返回buttonView的方法.

即可展现.

这里我用了SDAutoLayout, 一个三方布局, 用cocopod安装一下就好;

一下是具体的实现代码 带 注释解释

//  TagListView.h 该类的.h文件

#import <UIKit/UIKit.h>
@protocol TagListViewDelegate<NSObject>
@required
- (UIButton *)setItemBtnView; //必须实现方法:返回buttonView
@optional
- (void)clickWithBtn:(UIButton *)btn idx:(NSInteger)idx; //点击button触发方法
@end typedef void(^ReturnClickBtnArr)(NSArray *btnArr); // 返回已选中的按钮数组 @interface TagListView : UIView @property(nonatomic, strong) UIButton *itemBtn;
@property(nonatomic, assign) NSUInteger maxSelectedTags; // 多选值
@property(nonatomic, strong) NSMutableArray *selectedTitles; //已选中的按钮标题数组
@property(nonatomic, weak) id <TagListViewDelegate> delegate; #pragma mark - 设置宽度 间距 边距
- (void)setWid:(CGFloat)wid btnTitlePadding_X:(CGFloat)horizontailX btnTitlePadding_Y:(CGFloat)vertailY marginX:(CGFloat)marginX marginY:(CGFloat)marginY itemHeight:(CGFloat)height; #pragma mark - 设置字符串数组 (该方法必须在setWid...方法后执行)
- (void)setTagViewWithTitles:(NSArray *)titleArr; - (NSArray *)getAllSubBtns;
@end
//  TagListView.m 该类的.m文件

#import "TagListView.h"
#import "UIView+SDAutoLayout.h"
#define kHorizontalX 7
#define kVerticalY 3
#define kMarginY 10
#define kMarginX 10 @implementation TagListView {
CGFloat _horizontailX; // btn的左右间距
CGFloat _vertailY; // btn的上下间距
CGFloat _marginX; // tagView的左右边距
CGFloat _marginY; // tagVIew的上下边距
CGFloat _wid; // tagView的宽度
CGFloat _itemHeight; // btn的高度
NSArray *_titleArray; // 需要展示的字符串数组
} - (instancetype)init {
if (self = [super init]) {
_horizontailX = kHorizontalX;
_vertailY = kVerticalY;
_marginX = kMarginY;
_marginY = kMarginX;
_wid = ;
_maxSelectedTags = ; //default
_selectedTitles = [NSMutableArray array];
}
return self;
} #pragma mark - 设置宽度 间距 边距
- (void)setWid:(CGFloat)wid btnTitlePadding_X:(CGFloat)horizontailX btnTitlePadding_Y:(CGFloat)vertailY marginX:(CGFloat)marginX marginY:(CGFloat)marginY itemHeight:(CGFloat)height {
if (wid) {
_wid = wid;
}
if (horizontailX) {
_horizontailX = horizontailX;
}
if (vertailY) {
_vertailY = vertailY;
}
if (marginX) {
_marginX = marginX;
}
if (marginY) {
_marginY = marginY;
}
if (height) {
_itemHeight = height;
}
} #pragma mark - 设置字符串数组 (该方法必须在setWid...方法后执行)
- (void)setTagViewWithTitles:(NSArray *)titleArr {
_titleArray = [titleArr copy]; // 清除所有子视图
while (self.subviews.count) {
UIView *child = self.subviews.lastObject;
[child removeFromSuperview];
} // 若未指定宽度 就 获得当前视图宽度
if (_wid == ) {
[self updateLayout];
_wid = self.width;
} __block int totalHeight = ;
__block CGRect previousFrame = CGRectMake(, , , );
__block CGFloat height = ; // 循环title数组
[titleArr enumerateObjectsUsingBlock:^(NSString *title, NSUInteger idx, BOOL * _Nonnull stop) {
UIButton *tag = [self.delegate setItemBtnView];
[tag setTitle:title forState:UIControlStateNormal];
[tag addTarget:self action:@selector(onClick:) forControlEvents:UIControlEventTouchUpInside];
tag.tag = idx; // 设置已选中title的选中状态
if ([self.selectedTitles containsObject:title]) {
tag.selected = YES;
} else {
tag.selected = NO;
} // 1. 计算size
// 获得title字体对应的size
NSDictionary *attrs = @{NSFontAttributeName : tag.titleLabel.font};
CGSize Size_str = [title sizeWithAttributes:attrs]; // 给size加上 上下边距
Size_str.width += _horizontailX * ;
if (_itemHeight) {
Size_str.height = _itemHeight;
} else {
Size_str.height += _vertailY * ;
} CGRect newRect = CGRectZero;
newRect.size = Size_str;
// 2. 计算origin
if (CGRectGetMaxX(previousFrame) + Size_str.width + _marginX > _wid) { //换行
newRect.origin = CGPointMake(, CGRectGetMaxY(previousFrame) + _marginY);
totalHeight += Size_str.height + _marginY;
} else { //未换行
newRect.origin = CGPointMake((CGRectGetMaxX(previousFrame) == ? : CGRectGetMaxX(previousFrame) + _marginX), previousFrame.origin.y);
}
[tag setFrame:newRect]; previousFrame = tag.frame;
height = totalHeight + Size_str.height; [self addSubview:tag];
}]; self.sd_layout.heightIs(height);
} - (NSArray *)getAllSubBtns {
return self.subviews;
} #pragma mark - btn的点击方法
- (void)onClick:(UIButton *)btn {
// 1.如果超出最多选中数 则需把最先选中的删除
if (!btn.selected && self.selectedTitles.count >= _maxSelectedTags){
NSString *title = [self.selectedTitles objectAtIndex:];
NSUInteger firstSelectedIndex = [_titleArray indexOfObject:title];
if (firstSelectedIndex != NSNotFound) {
UIButton *selectedButton = [self.subviews objectAtIndex:firstSelectedIndex];
selectedButton.selected = NO;
[self.selectedTitles removeObjectAtIndex:];
}
}
long index = btn.tag;
NSString *title = [_titleArray objectAtIndex:index];
if (btn.selected) { // 设置为未选中状态
btn.selected = NO;
[self.selectedTitles removeObject:title];
} else { // 设置为选中状态
btn.selected = YES;
[self.selectedTitles addObject:title];
}
// 若delegate包含该方法 则让其执行
if ([self.delegate respondsToSelector:@selector(clickWithBtn:idx:)]) {
[self.delegate clickWithBtn:btn idx:index];
}
}
@end

具体使用如下:

//  ViewController.m

#import "ViewController.h"
#import "UIView+SDAutoLayout.h"
#import "TagListView.h" #define kScreenWidth self.view.frame.size.width @interface ViewController ()<TagListViewDelegate>
@property (nonatomic, strong)TagListView *tagListView;
@end @implementation ViewController - (void)viewDidLoad {
[super viewDidLoad]; self.tagListView = [[TagListView alloc] init];
self.tagListView.delegate = self;
self.tagListView.backgroundColor = [UIColor cyanColor];
self.tagListView.maxSelectedTags = ;
[self.view addSubview:self.tagListView];
self.tagListView.sd_layout.topSpaceToView(self.view, ).leftSpaceToView(self.view, ).rightSpaceToView(self.view, );
// 设置宽度 间距 边距
[self.tagListView setWid:(kScreenWidth - ) btnTitlePadding_X: btnTitlePadding_Y: marginX: marginY: itemHeight:];
// 设置需要显示的字符串数组
[self.tagListView setTagViewWithTitles:@[@"周一", @"周二", @"周三", @"周四", @"周五", @"礼拜六", @"礼拜天", @"一月", @"二月", @"三月", @"四月", @"五月", @"六月", @"七月", @"八月", @"九月", @"十月", @"十一月", @"十二月", @"春天", @"夏天", @"秋天", @"冬天", @"张三", @"李四", @"王五"]];
} #pragma mark - TagListViewDelegate
// 必须实现的协议方法 返回buttonView
- (UIButton *)setItemBtnView {
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
[btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
[btn setTitleColor:[UIColor redColor] forState:UIControlStateSelected];
btn.layer.borderWidth = 0.4;
btn.layer.cornerRadius = ;
btn.layer.borderColor = [UIColor grayColor].CGColor;
return btn;
} @end

button自适应宽度 并根据屏幕宽自动换行排列的更多相关文章

  1. 【笔记】css 实现宽度自适应屏幕 高度自适应宽度

    如果说宽高自适应屏幕尺寸那么大家可能会想到 div{ width: 100%; height: 100% } 但是如果我要自适应屏幕尺寸的同时还要变成正方形呢?(高度和宽度相等而高度不能写死) 那就要 ...

  2. 解决Button在IE6、7下的自适应宽度问题

    很早就遇到过这么个小问题,但由于其并未影响到实际作用和美观就没有正面解决它,现在,我们来试着解决它. 写一个Button,有两种方式:其一,直接button标签:其二,input type=”butt ...

  3. 从三栏自适应宽度布局到css布局的讨论

    如何实现一个三栏自适应布局,左右各100px,中间随着浏览器宽度自适应? 第一个想到的是使用table布局,设置table的宽度为100%,三个td,第1个和第3个固定宽度为100px,那么中间那个就 ...

  4. [Winform]DataGridView列自适应宽度

    引言 在做winform项目中,数据控件DataGridView的使用多多少少是会用到的,如果不设置它的属性,默认情况下是不会自适应宽度的,你想查看某项的数据,就不得不将标题栏拖来拖去,挺烦的. 方法 ...

  5. android屏幕适配的全攻略3-动态获取手机屏幕宽高及动态设置控件宽高

    1.获取手机屏幕宽高: DisplayMetrics dm = new DisplayMetrics(); getWindowManager().getDefaultDisplay().getMetr ...

  6. UEditor百度富文本编辑器--让编辑器自适应宽度的解决方案

    UEditor百度富文本编辑器的initialFrameWidth属性,默认值是1000. 不能够自适应屏幕宽度.如图1: 刚开始的时候,我是直接设置initialFrameWidth=null的.效 ...

  7. JS 获取浏览器和屏幕宽高等信息代码

    JS 获取浏览器和屏幕宽高等信息. 网页可见区域宽:document.body.clientWidth  网页可见区域高:document.body.clientHeight  网页可见区域宽:doc ...

  8. 漂亮的自适应宽度的多色彩CSS图片按钮

    一.素材               二.效果 三.CSS *{padding:0;margin:0} /*----------------------------------- 自适应宽度图片按钮 ...

  9. Android编程心得-在任意类中获取当前屏幕宽高

    进行Android编程时,很多时候都需要获取当前屏幕的宽度与高度,但是当我们需要在别的类中调用屏幕宽高时,直接用原来的方法是不行的,下面我来介绍如何在任意类中调用宽度高度的两种方法. public v ...

随机推荐

  1. Mac OS X上编写 ASP.NET vNext(一)KRE环境搭建

    最新的asp.net vnext已经可以支持在mac上运行了,当然用的是mono.相比linux来说,mac的安装略显繁琐.对于大部分用Windows开发asp.net的程序员来说,初次配置还是很费时 ...

  2. Nova PhoneGap框架 第十章 开发环境

    10.1 Visual Studio + ReSharper PhoneGap程序由HTML.CSS和JS编写而成,这3种语言的编写你都可以用记事本来完成,但显然效率比较低,出错的概率也比较大.一个强 ...

  3. JavaScript继承的模拟实现

    我们都知道,在JavaScript中只能模拟实现OO中的"类",也就意味着,在JavaScript中没有类的继承.我们也只能通过在原对象里添加或改写属性来模拟实现. 先定义一个父类 ...

  4. HTML5 & CSS3初学者指南(1) – 编写第一行代码

    介绍 网络时代已经到来.现在对人们来说,每天上网冲浪已经成为一种最为常见的行为. 在网页浏览器中输入一段文本地址,就像http://www.codeproject.com,等待一下,网页就加载到浏览器 ...

  5. php修改

    做出一张表,点击登录后进入此表   然后多建立一个<td></td>用来增加一列操作 <h1>英雄联盟英雄表</h1> <table width= ...

  6. Enterprise Solution 企业资源计划管理软件 C/S架构,支持64位系统,企业全面应用集成,制造业信息化

    Enterprise Solution是一套完整的企业资源计划系统,功能符合众多制造业客户要求.系统以.NET Framework技术作为开发架构,完善的功能可有效地帮助企业进行运营策划,减低成本,如 ...

  7. 【Win 10应用开发】使用RichEditBox控件应注意的问题

    RichEditBox控件支持对多格式文本进行编辑,一般的文本输入控件可以使用TextBox,不过,如果希望编辑格式较为复杂的文本,就可以考虚使用RichEditBox控件. RichEditBox控 ...

  8. ASP.NET MVC5+EF6+EasyUI 后台管理系统(58)-DAL层重构

    系列目录 前言:这是对本文系统一次重要的革新,很久就想要重构数据访问层了,数据访问层重复代码太多.主要集中增删该查每个模块都有,所以本次是为封装相同接口方法 如果你想了解怎么重构普通的接口DAL层请查 ...

  9. 基于 getter 和 setter 撸一个简易的MVVM

    Angular 和 Vue 在对Angular的学习中,了解到AngularJS 的两个主要缺点: 对于每一次界面时间,Ajax 或者 timeout,都会进行一个脏检查,而每一次脏检查又会在内部循环 ...

  10. jvm系列(二):JVM内存结构

    JVM内存结构 所有的Java开发人员可能会遇到这样的困惑?我该为堆内存设置多大空间呢?OutOfMemoryError的异常到底涉及到运行时数据的哪块区域?该怎么解决呢?其实如果你经常解决服务器性能 ...