一：效果图
二：实现功能
根据分栏数排列图片，切换时图片移动。
可进行添加图片操作，添加后的图片随分栏数继续移动。
三：代码分析
1.在Main.storyboard的View添加一个Segmented Control控件，其Segmented属性设为4，并依次修改Segment和相应的Title。在ViewController.h中添加控件属性名（segmented）和控件方法（SegmentedChanged）。
ViewController.h
@interfaceViewController : UIViewController
@property(weak, nonatomic) IBOutlet UISegmentedControl *segmented;
- (IBAction)SegmentedChanged:(UISegmentedControl*)sender;
2.ViewController.m
定义图片按钮宽高常量
#define ImageWH50
定义点击『添加』按钮次数
@interface ViewController () {
int clickTime;
}
@end
---------------------------在@implementation ViewController 和@end中开始编写代码
在- (void) viewDidLoad方法中：
[superviewDidLoad];
clickTime = 0; //初始化点击按钮次数
int colunm = 2; //初始化分栏数
CGFloat magin = (self.view.frame.size.width-ImageWH* colunm) / (colunm + 1); //定义图片间隔长度
CGFloat oneX = magin; //定义第一张图片的x
CGFloat oneY = 100; //定义第一张图片的y
CGFloat finalX = 0.0; //定义『添加』按钮的x
CGFloat finalY = 0.0; //定义『添加』按钮的y
for(int i=0; i<10; i++) { //共有十张图片，下标从0开始
NSString *name = [NSString stringWithFormat:@"P%i.jpg",i]; //将在Supporting Files中添加好的图片的名字提取出，成为新的name变量以使用
int col = i % colunm; //计算图片的行
int row = i / colunm; //计算图片的列
CGFloat newX = oneX + col * (ImageWH + magin); //计算图片的x
CGFloat newY = oneY + row * (ImageWH + magin); //计算图片的y
[self addMyImage:name andX:newX andY:newY]; //调用下面的addMyImage方法
if(i == 9) { //当到第十张图片的时候，添加『添加』按钮
finalX = oneX + ((10+clickTime) % colunm) * (ImageWH+ magin); //『添加』按钮的x
finalY = oneY + ((10+clickTime) / colunm) * (ImageWH+ magin); //『添加』按钮的y
UIButton *myButton = [[UIButton alloc]init]; //创建『添加』按钮
myButton.frame=CGRectMake(finalX, finalY, ImageWH, ImageWH); //『添加』按钮位置
[myButton setTitle:@"添加" forState:UIControlStateNormal]; //『添加』按钮标题
[myButton setTitleColor:[UIColor blueColor] forState:UIControlStateNormal]; //『添加』按钮标题颜色
[self.view addSubview:myButton]; //将『添加』按钮添加到View中
[myButton addTarget:self action:@seletor(onClickButton:) forControlEvents:UIControlEventTouchUpInside]; //调用『添加』按钮的点击事件
}
}
创建addMyImage方法，添加图片
- (void) addMyImage : (NSString*)imageName andX : (CGFloat)x andY : (CGFloat)y{
UIImageView *myImage = [[UIImageView alloc]init]; //定义图片视图
myImage.image= [UIImage imageNamed:imageName]; //添加图片视图的图片
myImage.frame=CGRectMake(x, y,ImageWH,ImageWH); //定义图片视图的大小
[self.view addSubview:myImage]; //将图片视图添加到View中
}
创建onClickButton，为『添加』按钮的点击事件
- (void)onClickButton : (UIButton*)sender{
NSMutableArray *arrayImage = [NSMutableArray array];
for(int i = 0; i < 10; i++) {
NSString*imageName = [NSString stringWithFormat:@"P%i",i];
NSString*path = [[NSBundle mainBundle] pathForResource:imageNameofType:@"jpg"];
UIImageView *addImage = [[UIImageView alloc]init];
addImage.image= [UIImage imageWithContentsOfFile: path];
[arrayImage addObject:addImage];
}
clickTime++;
int randomIndex =arc4random() % [arrayImage count];
UIImageView *img = [arrayImage objectAtIndex:randomIndex];
CGFloat addX = sender.frame.origin.x;
CGFloat addY = sender.frame.origin.y;
img.frame=CGRectMake(addX, addY,ImageWH,ImageWH);
[self.view addSubview:img];
[arrayImage removeObjectAtIndex:randomIndex];
long colunm =self.segmented.selectedSegmentIndex+ 2;
CGFloatmagin = (self.view.frame.size.width-ImageWH* colunm) / (colunm + 1);
CGFloat oneX = magin;
CGFloat oneY = 100;
CGFloat finalX = oneX + ((10+clickTime) % colunm) * (ImageWH+ magin);
CGFloat finalY = oneY + ((10+clickTime) / colunm) * (ImageWH+ magin);
CGRect myFrame = sender.frame;
myFrame.origin.x= finalX;
myFrame.origin.y= finalY;
sender.frame= myFrame;
}
实现在ViewControl.h中定义的控件方法
- (IBAction)SegmentedChanged:(UISegmentedControl*)sender {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
long colunm = sender.selectedSegmentIndex+ 2;
CGFloat magin = (self.view.frame.size.width-ImageWH* colunm) / (colunm + 1);
CGFloat oneX = magin;
CGFloat oneY = 100;
CGFloat finalX = 0.0;
CGFloat finalY = 0.0;
for(int i = 0; i < 10; i++) {
int col = i % colunm;
int row = i / colunm;
CGFloat newX = oneX + col * (ImageWH+ magin);
CGFloat newY = oneY + row * (ImageWH+ magin);
UIView *v =self.view.subviews[i+3];
CGRect temp = v.frame;
temp.origin=CGPointMake(newX, newY);
v.frame= temp;
if(i == 9) {
finalX = oneX + ((10+clickTime) % colunm) * (ImageWH+ magin);
finalY = oneY + ((10+clickTime) / colunm) * (ImageWH+ magin);
UIView *v3 =self.view.subviews[13];
CGRect temp3 = v3.frame;
temp3.origin=CGPointMake(finalX, finalY);
v3.frame= temp3;
}
}
if(clickTime >= 1) {
for(int i = 1; i <=clickTime; i++) {
CGFloat finalx = oneX + ((9+i) % colunm) * (ImageWH+ magin);
CGFloat finaly = oneY + ((9+i) / colunm) * (ImageWH+ magin);
UIView *v2 =self.view.subviews[13+i];
CGRect temp2 = v2.frame;
temp2.origin=CGPointMake(finalx, finaly);
v2.frame= temp2;
}
}
[UIView commitAnimations];
}