• 翻翻看游戏小总结


      在做这个游戏前,我们首先要理清下整个设计思路。我们做翻翻看,游戏的效果就是:一开始图片全正面显示,给我们几秒的时间记住每一张图的位置,然后全部翻转过去,显示同一背景图片。当我们点击图片的时候,图片翻转过来,如果连续点击的两张图片是相同的话,图片消失,否则将翻转回去背景图片那一面。

      因为我们要有两两相同的图片一起出现,而且出现位置还需要是随机的。因为我们存储图片可以以他的图片名形式进行存储,所以这时我们就可以用一个可变数组先存进图片,例如我们创建一个有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;
            }
            
        }];
    
        
    
    }
  • 相关阅读:
    动静分离和前后端分离相关
    Nginx搭建动态静态服务器
    动态资源与静态资源
    LVS与Keepalived
    Tomcat实现多主多备
    Keepalived实现心跳检测实现自动重启
    nginx+keepalived简单双机主从热备
    keepalived安装
    php与java通用AES加密解密算法
    PHP修改memory_limit的三种办法
  • 原文地址:https://www.cnblogs.com/amoy888/p/3393670.html
Copyright © 2020-2023  润新知