翻翻看游戏小总结
在做这个游戏前，我们首先要理清下整个设计思路。我们做翻翻看，游戏的效果就是：一开始图片全正面显示，给我们几秒的时间记住每一张图的位置，然后全部翻转过去，显示同一背景图片。当我们点击图片的时候，图片翻转过来，如果连续点击的两张图片是相同的话，图片消失，否则将翻转回去背景图片那一面。
因为我们要有两两相同的图片一起出现，而且出现位置还需要是随机的。因为我们存储图片可以以他的图片名形式进行存储，所以这时我们就可以用一个可变数组先存进图片，例如我们创建一个有24张图片的翻翻看游戏，我们就要先创建个数组以接受图片（以下代码包含音效）
#import "ViewController.h"
#import <AVFoundation/AVFoundation.h>
@interfaceViewController ()
@end
@implementation ViewController
- (void)viewDidLoad
{
[superviewDidLoad];
//创建有序的图片数组 NSMutableArray *aryImg=[[[NSMutableArray alloc]init]autorelease]; //创建一个声音数组 NSMutableArray *soundAry=[[[NSMutableArray alloc]init]autorelease]; //加入12张图片，每张加入2次，总共24张 //循环添加图片名进数组 for (int i=1; i<13; i++) { NSString *str=[NSString stringWithFormat:@"fruit_normal_%d",i]; [aryImg addObject:str];//语句使用2次，就是重复加入一张图片2次 [aryImg addObject:str]; NSString *str1=[NSString stringWithFormat:@"sound_%d",i]; [soundAry addObject:str1]; [soundAry addObject:str1]; }
}
我们要使游戏有可玩性，肯定要时图片随机出现在24个位置的某个位置，而不是固定的某些位置，这时候我们就需要创建一个新的数组，将原本存储图片的数组内的元素进行随机打乱存入
#import <UIKit/UIKit.h> @interface ViewController : UIViewController @property(retain,nonatomic)NSMutableArray *suijiAry,*sjSoundAry;//随机数组
@property(retain,nonatomic)UIImageView *lastimgV;//用来接收最后一次点击
@property(retain,nonatomic)UIAlertView *alertV;//提示视图窗
@end
#import "ViewController.h"
#import <AVFoundation/AVFoundation.h>
@interfaceViewController ()
@end
@implementation ViewController
- (void)viewDidLoad
{
[superviewDidLoad];
//生成随机图片数组和像对应的声音数组
//创建一个随机数组，用来接收有序数组的随机 self.suijiAry=[[[NSMutableArray alloc]init]autorelease]; //创建随机数组，用来接受有序声音数组的随机 self.sjSoundAry=[[[NSMutableArray alloc]init]autorelease]; for (int i=0; i<24; i++) { int j= arc4random()%aryImg.count;//随机取下标 NSString *str=[aryImg objectAtIndex:j];//根据下标取数组元素，并加入数组str NSString *str1=[soundAry objectAtIndex:j]; [self.suijiAry addObject:str]; [self.sjSoundAry addObject:str1]; [aryImg removeObjectAtIndex:j];//接收后移除原本数组元素，避免重复获取 [soundAry removeObjectAtIndex:j]; }
}
做好了这些前期准备后，我们就可以来创建我们的视图窗口以放置这些东西了
#import "ViewController.h" #import <AVFoundation/AVFoundation.h> @interface ViewController () @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; //根据随机数组创建一组随机排布的图片 for (int i=0; i<24; i++) { UIImageView *imgV=[[UIImageView alloc]initWithFrame:CGRectMake(80*(i%4)+5, 75*(i/4)+5, 70, 70)];//创建图相框 imgV.tag=1000+i;//给图相框添加标签 为1000+i格式 imgV.image=[UIImage imageNamed:[self.suijiAry objectAtIndex:i]];//设置图相框图片 [self.view addSubview:imgV];//添加图相框子示图 }
整个视图都创建好了，这个时候我们就要对图片视图的整个效果进行丰富，是它能达到我们像要达到的效果。
因为图片是无法点击的，所以我们要启用用户交互，然后给图片加上手势
imgV.userInteractionEnabled=YES;//打开图相框交互，才能添加手势 //添加单击事件（手势） UITapGestureRecognizer*danji=[[[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(danjiAction:)]autorelease]; //给图片加上手势：单击 注：因为图片不支持点击，所以我们只能给图片视图增加一个手势用来支持 [imgV addGestureRecognizer:danji]; //将图片延迟两秒后翻转 [self performSelector:@selector(fanzhuan:) withObject:imgV afterDelay:2];
我们再写一下实现单击和翻转的方法
//翻转事件 -(void)fanzhuan:(UIImageView*)imgView{ //翻转语句 随着时间变化的动画 1部分代表是翻转所用时间，也就是翻转速度 “2”部分为枚举类的第3个选项。 [UIView animateWithDuration:1 animations:^{ imgView.image=[UIImage imageNamed:@"beijing.jpg"];//设置初始背景 [UIView setAnimationTransition:2 forView:imgView cache:YES]; } completion:^(BOOL finished) { }]; //启用用户交换，启用次选项才能使图像可用被触发点击事件 imgView.userInteractionEnabled=YES; } //单击事件 -(void)danjiAction:(UITapGestureRecognizer*)sender{ //设置翻转对象为发送过来的对象 UIImageView *imgV=(UIImageView*)sender.view; //播放相应的声音 NSURL *url=[NSURL fileURLWithPath:[[NSBundle mainBundle]pathForResource:[self.sjSoundAry objectAtIndex:imgV.tag-1000] ofType:@"mp3"]]; AVAudioPlayer *player=[[AVAudioPlayer alloc]initWithContentsOfURL:url error:nil]; [player play]; //设置翻转效果 [UIView animateWithDuration:1 animations:^{ //设置翻转后的图片，用标签法确定 imgV.image=[UIImage imageNamed:[self.suijiAry objectAtIndex:imgV.tag-1000]]; //设置动画翻转方式，对象，存储 [UIView setAnimationTransition:1 forView:imgV cache:YES]; } completion:^(BOOL finished) { //翻转之后事件 if (self.lastimgV!=nil) { //后面点击的图片和之前点击的图片是否相同，并且点击的图片编号不是同一张 if ([self.lastimgV.image isEqual:imgV.image]&&self.lastimgV.tag!=sender.view.tag) { //设置动画效果 [UIView animateWithDuration:1 animations:^{ //alpha：设置透明度，为0隐藏 self.lastimgV.alpha=0; imgV.alpha=0; }]; //设置通关提醒 static int serco=0; serco++; if (serco==self.suijiAry.count/2) { self.alertV=[[UIAlertView alloc]initWithTitle:@"过关" message:@"恭喜你过关" delegate:nil cancelButtonTitle:@"退出" otherButtonTitles:@"下一关", nil]; [self.alertV show]; [self.alertV release]; } }else{ //如果图片.image属性不同，将图片翻转回原来的背景 [self performSelector:@selector(fanzhuan:) withObject:self.lastimgV afterDelay:1]; [self performSelector:@selector(fanzhuan:) withObject:imgV afterDelay:1]; } //执行完对比后，将lastimgV设为空，以便下次判断 self.lastimgV=nil; }else{ //如果lastimgV是空的，就为他存储这次点击的图片 self.lastimgV=imgV; } }]; }
