IOS dynamic adaptive tag implementation and ios dynamic adaptive

IOS dynamic adaptive tag implementation and ios dynamic adaptive
First

 

 

Design Requirements

1. The label width is adaptive to the content.

2. The number of labels displayed in a row is dynamic. If you put it down, you can just put it. If you don't put it down, you can just wrap it.

3. The first one is selected by default.

4. select at least one tag.

Implementation

First of all, we can see from this effect that this label is in the selected and unselected status, so our preferred control must be implemented using UIButton.

To a small extent, the key is that labels can be automatically wrapped or smart, rather than fixed the number of rows, by calculating the actual width of each button and comparing the screen width, we can determine whether a line break is required.

Another point is to process the function of selecting at least one tag. Here, I can use the userInteractionEnabled attribute of the control button to implement this function, if there is only one button, set the attribute of that button to NO, so that the user is prohibited from clicking it. At this time, other buttons can be selected normally, if the selected button is greater than one, change the button attribute to YES, so that the button can be clicked again.

Specific Code

Create an XGTagView class inherited from UIView

//// XGTagView. h // dynamic tag //// Created by xgao on 17/3/22. // Copyright©Xgao. all rights reserved. // # import <UIKit/UIKit. h> @ interface XGTagView: UIView/*** initialization ** @ param frame * @ param tagArray tag array ** @ return */-(instancetype) initWithFrame :( CGRect) frame tagArray :( NSMutableArray *) tagArray; // tag array @ property (nonatomic, retain) NSArray * tagArray; // selected tag text color @ property (nonatomic, retain) UIColor * textColorSelected; // default label text color @ property (nonatomic, retain) UIColor * textColorNormal; // select the label background color @ property (nonatomic, retain) UIColor * backgroundColorSelected; // default tag background color @ property (nonatomic, retain) UIColor * backgroundColorNormal; @ end

 

 

