别踩白块儿调速攻略及其注意事项
时间： 20:43:11
来源：下载吧
编辑：xwgod
别踩白块儿调速注意事项，自从添加了可以改变块儿速度的功能后，游戏显得更加的人性化了，玩家们可以根据自己的反应快慢来进行调节，但是我们应该明白一下几点。
1.速度调节对于经典模式、禅模式、接力模式，影响更为明显。
2.不要进入速度越快越好的误区，还要考虑设备情况，以免出现卡顿。
3.速度过快，方块下滑会显得比较突兀，容易增加误操作率。
4.调节范围建议在中间偏右的位置。如果游戏熟练可以考虑适当向左调节一些。
5.主要还是根据个人习惯，可以调节后多尝试几次，找一个自己更为适应的速度。
喜欢这文章可以分享给您的朋友哦
别踩白块儿里面的钢琴曲有哪些，可能很多人玩别踩白块儿的时候都有或多或...
别踩白块儿类似游戏是哪些，白块儿这款游戏目前为止也不是属于那种独一无...
别踩白块儿背景音乐到底有哪些，在游戏中背景音乐算是挺多的，所以现在小...
别踩白块儿编程设计逻辑还原解析或许是不少有编程兴趣的玩家想知道的，如...
别踩白块儿世界纪录到底是谁呢，世界纪录年年有，但是一直都不曾被打破的...
跑跑卡丁车2017超凡尊享礼包多少钱 有什么奖励介绍。跑跑卡丁车2017超凡...
梦幻西游手游技能消耗计算器（师门技能/帮派技能/修炼技能）。现在梦幻西...
《植物大战僵尸》实在是经典游戏啊！玩了一段时间忙于学习或者忙于工作需...
荒野行动怎么在电脑玩？荒野行动电脑版使用教程。荒野行动能用电脑玩吗?...
喜欢玩游戏的朋友，一部分人比较喜欢使用修改器修改武力值、金币等，今天...
Cube Escape这一系列的游戏以扣人心弦的故事联系深深吸引着玩家们，那么...
阴阳师现世召唤阵图片 阴阳师现世召唤教程。诸位阴阳师们在网易旗下日系...
　　荒野行动pc版人物动不了怎么办？小编为大家带来荒野行动pc版人物动不...
　　王者荣耀腾讯手游助手怎么设置键位？王者荣耀助手设置教程。王者荣耀...
植物大战僵尸2中文版的难度比英文版要高很多，而且在内购方面那也是十分...jquery之别踩白块游戏的实现
时间： 20:50:30
&&&& 阅读：341
&&&& 评论：
&&&& 收藏：0
标签：　　转载请注明出处&
　　前端学习要告一段落了，也没机会写什么像样的东西，然后无意中想起某人以前给我玩了一下别踩白块的游戏，手残还被嘲讽了下，现在想起来觉得这游戏实现起来也不难，于是上星期用jquery写了一个别踩白块的小游戏，就像当初学python的时候一样写了一个。然后今天正好抽个时间写个博客纪录下，算是对前一段时间学习的总结，没有玩过的可以去下一个原版的来玩一下，游戏很简单，就是从不断下落的方块中点击黑快，如果点击到百块或者有黑块没被点击到，游戏就算结束。游戏实现起来不难，都是一些小知识点。当时写的时候，脑袋有点糊，有一bug看了半天没解决，后来第二天早上脑袋清醒的时一看就看出来，顺便在这里提醒自己一定不要在脑袋不清醒的时候写代码。好了说了这么多先来看一下效果图，这里别吐槽我的css样式设计就好。。。
&一、游戏html页面
游戏的html界面非常简单，分为4部分，
得分标题栏，
游戏界面主题容器，开始的时候为一个div，然后用jquery动态生成黑白格子
开始暂停按钮一栏
游戏结束时候显示的模态框
下面是代码部分
&!DOCTYPE html&
&html lang="en"&
&meta charset="UTF-8"&
&title&Title&/title&
&link href="../css/game.css" rel="stylesheet" type="text/css"&
&div class="main"&
&h3&Score:&span id="score"&0&/span&&/h3&
&div id="content" class="content"&
&div id="inner"&&/div&
&div class="btn"&
&div class="container"&
&button id="begin"&开始&/button&
&button id="stop"&暂停&/button&
&div class="shadow hide"&&/div&
&div class="alert-box hide"&
&div class="game-over"&
&img style="opacity: 0.8" src="../pic/gg.jpg"&
&div class="btn"&
&button id="again"&重新开始&/button&
&button id="back"&返回&/button&
&script src="../js/jquery-1.12.4.js"&&/script&
&script src="../js/game.js"&&/script&
二、css布局　　
写完了html然后就是css，这里主要用到&absolute布局，然后需要注意的是就是游戏过程由于需要不停的生成一栏新div，所以div容器要设置overflow: hidden，这一点需要注意下，然后其他的知识点也就是absolute，relative如何布局，模态框如何实现并居中，都不难，下面看下代码就好
margin: 0;
padding: 0;
width: 808
margin: 50
background:
min-height: 544
width: 408
height:408
background-color:
height: 102
height: 100
width: 100
background-color:
background-color:
text-align:
padding-top: 20
padding-bottom: 20
bottom: 0;
background-color:
opacity: 0.6;
.alert-box{
width: 300
height: 300
left: 50%;
margin-left: -150
margin-top: -150
background-color:
.alert-box .game-over{
margin-left: 20
margin-top: 30
.alert-box .btn{
width: 150
margin-left:
margin-right:
margin-top: 20
.main .btn .container{
width: 150
margin: 20
border: 0;
display: inline-
height: 30
line-height: 30
text-align:
background-color:
三、jquery实现　　
游戏最核心的部分就是jquery实现了，主要的功能如下
游戏的初始化
如何动态插入一行div和删除一行div
开始暂停按钮的事件绑定
游戏过程中点击百块和黑快的事件委托
游戏如何移动以及如何得分
如何自动增加白块下落速度
如何判定游戏结束
　　下面来看一下初始化代码的实现，初始化之前写了个函数，自动插入一行，并且在这一行4个div中某一个为随机的黑块供游戏中点击，剩下3个白块，怎么随机生成，怎么动态创建div这里需要点小技巧，具体看下面。生成一行div的函数完成后只需在初始化函数里面调用4次即可
function insertDiv() {
var rand = Math.floor(Math.random() * 4);　　　　　　　　// 生成一个0到3 的随机数，用来作为判断生成黑块的位置
$("#inner").prepend("&div class=‘item‘&&/div&");
$.each([0, 1, 2, 3], function (k, v) {
if (v == rand) {
$("#inner .item").first().append("&div class=‘black col‘&&/div&");
$("#inner .item").first().append("&div class=‘col‘&&/div&");
function init() {　　　　　　　　　　　　　　　　// 初始生成4*4的div
$.each([0, 1, 2, 3], function () {
insertDiv();
　　初始化完成后，我们需要做的就是如何让界面动起来，这里写了一个函数，每次调用该函数的话，游戏内容会自动向下移动几px，然后将该函数传给定时器，就可以不断的向下滑动，不过这里需要注意，下落过程中，如果下落的距离超过一行后，需要重新插入一行，然后将超出的那一行删除，而且需要将偏移的距离恢复到原来的位置，如果需要加速白块下落的速度，只需将每次向下移动加大即可，游戏后面的自动加速也是基于此来做的。下面来看一下这部分的代码
function move() {
var ctop = parseInt($("#inner").offset().top);
ctop += window.globalS　　　　　　　　　　　　// 自定义的全局变量， 每次下落偏移的距离
$("#inner").offset({top: ctop});
if (ctop &= 114) {
insertDiv();
$("#inner").offset({top: 12}); 　　　　　　 // 刚好移动一个item后在上移一个item
&之后就是写开始，暂停部分，这里主要是对计时器的使用，这里需要注意的是每次点击的时候，都要先判断定时器是否已经清除，否则这里会有bug，下面来直接看一下代码
function bindStart() {
$("#begin").mouseover(function () {
$(this).css("cursor", ‘pointer‘);
}).click(function () {
if(window.globalIsClearT1){　　
　　　　// 自定义的全局变量，看定时器是否清楚
clearInterval(window.globalT1); 　　//没有清除的话，先清除，避免两次按下开始按钮
window.globalT1 = setInterval(move, 30);
window.globalStartClick =　　　　　　//全局变量，是否开始标志位，只有开始了，才能点击
function bindStop() {
$("#stop").mouseover(function () {
$(this).css("cursor", ‘pointer‘);
}).click(function () {
clearInterval(window.globalT1);
window.globalStartClick =
window.globalIsClearT1 =
　　写到这里，再就是看一下，每次点击的时候如何操作，是否得分，还是点错了游戏结束，下面来看一下代码，界面上有4*4个格子，需要事件委托，来判断是哪一个白块被点击，如果点击的是黑快，将其变为白块，并且加上一分即可，否则点错的话，游戏就结束　
function bindClick() {
$("#inner").click(function (e) {
if (window.globalStartClick) {
var current = $(e.target);
if (current.hasClass("black")) {
current.removeClass("black");
gameOver();
下面来看一下如何计算得分的代码，以及如何实现自动的加速，比较简单就不多说了
function score() {
var score = parseInt($("#score").text());
if(score%10 == 0){
window.globalSpeed += 1;
//得到一定的分数后就自动加速
$("#score").text(score + 1);
　　最后来看一下，游戏结束的时候如何处理，游戏结束的话，先暂停游戏下落，然后弹出模态对话框，让用户选择返回，还是重新来过，重新来过的话，分数清零，游戏界面清空，然后初始化再在自动触发开始按钮，开始下一轮游戏，　　
function gameOver() {
//暂停游戏，显示模态框
$("#stop").trigger(‘click‘);
window.globalIsClearT1 =
$(".shadow").removeClass(‘hide‘).next().removeClass(‘hide‘);
$("#again").click(function () {
clearInterval(window.globalT1);
$(".shadow").addClass(‘hide‘).next().addClass(‘hide‘);
$("#score").text(0);
clearAll();
$("#begin").trigger(‘click‘);
// window.globalT1 = setInterval(move, 30)
到这里，基本整个游戏都算实现了，游戏不复杂，但是要完全运行起来，没有bug也不是那么简单，有兴趣的也可以去写写，如果上面代码有什么问题的话，可以向我提出来。　　
　　标签：原文地址：http://www.cnblogs.com/Wxtrkbc/p/5687112.html
&&国之画&&&& &&&&chrome插件
版权所有 京ICP备号-2
迷上了代码！当前位置：
钉钉是目前很多公司企业都会使用的办公软件，可以大大的提高办公效率。钉钉怎么添加特别关注联系人？当好友有动态时可以第一时间通知你。接下来就教教大家怎么设置特别关注。
王者荣耀作为一款大热的手游相信很多小萌新已经按捺不住想要入坑了，但是有很多老司机的术语听不懂怎么办呢？下面就给大家带来最全的王者荣耀老司机术语大全！
王者荣耀作为一款大热的手游相信很多小萌新已经按捺不住想要入坑了，但是有很多老司机的术语听不懂怎么办呢？下面就给大家带来最全的王者荣耀老司机术语大全！
王者荣耀作为一款大热的手游相信很多小萌新已经按捺不住想要入坑了，但是有很多老司机的术语听不懂怎么办呢？下面就给大家带来最全的王者荣耀老司机术语大全！
美图秀秀可以说是最受欢迎的图片编辑工具啦，今天给大家介绍的是使用美图秀秀将照片的效果从白天调成黑夜效果
《弓箭手大作战》来了，快来战斗吧！游戏有简单的操作和好玩的玩法，而且很容易上瘾。你将与世界各地的游戏玩家对战，分享游戏的乐趣！
让我们和世界各地的弓箭手一起玩吧！
6月6日，苹果手机最新系统iOS11在2017年WWDC开发者大会上发布了，其中一大重点就是苹果手机终于支持诈骗短信识别！下载钱盾等第三方app来侦测可能的垃圾短信和诈骗短信，就可以此类信息隔离在单独的文件夹里
小米6怎么样？配置骁龙835处理器+无孔式指纹识别+四轴防抖，今日小米6正式发布，雷军称其为小米7年来工艺巅峰之作。而从发布会上官方的介绍来看，小米6拥有全新的设计和许多新功能，不知道大家都了解了吗？就算不太清楚也没关系，接下来小编带大家一起梳理小米6的亮点。
iPhone8 3D传感摄像头及面部识别功能将强于三星Galaxy S8，
　　今年 iPhone 8 上市之后，三星的 Galaxy 系列智能手机仍然会是其最大的竞争对手。日前分析师郭明錤在投资者报告中指出，与三星 Galaxy S8 相比，今年 iPhone 8 最大的卖点应该是全屏设计。不过也有分析认为，iPhone 8 将在以下两个方面比 Galaxy S8 强。
红色特别版iPhone7和iPhone7 Plus上市 保护壳配件和价格一览，PP助手小编知道许多果粉都在期待着苹果 3/4 月召开一场发布会来推出 2017 年的第一款苹果新品，是新 iPad Pro？新款 iPhone 7 和 iPhone SE？又或者是全新的 Apple Watch 表带？
iPhone7/7 Plus新配色红色特别版正式发布上线 价格6188起，苹果官方在线商城下午15：00至20：30分进行在线商店维护，主要商城将被更新。现在最新消息，苹果商店已经在20：30分更新完毕，正式亮相iPhone7/7 Plus新配色红色特别版，也就是说为艾滋病基金会(Global Fund HIV/AIDS)设立的一款红色特别版。
王者荣耀李白S7赛季怎么出装？S7李白六神装是什么？下面为大家带来李白的现版本出装攻略，希望对大家有所帮助。六神装：追击刀锋+影忍之足+泣血之刃+暗影战斧+破军+破甲弓
　　说到王者荣耀里最炙手可热的英雄，那就不能不提第一刺客李白了，李白这个英雄承载了太多玩家对他的精神寄托，虽然李白一次一次的被削弱，依然受到众多玩家的追捧，用一句李太白的话讲“李白不只是一个刺客，还是我们的一种信仰”，如果说王者荣耀你不会玩李白，就不能称得上是真正的“大神”。
由于技术的升级，苹果iPhone 8中的3D Touch模块成本预计将达到15美元。最新消息显示，iPhone8的特别版售价将会达到1000美元起，折合人民币7000元左右。具体真相只能等待后续曝光揭晓了，拭目以待。
王者荣耀白玫瑰怎么获得?王者荣耀白玫瑰怎么快速刷取?王者荣耀白玫瑰是情人节上线的活动，那么白玫瑰怎么获得呢?白玫瑰获得方法有哪些呢?相信很多玩家都还不清楚，今天小编为大家带来王者荣耀白玫瑰获得方法详细介绍，一起来看看吧。
华为mate7自带浏览器是由华为自主研发，专为华为用户推出的一款手机浏览器应用。作为自带的浏览器，其功能与市场上大多数第三方浏览器一样丰富，在系统的适配程度和运行的流畅度上
　众所周知，王者荣耀S6赛季开启了荣耀战区排名系统，各位大神更是摩拳擦掌虎视眈眈，当然李太白面对国服最强李白称号的诱惑也是着实没有抵抗力。但太白表示：独乐乐不如众乐乐，他希望登顶国服最强的路上有“百粉”的陪伴，可以和粉丝一起分享登顶的快乐。
　　李太白凭借自己幽默搞笑的直播风格荣获了“虎牙王者荣耀最佳主播”，能够在几个月的时间内成长成为一名优秀的游戏主播，不仅是因为他出神入化的走位和超强的意识，更多的是他愿意与“百粉”互动，把粉丝当做兄弟和家人一样对待，在百粉的心里太白也是一位良心主播，经常会为“百粉”举办活动，发放奖品，不仅如此，争夺国服最强李白也要带上粉丝一起上分。
在新版的 Google 相册中，每当你在照片编辑时选择一种照片风格，Google 相册不仅会自动帮你修正「曝光」和「饱和度」，还会自动修正照片的白平衡。整个过程很难被察觉，效果还算比较明显。
要是能重来，我要选李白……不得不说，青莲剑仙李白这个英雄真的太骚！浪！贱！了！只要不断释放2技能神来之笔以及通过被动解禁大招，他就能一直处在不可被选定的状态。无论你的伤害有多高，就是打不中他，而他还可以在一旁放技能消耗你，真的好气哦。
PP助手准备为您下载应用
未越狱版：鳄鱼小顽皮爱洗澡
如果在10秒后下载任务还没有开始，请下载并安装：
下载步骤如下：Posts - 110,
Articles - 0,
Comments - 13
keep moving
21:37 by 菜鸟Alex, ... 阅读,
先看下效果图片
前几天看到一个游戏叫别踩白块,下载量还挺大几百万了都,下载下来玩了玩看了看,这个游戏还挺简单的.俗话说想一千遍,一万遍不如动手做一遍来的实在.昨晚以及今天白天闲的没事就开搞了,下午六点钟终于搞完.中间也遇到了些没想到的问题,有个难题想了多半个下午,待我一一道来...篇幅较长字体较小希望能耐心看完
代码没有过多的进行封装,只是先实现了基本的功能.一共才200多行代码?注释--只是没来得及集成音乐
用的是collectionViewController全部代码都在.m文件中
对于经常要用到的变量进行了宏定义
ViewController.m
Created by 裴波波 on 16/4/23.
Copyright (C) 2016年 裴波波. All rights reserved.
#import &ViewController.h&
//屏幕宽度
#define kScreenW [UIScreen mainScreen].bounds.size.width
//屏幕高度
#define kScreenH [UIScreen mainScreen].bounds.size.height
//屏幕尺寸
#define kScreenB [UIScreen mainScreen].bounds
#define kLineCount 4
//每行白块个数
#define kCellCount 200 //白块总个数
@interface ViewController ()
@property (weak, nonatomic) IBOutlet UICollectionViewFlowLayout *flowL
/** 存储每一行的cell的可变数组 */
@property (nonatomic, strong) NSMutableArray *arrayM;
/** 记录取整索引 */
@property (nonatomic, assign)
/** 初始状态整体竖直偏移高度 */
@property (nonatomic, assign) CGFloat offsetT
/** 每个cell高度 */
@property (nonatomic, assign) CGFloat itemH;
/** 点击黑块计数器 */
@property (nonatomic, assign) int blackC
/** 主界面view */
@property (nonatomic, strong) UIView *mainV
/** 秒表计时器 */
@property (nonatomic, strong) NSTimer *
/** 显示时间的label */
@property (nonatomic, strong) UILabel *lblT
/** 累计用时 */
@property (nonatomic, assign) CGFloat useT
/** 即将消失 */
@property (nonatomic, assign) int displayN
此处的即将消失的意思是:displayNum,由于collectionView每次滑动的时候,cell即将被销毁(干掉)的时候都会调用的方法.但是当程序刚进入初始化的时候也会调用这个方法,所以用一个数字来标记当点击cell 的时候再判断是否漏掉了黑色的块没有点击.如果漏掉了黑色块没有点击 -& 游戏结束
@implementation ViewController
#pragma mark - 懒加载存储每行cell的可遍数组
-(NSMutableArray *)arrayM{
if (_arrayM == nil) {
_arrayM = [NSMutableArray array];
return _arrayM;
#pragma mark - 数据源
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return kCellC
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
UICollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:@&cell& forIndexPath:indexPath];
/** 绑定tag排序用----并没有什么用处 */
cell.tag = indexPath.
/** 先统一设置cell背景色白色 */
cell.backgroundColor = [UIColor whiteColor];
/** 根据脚标每行随机设置一个颜色为黑色的cell */
/** 将每行的cell 4个存入可变数组,获取随机数0-3,根据随机数取脚标让其变黑 */
/** 将cell数组添加到可变数组 */
[self.arrayM addObject:cell];
/** 记录索引 = 3的时候从中随机选择一个cell让其背景色变 黑 */
if (self.idx == 3) {
/** 产生的随机脚标 */
int idxBlcak = arc4random_uniform(4);
UICollectionViewCell * blackCell = self.arrayM[idxBlcak];
blackCell.backgroundColor = [UIColor blackColor];
self.idx ++;
//idx & 3 重置记录索引
if (self.idx & 3) {
self.idx = 0;
//当重置idx的时候 令可变数组arrayM removeAllObject
[self.arrayM removeAllObjects];
用self.arrayM可变数组来保存每一行的cell,再用产生随机数的函数来产生一个0-3的一个随机数,让后让以这个随机数为脚标的 存在 self.arrayM中的cell的颜色变为黑色这样就实现了 每行黑色的版块的随机.
当idx & 3 的时候再重置为0,接着使用
#pragma mark - 代理
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
UICollectionViewCell * cell = [collectionView cellForItemAtIndexPath:indexPath];
/** 点击开始计时 */
if (self.timer == nil) {
self.timer = [NSTimer scheduledTimerWithTimeInterval:1.0/60 target:self selector:@selector(addTimeOfUserUse) userInfo:nil repeats:YES];
NSRunLoop * runloop = [NSRunLoop currentRunLoop];
[runloop addTimer:self.timer forMode:NSRunLoopCommonModes];
/** 标记---奠基石系统执行方法didEndDisplayingCell时检测漏掉的黑色 */
self.displayNum = 1;
/** 判断cell颜色为黑色-&变灰 cell为白色 -& 变红 */
/** 如果点击到了黑块计数 */
if (cell.backgroundColor == [UIColor blackColor]) {
cell.tag = 99999; //此行没有什么卵用
cell.backgroundColor = [UIColor grayColor];
self.blackCount ++;
//点击错误提示用户点错并且返回点击黑色块的数量
cell.backgroundColor = [UIColor redColor];
/** 弹出提示框 */
[self showClickError];
/** 停止计时器 */
[self.timer invalidate];
/** 每次点击黑色块让collectionView偏移 - 一个cell的高度 */
/** 滑动到头发生某个事件 */
if (self.collectionView.contentOffset.y == 0) {
//点击滚动
[self.collectionView scrollToItemAtIndexPath:indexPath atScrollPosition:UICollectionViewScrollPositionBottom animated:YES];
当点击黑色的版块的时候:1. 要将黑色 -& 灰色 ,然后collectionView向下滑动过点击的cell,也就是最后一行代码执行的方法.之前我用的是点击cell让整体的collectionView的偏移量 - 最小行间距 - 每个cell的高度.但是这样做有bug,就是当你点击cell collectionVIew向下滑动的时候最下面一行4个cell会直接消失,露出背景色,体验很差...然后看官方文档找方法,找到这个滑动的方法,最合适.
此处当点击cell的时候开启一个定时器,类似自动图片轮播器.当点击到的cell不是黑色的版块的时候,计时器停止,记录时间,点击弹框的确定按钮后将时间给了主界面的label来显示用的时间.
self.blackCount点击到的黑色的版块的计数器,游戏结束后统计结果,在弹框显示点击黑色的版块的数量
此时设置self.displayNum = 1;让下面的方法didEndDisplayingCell,,记录cell被移除会调用的方法,判断被移除cell是否包含黑色的cell如果包含了黑色的cell说明玩家漏掉了黑色的cell,然后弹框提醒-&游戏结束
最后判断当偏移量为0的时候停止滚动.
#pragma mark - 将要消失的cell
-(void)collectionView:(UICollectionView *)collectionView didEndDisplayingCell:(UICollectionViewCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath{
if (cell.backgroundColor == [UIColor blackColor]) {
if (self.displayNum == 1) {
[self showClickError];
[self.timer invalidate];
self.displayNum = 0;
为什么要用self.displayNum来进行点击的时候判断,因为当程序刚启动的时候也会调用此方法,我们不希望当程序启动的时候就调用此方法中的 &弹框& 以及 &停止计时器&,所以要用一个相当于启动器来启动监视黑色cell是否被干掉
#pragma mark - 累加时间,每秒执行60次
-(void)addTimeOfUserUse{
self.useTime += 1.0 / 60;
#pragma mark - 提示错误框
-(void)showClickError{
UIAlertController * alertVc = [UIAlertController alertControllerWithTitle:@&最终结果& message:[NSString stringWithFormat:@&成绩是:%zd个&,self.blackCount] preferredStyle:UIAlertControllerStyleAlert];
/** 确定返回主界面 */
UIAlertAction * action = [UIAlertAction actionWithTitle:@&确定& style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
self.lblTime.text = [NSString stringWithFormat:@&累计用时%f&,self.useTime];
self.blackCount = 0;
self.displayNum = 0;
[UIView animateWithDuration:0.2 animations:^{
self.mainView.alpha = 1;
[alertVc addAction:action];
[self presentViewController:alertVc animated:YES completion:nil];
弹框提醒的同时将点击的黑色的cell的个数呈现到弹框上.同时重置记录点击cell个数的计数器 self.blackCount,以及self.displayNum.
- (void)viewDidLoad {
[super viewDidLoad];
self.collectionView.backgroundColor = [UIColor blueColor];
/** 初始化布局参数 */
[self initFlowLayout];
/** 初始化主界面 */
[self initMainView];
#pragma mark - 初始化主界面
-(void)initMainView{
UIView * mainView = [[UIView alloc] initWithFrame:kScreenB];
self.mainView = mainV
mainView.backgroundColor = [UIColor orangeColor];
[self.view addSubview:mainView];
UIButton * button = [[UIButton alloc] init];
[button setTitle:@&进入& forState:UIControlStateNormal];
button.bounds = CGRectMake(0, 0, 50, 30);
button.backgroundColor = [UIColor blackColor];
button.center = mainView.
[mainView addSubview:button];
[button addTarget:self action:@selector(hideMainView) forControlEvents:UIControlEventTouchUpInside];
//显示游戏时长label
UILabel * lblTime = [[UILabel alloc] init];
lblTime.frame = CGRectMake(0, 0, kScreenW, 200);
self.lblTime = lblT
lblTime.font = [UIFont systemFontOfSize:22];
lblTime.textAlignment = NSTextAlignmentC
[mainView addSubview:lblTime];
#pragma mark - 隐藏主界面进入游戏
-(void)hideMainView{
/** 将计时器重置为nil */
self.timer =
/** 将累计用时重置nil */
self.useTime = 0;
/** 每次进入游戏将偏移量重置 */
CGFloat offset = (kCellCount / kLineCount - 1) * self.flowLayout.minimumLineSpacing + (kCellCount / kLineCount) * self.itemH - kScreenH;
self.offsetTotal =
self.collectionView.contentOffset = CGPointMake(0, offset);
/** 每次进入游戏将红块重置为白块 -& 刷新collectionView */
[self.collectionView reloadData];
[UIView animateWithDuration:0.5 animations:^{
self.mainView.alpha = 0;
#pragma mark - 初始化布局参数
-(void)initFlowLayout{
self.flowLayout.minimumLineSpacing = 1;
self.flowLayout.minimumInteritemSpacing = 0; //cell最小间距
CGFloat itemH = (kScreenH - (kLineCount -1) * self.flowLayout.minimumLineSpacing) / 4;
self.itemH = itemH;
self.flowLayout.itemSize = CGSizeMake((kScreenW / kLineCount) - 1,itemH);
//偏移量 = (行数 - 1) * 行间距 + 行数 * 每个cell高度 - 屏幕高度
CGFloat offset = (kCellCount / kLineCount - 1) * self.flowLayout.minimumLineSpacing + (kCellCount / kLineCount) * itemH - kScreenH;
self.offsetTotal =
self.collectionView.contentOffset = CGPointMake(0, offset);
self.collectionView.showsVerticalScrollIndicator = NO;
self.collectionView.bounces = NO; //取消弹簧效果
self.collectionView.scrollEnabled = NO; //取消滚动
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
写完才明白想了那么多遍没想到会遇到的问题.有想法就动手.
最简单最实用的也就是系统的方法,当cell被干掉的时候调用的方法,直接判断黑色的cell是否被干掉即可.其他没什么难度毕竟就一个collectionView而已.
源代码demo下载地址: