超简单拼图实现

1)先设置存放图片的数组,将要添加的图片加入数组 

2)然后通过一层9趟的循环进行3x3的一个简单拼图布局

    for (int i = 0; i < 9; i++) 

//button的宽高是当前屏幕的1/3,位置也是根据每个按钮的宽高进行布局的

        clickButton.frame = CGRectMake((i % 3) * self.view.frame.size.width/3, 100 + self.view.frame.size.width/3 * (i/3), self.view.frame.size.width/3, self.view.frame.size.width/3);

        clickButton.backgroundColor = [UIColor colorWithRed:0.035 green:1.000 blue:0.950 alpha:0.6];     

        //给button添加背景图片

        [clickButton setBackgroundImage:[UIImage imageNamed:photosArray[i]] forState:UIControlStateNormal];

        //给button添加tag标记

        clickButton.tag = (i / 3)*10 + 11 + i % 3;

3)给button添加点击事件change photo:

4)实现点击事件方法,即:要实现拼图功能,点击的button后,分别判断被点击的button上下左右是否存在设置图片为空的button,如果存在,再进一步判断被点击的按钮是否是边界按钮,即要确认图片的交换是在3x3的拼图界面内进行的(例:if([rightButtonbackgroundImageForState:UIControlStateNormal] == nil && sender.tag % 10 !=3))

代码实例:

- (void)viewDidLoad {

    [super viewDidLoad];

    // Do any additional setup after loading the view.

    

    self.view.backgroundColor = [UIColor colorWithWhite:0.821 alpha:1];

    

    //将要添加的图片放入数组

    NSArray *photosArray = [NSArray arrayWithObjects:@"(6(UL0]}[`8[G2H1))WWSSX.jpg", @")CW{X_T%VQ1P`}IHV9[W{)U.jpg", @"Q_5_C5B08TZ@(OJSVZY3)`Q.jpg", @"G$E%`82J%J{KL4Q3SUS8}RG.jpg", @"9RLCLW[~GPCZZLKOCB~_O56.jpg", @"IB1NS5C4RLNPMS3}R}{Z)H6.jpg", @"D)%~W{6D`5H@{~`PQ9G[9B5.jpg", @"`PDLWV8$U}VQ5`MI3(GZ0LX.jpg", @"", nil];

    //用单层循环布一个9x9的界面

    for (int i = 0; i < 9; i++) {

        

        UIButton *clickButton = [UIButton buttonWithType:UIButtonTypeCustom];

        clickButton.frame = CGRectMake((i % 3) * self.view.frame.size.width/3, 100 + self.view.frame.size.width/3 * (i/3), self.view.frame.size.width/3, self.view.frame.size.width/3);

        clickButton.backgroundColor = [UIColor colorWithRed:0.035 green:1.000 blue:0.950 alpha:0.6];

        

        //给button添加背景图片

        [clickButton setBackgroundImage:[UIImage imageNamed:photosArray[i]] forState:UIControlStateNormal];

        //给button添加tag标记

        clickButton.tag = (i / 3)*10 + 11 + i % 3;

        //添加点击事件

        [clickButton addTarget:self action:@selector(changePhotos:) forControlEvents:UIControlEventTouchUpInside];

        //加到view视图上,别释放按钮

        [self.view addSubview:clickButton];

        

    }

    

    

}

-(void)changePhotos:(UIButton *)sender{

    UIButton *rightButton = [[UIButton alloc] init];

    rightButton = (UIButton *)[self.view viewWithTag:sender.tag + 1];

    UIButton *leftButton = [[UIButton alloc] init];

    leftButton = (UIButton *)[self.view viewWithTag:sender.tag - 1];

    UIButton *upButton = [[UIButton alloc] init];

    upButton = (UIButton *)[self.view viewWithTag:sender.tag - 10];

    UIButton *downButton = [[UIButton alloc] init];

    downButton = (UIButton *)[self.view viewWithTag:sender.tag + 10];

    

    //点击的按钮

    UIButton *Button = [[UIButton alloc] init];

    Button = (UIButton *)[self.view viewWithTag:sender.tag];

    

    //将要被交换的图片

    UIImage *didImage = [[UIImage alloc] init];

    didImage = [(UIButton *)[self.view viewWithTag:sender.tag] backgroundImageForState:UIControlStateNormal];

    if ([rightButton backgroundImageForState:UIControlStateNormal] == nil && sender.tag % 10 != 3) {

        //进行图片交换

        [rightButton setBackgroundImage:didImage forState:UIControlStateNormal];

        [Button setBackgroundImage:nil forState:UIControlStateNormal];

    }else if([leftButton backgroundImageForState:UIControlStateNormal] == nil && sender.tag % 10 != 1){

        [leftButton setBackgroundImage:didImage forState:UIControlStateNormal];

        [Button setBackgroundImage:nil forState:UIControlStateNormal];

    }else if([upButton backgroundImageForState:UIControlStateNormal]  == nil && sender.tag / 10 != 1){

    

        [upButton setBackgroundImage:didImage forState:UIControlStateNormal];

        [Button setBackgroundImage:nil forState:UIControlStateNormal];

    }else if([downButton backgroundImageForState:UIControlStateNormal]  == nil && sender.tag / 10 != 3){

    

        [downButton setBackgroundImage:didImage forState:UIControlStateNormal];

        [Button setBackgroundImage:nil forState:UIControlStateNormal];

    }

    

}

补充:判断被点击按钮的上下左右是否存在可以交换的按钮是通过每个按钮的标记tag实现的,在进行3x3的布局时,我将第一排的三个按钮标记设为11 12 13,第二排的三个按钮标记设为21 22 23,第三排的三个按钮标记设为31 32 33,这样,当要判断被点击按钮的左边是否为空时,只需要将被点击按钮的tag-1,就能得到左边一个按钮,右边tag+1,上面的按钮tag-10,下面的按钮tag+10,这样设置标记为了,边界按钮的判断,不会出现,像 11 12 13 

                                                                          14 15 16

                                                                          17 18 19

虽然这样的标记,对上下判断没影响,但是,当点击14时,如果要判断左边的按钮,就会出现左边存在按钮,但其实14的左边应该没有按钮,虽然可以加一个条件判断当前的按钮是否是最左边的按钮如果是则不用判断左边是否有按钮,但这样判断左边是否有按钮需要的条件不容易找,