iOS学习—表情的排列

MJ大神的表情排列，加上自己写的增加表情功能，不过还有点小bug（bug已经解决）

//
//  ViewController.m
//  表情排列
//
//  Created by on 15/4/15.
//  Copyright (c) 2015年 apple. All rights reserved.
//
 
#import "ViewController.h"
 
#define kImageWidth 40
 
@interface ViewController ()
 
{
    UIButton *_addImage;
    NSInteger _imageCount;
    NSInteger _columns;
    NSInteger _col;
    NSInteger _row;
    CGFloat _oneX;
    CGFloat _oneY;
    CGFloat _margin;
}
 
@end
 
@implementation ViewController
 
- (void)viewDidLoad {
    [super viewDidLoad];
    _imageCount = 9;
    [self changePointOfImage:2];
}
 
- (void)addImage:(NSString *)imageName pointX:(NSInteger)x pointY:(NSInteger)y {
    UIImageView *faceView = [[UIImageView alloc] initWithFrame:CGRectMake(x, y, kImageWidth, kImageWidth)];
    faceView.image = [UIImage imageNamed:imageName];
    [self.view addSubview:faceView];
}
 
- (void)changePointOfImage:(NSInteger)currentColumns {
 
    _columns = currentColumns;
     
    _margin = (self.view.frame.size.width - currentColumns * kImageWidth) / (currentColumns + 1);
    _oneX = _margin;
    _oneY = 120;
     
    for (NSInteger i = 0; i <= _imageCount; i++) {
        _col = i % currentColumns;  // 列数
        _row = i / currentColumns;  // 行数
         
        CGFloat x = _oneX + _col * (kImageWidth + _margin);
        CGFloat y = _oneY + _row * (kImageWidth + _margin);
         
        if (self.view.subviews.count == 4 + _imageCount) {
            UIView *temp = self.view.subviews[i + 3];
            CGRect frame = temp.frame;
            frame.origin = CGPointMake(x, y);
            temp.frame = frame;
        } else if (i == _imageCount) {
            _addImage = [UIButton buttonWithType:UIButtonTypeContactAdd];
            [_addImage addTarget:self action:@selector(addFaceImage) forControlEvents:UIControlEventTouchUpInside];
            _addImage.frame = CGRectMake(x, y, kImageWidth, kImageWidth);
            [self.view addSubview:_addImage];
        } else {
            NSInteger imageIndex = i % 9;
            NSString *imageName = [NSString stringWithFormat:@"01%ld.png", imageIndex];
            [self addImage:imageName pointX:x pointY:y];
        }
    }
}
 
- (void)addFaceImage {
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:0.35];
     
    _imageCount++;
    NSInteger newIndex = _imageCount % 9;
    NSString *imageName = [NSString stringWithFormat:@"01%ld.png", newIndex];
     
    CGFloat x = _addImage.frame.origin.x;
    CGFloat y = _addImage.frame.origin.y;
     
    [self addImage:imageName pointX:x pointY:y];
     
    _col = _imageCount % _columns; 
    _row = _imageCount / _columns;
     
    CGRect frame = _addImage.frame;
    frame.origin.x = _oneX + _col * (kImageWidth + _margin);
    frame.origin.y = _oneY + _row * (kImageWidth + _margin);
    _addImage.frame = frame;
     
    [UIView commitAnimations];
}
 
- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
}
 
- (IBAction)segmentedChoose:(UISegmentedControl *)sender {
     
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:0.35];
     
    NSInteger selectCol = sender.selectedSegmentIndex + 2;
    [self changePointOfImage:selectCol];
     
    [UIView commitAnimations];
}
@end

bug说明：

当添加过表情后再排序，就会发现，添加按钮跑到前面去了。如图：

运行截图-1

原因：因为subviews是一个NSArray，添加的表情就会自动的添加到subviews的后面，也就是添加按钮不位于最上层，即subviews的NSArray的末尾。那么循环排序的时候，添加按钮就一直在第十个的位置。

解决方法：将添加表情按钮置于最顶层即可。

在addFaceImage方法中添加

[self.view bringSubviewToFront:_addImage];

修改后的代码如下：

- (void)addFaceImage {
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:0.35];
     
    _imageCount++;
    NSInteger newIndex = _imageCount % 9;
    NSString *imageName = [NSString stringWithFormat:@"01%ld.png", newIndex];
     
    CGFloat x = _addImage.frame.origin.x;
    CGFloat y = _addImage.frame.origin.y;
     
    [self addImage:imageName pointX:x pointY:y];
     
    _col = _imageCount % _columns; 
    _row = _imageCount / _columns;
     
    CGRect frame = _addImage.frame;
    frame.origin.x = _oneX + _col * (kImageWidth + _margin);
    frame.origin.y = _oneY + _row * (kImageWidth + _margin);
    _addImage.frame = frame;
     
    [self.view bringSubviewToFront:_addImage];
     
    [UIView commitAnimations];
}

效果如下：

运行截图-2

iOS学习—表情的排列

推荐阅读更多精彩内容