This article describes how to write a custom nine-cluster grid, because this requirement is also very common in development. Therefore, it is mainly explained by UIButton;
The actual listing is not complicated, it can be completed in two or three steps:
one,Define width and height ()
#define SCREEN_WIDTH [UIScreen mainScreen]. #define SCREEN_HEIGHT [UIScreen mainScreen]. #define JHRGB(r,g,b) [UIColor colorWithRed:(r/255.0) green:(g/255.0) blue:(b/255.0) alpha:1.0] #define JHRandomColor JHRGB(arc4random_uniform(255), arc4random_uniform(255), arc4random_uniform(255))
two,Text and pictures that define the nine-grid
@property (nonatomic, strong) NSArray * titlesArr;
@property (nonatomic, strong) UILabel * numberLab;
@property (nonatomic, strong) NSArray * titleimg;
-(NSArray *)titlesArr{
if (!_titlesArr) {
_titlesArr = @[@"front page",@"purchase",@"article",@"Community",@"Serve",@"scanning",@"position",@"After-sales service",@"Order"];
}
return _titlesArr;
}
-(NSArray *)titleimg{
if (!_titleimg) {
_titleimg = @[@"me",@"msg",@"meg",@"1",@"2",@"3",@"me",@"2",@"3"];
}
return _titleimg;
}
three,Loop out 9 UIBtton data and dynamic adjustment of related styles
-(void)setButton{
NSInteger totalLoc = 3;//A column of three numbers CGFloat W = 50;//width CGFloat H = W;//high CGFloat margin=(-totalLoc * W)/(totalLoc+1);
for (NSInteger i = 0; i < ; i++) {//Cyclic body
UIButton * btn = [UIButton buttonWithType:UIButtonTypeCustom];//Definition of button = CGRectMake(100, 100, 80, 80);//Button size
[btn setTitle:[i] forState:UIControlStateNormal];//Dynamic setting of button text [btn setBackgroundImage:[UIImage imageNamed:[i]] forState:UIControlStateNormal];//Dynamic settings of pictures [btn setTitleColor:[UIColor darkGrayColor] forState:0];//The color of the text [btn setImageEdgeInsets:UIEdgeInsetsMake(5, 25, 45, 25)];//The size of the picture [btn setTitleEdgeInsets:UIEdgeInsetsMake(80, 0, 5, 0)];//The location of the text // = [UIColor blueColor];
/*calculate frame*/
NSInteger row = i / totalLoc;//Line number NSInteger loc = i % totalLoc;//Column number //0/3=0,1/3=0,2/3=0,3/3=1;
//0%3=0,1%3=1,2%3=2,3%3=0;
CGFloat X= margin + (margin + W) * loc;
CGFloat Y= margin + (margin + H) * row;
= CGRectMake(X, Y, W, H);
//Set the tag value (the tag here is just to make each click of the button have a different animation effect) = i;
[btn addTarget:self action:@selector(clickBtn:) forControlEvents:UIControlEventTouchUpInside];
[ addSubview:btn];
}
}
Four,Click the button to listen for event
-(void)clickBtn:(UIButton *)btn{
NSString *stringInt = [NSString stringWithFormat:@"%ld",(long)];
= CATransform3DMakeScale(0.5*arc4random_uniform([stringInt floatValue]), 0.5*arc4random_uniform([stringInt floatValue]), 1);
= ;
NSLog(@"%@wo dian ji l:",stringInt);
[UIView animateWithDuration:0.5 animations:^{
= CATransform3DMakeScale(1, 1, 1);
}];
}
Summarize:
The following logical analysis:
1. The above is using the masonry layout, so my view container does not use width and height (written in my view layer).
2. Define a View container first
3. In the container, define buttons in the loop body, set button properties, etc.
4. Define related arrays, such as: (text, pictures)
5. Click button event triggers the function;
For the logic that needs to be understood by the above information, just copy and paste the above, and the project can be tested personally.
The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.