//// XGTagView. m // dynamic tag /// Created by xgao on 17/3/22. // Copyright©Xgao. all rights reserved. // # import "XGTagView. h "@ interface XGTagView () @ end @ implementation XGTagView/*** initialize ** @ param frame * @ param tagArray tag array ** @ return */-(instancetype) initWithFrame :( CGRect) frame tagArray :( NSArray *) tagArray {self = [super initWithFrame: frame]; if (self) {_ tagArray = tagArray; [self setUp];} return self;} // initialization-(void) setUp {// default color _ textColorNormal = [UICo Lor darkGrayColor]; _ textColorSelected = [UIColor whiteColor]; _ backgroundColorSelected = [UIColor redColor]; _ backgroundColorNormal = [UIColor whiteColor]; // create a tag button [self createTagButton];} // rewrite the set attribute-(void) setTagArray :( NSMutableArray *) tagArray {_ tagArray = tagArray; // re-create the tag [self resetTagButton];}-(void) setTextColorSelected :( UIColor *) textColorSelected {_ textColorSelected = textColorSelecte D; // re-create the tag [self resetTagButton];}-(void) setTextColorNormal :( UIColor *) textColorNormal {_ textColorNormal = textColorNormal; // re-create the tag [self resetTagButton];} -(void) custom :( UIColor *) backgroundColorSelected {_ backgroundColorSelected = custom; // recreate the tag [self resetTagButton];}-(void) setBackgroundColorNormal :( UIColor *) backgroundColorNormal {_ backgroundColorN Ormal = backgroundColorNormal; // re-create the tag [self resetTagButton];} # pragma mark-Private // re-create the tag-(void) resetTagButton {// remove the previous tag for (UIButton * btn in self. subviews) {[btn removeFromSuperview];} // re-create the tag [self createTagButton];} // create the tag button-(void) createTagButton {// The height of the button CGFloat btnH = 28; // CGFloat leftX = 6 on the left; // CGFloat topY = 10 on the top margin; // CGFloat Margat = 10 on the left and right of the button; // CGFloat m on the top and right of the button ArginY = 10; // left and right margins of text CGFloat fontMargin = 10; for (int I = 0; I <_ tagArray. count; I ++) {UIButton * btn = [UIButton buttonWithType: UIButtonTypeCustom]; btn. frame = CGRectMake (margbench + leftX, topY, 100, btnH); btn. tag = 100 + I; // The first if (I = 0) {btn is selected by default. selected = YES;} // button text [btn setTitle: _ tagArray [I] forState: UIControlStateNormal]; // ------ default style // button text default style NSMutableAttributedString * btnDe FaultAttr = [[NSMutableAttributedString alloc] initWithString: btn. titleLabel. text]; // text size [btnDefaultAttr addAttribute: NSFontAttributeName value: [UIFont systemFontOfSize: 13] range: NSMakeRange (0, btn. titleLabel. text. length)]; // default color [btnDefaultAttr addattriename: NSForegroundColorAttributeName value: self. textColorNormal range: NSMakeRange (0, btn. titleLabel. text. length)]; [btn setAttributedTitle: btnD EfaultAttr forState: UIControlStateNormal]; // Default background color [btn setBackgroundImage: [self imageWithColor: self. backgroundColorNormal] forState: UIControlStateNormal]; // ----- selected style // selected font color NSMutableAttributedString * btnSelectedAttr = [[NSMutableAttributedString alloc] initWithString: btn. titleLabel. text]; // The selected color [btnSelectedAttr addattri: NSForegroundColorAttributeName value: self. textColorSelected range: NSMakeRange (0, btn. titleLabel. text. length)]; // the size of the selected text [btnSelectedAttr addattriename: NSFontAttributeName value: [UIFont systemFontOfSize: 13] range: NSMakeRange (0, btn. titleLabel. text. length)]; [btn setAttributedTitle: btnSelectedAttr forState: UIControlStateSelected]; // select the background color [btn setBackgroundImage: [self imageWithColor: self. backgroundColorSelected] forState: UIControlStateSelected]; // rounded corner btn. layer. CornerRadius = btn. frame. size. height/2.f; btn. layer. masksToBounds = YES; // border btn. layer. borderColor = [UIColor lightGrayColor]. CGColor; btn. layer. borderWidth = 0.5; // set the margin and gap of the button [self setTagButtonMargin: btn fontMargin: fontMargin]; // process line feed if (btn. frame. origin. x + btn. frame. size. width + marg.pdf> self. frame. size. width) {// wrap topY + = btnH + marginY; // reset leftX = 6; btn. frame = CGRectMake (mar GinX + leftX, topY, 100, btnH); // you can specify the margins and gaps of the buttons. For details, see [self setTagButtonMargin: btn fontMargin: fontMargin];} // reset the height of CGRect frame = btn. frame; frame. size. height = btnH; btn. frame = frame; // ----- selected event [btn addTarget: self action: @ selector (selectdButton :) forControlEvents: UIControlEventTouchUpInside]; [self addSubview: btn]; leftX + = btn. frame. size. width + margton;} // check the button status. At least one [self checkButtonState] is selected.} // Set the button margin and gap-(void) setTagButtonMargin :( UIButton *) btn fontMargin :( CGFloat) fontMargin {// The button adaptive [btn sizeToFit]; // recalculate the Left and Right gaps of button text CGRect frame = btn. frame; frame. size. width + = fontMargin * 2; btn. frame = frame;} // check the button status. At least one-(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) {// only one of them indicates the selectedBtn gesture. userInteractionEnabled = NO;} else {// deselect the disabled gesture for (int I = 0; I <_ tagArray. count; I ++) {UIButton * btn = (UIButton *) [self viewWithTag: 100 + I]; if (! Btn. userInteractionEnabled) {btn. userInteractionEnabled = YES ;}}}// generate UIImage-(UIImage *) imageWithColor :( UIColor *) color {CGRect rect = CGRectMake (0.0f, 0.0f, 1.0f, 1.0f) based on the color ); // context UIGraphicsBeginImageContext (rect. size); // set the background color [color set]; // set the filling Area UIRectFill (CGRectMake (0, 0, rect. size. width, rect. size. height); // return UIImage * image = UIGraphicsGetImageFromCurrentImageContext (); // End context UIGraphicsEndImageContext (); return image;} # pragma mark-Event // click the Event button-(void) selectdButton :( UIButton *) btn {btn. selected =! Btn. selected; // check the button status. At least one [self checkButtonState] is selected;} @ end

 

Okay. If you cannot understand anything, just leave a message to me ~~