OC 简单的实现一个可以多选、单选的标签视图

本文介绍了如何在Objective-C中利用TagsView组件实现多选和单选功能,包括使用方法和最终展示效果。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.使用TagsView来实现这一功能:

#import <UIKit/UIKit.h>
@class TagsView;
@protocol TagsViewDelegate <NSObject>
@optional
- (void)tagsView:(TagsView *)view didSelectedTags:(NSArray *)tags;
@end

@interface TagsView : UIView
/**传入标签的名称*/
- (instancetype)initWithFrame:(CGRect)frame tagsArray:(NSArray *)tags;
/**能否多选*/
@property (nonatomic, assign)BOOL canMultipleSelection;
/**代理*/
@property (nonatomic, weak)id<TagsViewDelegate>delegate;
@end

@interface TagBtn : UIButton
+ (TagBtn*)tagBtnWithTagTitle:(NSString *)title;
@end
#import "TagsView.h"
#define Normal_Text_Color [UIColor blackColor]//标签正常下文字颜色
#define Selected_Text_Color [UIColor whiteColor]//标签被选中文字
#define Normal_Background_Color [UIColor whiteColor]//标签未点击背景颜色
#define Selected_Background_Color [UIColor redColor]//标签点击背景颜色
#define Title_Font [UIFont systemFontOfSize:15]//标签的字体大小
#define Btn_Height 40.f//标签按钮的高度
#define KBtn_Space_H 10.f //按钮左右间距
#define KBtn_Space_V 10.f //按钮上下间距

@interface TagsView()
/**标签数组*/
@property (nonatomic, strong)NSArray *tags;
/**已经选中的标签*/
@property (nonatomic, strong)NSMutableArray *selectedTags;
@end
@implementation TagsView
- (instancetype)initWithFrame:(CGRect)frame tagsArray:(NSArray *)tags {
    if ([super initWithFrame:frame]) {
        _tags = tags;
        [self setupView];
        
    }
    return self;
}
- (NSMutableArray *)selectedTags {
    if (!_selectedTags) {
        _selectedTags = [NSMutableArray array];
    }
    return _selectedTags;
}
- (void)setupView {
    //布局过程中当前按钮X
    CGFloat lastMaxX = KBtn_Space_H;
    //布局过程中当前按钮Y
    CGFloat lastMaxY = KBtn_Space_V;
    for (int i = 0; i < self.tags.count; i++) {
        TagBtn *btn = [TagBtn tagBtnWithTagTitle:self.tags[i]];
        btn.tag = i;
        [btn addTarget:self action:@selector(clickTag:) forControlEvents:UIControlEventTouchUpInside];
        if (btn.width + lastMaxX + KBtn_Space_H > self.frame.size.width) {
            //如果这个按钮的宽度过大,两种情况一种是这一行只有这一个按钮,它就是太长 ,另一种是还有别的按钮,要换行
            if (lastMaxX == KBtn_Space_H) {
                //第一种情况 独占一行
                btn.frame = CGRectMake(lastMaxX, lastMaxY, self.frame.size.width - 2 * KBtn_Space_H, Btn_Height);
                //最大高度改变
                lastMaxY = lastMaxY + Btn_Height + KBtn_Space_V;
            }else {
                //需要换行
                lastMaxY = lastMaxY + Btn_Height + KBtn_Space_V;
                lastMaxX = KBtn_Space_H;
                btn.frame = CGRectMake(lastMaxX, lastMaxY, btn.width + lastMaxX + KBtn_Space_H > self.width ? self.width - 2 * KBtn_Space_H : btn.width, Btn_Height);
                lastMaxX = btn.maxX + KBtn_Space_H;
            }
        }else {
            //可以放得下,不需要换行
            btn.frame = CGRectMake(lastMaxX, lastMaxY, btn.width, Btn_Height);
            lastMaxX = lastMaxX + btn.width + KBtn_Space_H;
        }
        [self addSubview:btn];
    }
    //设置view的高度
    self.frame = CGRectMake(self.x, self.y, self.width, lastMaxY + Btn_Height + KBtn_Space_V);
    
}
- (void)clickTag:(UIButton *)sender {
    
    if (self.canMultipleSelection) {
        //多选
         sender.selected = sender.selected == NO ? YES : NO;
        if (sender.selected) {
            [self.selectedTags addObject:sender.titleLabel.text];
        }else {
            [self.selectedTags removeObject:sender.titleLabel.text];
        }
    }else {
        //单选
        [self.selectedTags removeAllObjects];
        for (TagBtn *btn in self.subviews) {
            btn.selected = NO;
        }
        sender.selected = YES;
        [self.selectedTags addObject:sender.titleLabel.text];
    }
    if ([self.delegate respondsToSelector:@selector(tagsView:didSelectedTags:)]) {
        [self.delegate tagsView:self didSelectedTags:self.selectedTags];
    }
}
/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
}
*/

@end

@implementation TagBtn
+ (TagBtn*)tagBtnWithTagTitle:(NSString *)title{
    TagBtn *btn = [super buttonWithType:UIButtonTypeCustom];
    [btn setTitle:title forState:UIControlStateNormal];
    btn.titleLabel.font = Title_Font;
    btn.backgroundColor = Normal_Background_Color;
    [btn setTitleColor:Normal_Text_Color forState:UIControlStateNormal];
    [btn setTitleColor:Selected_Text_Color forState:UIControlStateSelected];
    btn.layer.cornerRadius = 20;
    btn.layer.masksToBounds = YES;
    CGSize size = [btn.titleLabel sizeThatFits:CGSizeMake(50, Btn_Height)];
    btn.frame = CGRectMake(0, 0, size.width + 10, Btn_Height);
    //监听属性变化
    [btn addObserver:btn forKeyPath:@"selected" options:NSKeyValueObservingOptionNew context:nil];
    return btn;
}
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSKeyValueChangeKey,id> *)change context:(void *)context {
    if (object == self && [keyPath isEqualToString:@"selected"]) {
        if (self.selected) {
            self.backgroundColor = Selected_Background_Color;
        }else {
            self.backgroundColor = Normal_Background_Color;
        }
    }
}
@end

2.使用方法:

TagsView *tagsV = [[TagsView alloc]initWithFrame:CGRectMake(0, 0, UI_SCREEN_WIDTH, 0) tagsArray:@[@"龙与地下城,初版(Dungeons &amp; Dragons),TSR公司发布",@"o 龙与地下城(基本,又称BD& D)",@"*龙与地下城起源版(Origin D&D,“0E”)",@" 龙与地下城,第三版",@"龙与地下城精华版",@"龙与地下城,第五版(Dungeons & Dragons 5th Edtion)"]];
    tagsV.canMultipleSelection = YES;
    tagsV.delegate = self;
    [self.view addSubview:tagsV];
#pragma mark TagsViewDelegate
- (void)tagsView:(TagsView *)view didSelectedTags:(NSArray *)tags {
    NSLog(@"%@",tags);
}

3.效果:
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值