• 4096!——化简的2048游戏


    游戏介绍:

    这个能轻松到达 4096. 所以取名为 4096了。

    github地址是:https://github.com/chilly/4096

    假设想直接玩游戏訪问 4096.chillyc.info


    这个4096 是直接copy的2048。 这个游戏须要消耗比較多的脑力。当然费了脑力还要拼拼运气。

    原因在于生成随机方块的地方90%会生成2,10%会生成4. 最后一搏的那个方块非常有可能会由于2。4生成的问题导致游戏失败。


    为什么要做这个游戏

    这个原因事实上是为让LP打到更高的分数。当然还要有些难度。不能移动一个方块瞬间就变成8192。

    还得让LP不能由于运气不佳挂掉。戴着枷锁跳呀跳。所以直接改了2048的源代码。


    2048这款游戏怎么做的?

    事实上非常细节的,我也没有细致的研究。

    2048这个游戏代码量不大。最基本的两个类是game_manager.js 和 grid.js。游戏的主要流程:

    1. 界面接收到keyboard的请求
    2. 交给game_manager的move函数
    3. 推断游戏是否失败
    4. merge tile(也就是merge 色块) 
    5. move tile 
    6. 最后生成在随机的位置生成随机的 tile(2或者4)
    7. 继续监听keyboard请求


    怎么做4096这款游戏

    做这款游戏的重点是要去除霉运。添加好运

    以下做了几点优化点:

    1. 真没有什么能够优化的点时,对4产生的概率添加一下。提高到50%。简单暴力

    2. 生成的2须要在2旁边,生成的4须要在4旁边:例如以下图:

    在2旁边生成2

    在4旁边生成4


    3. 误操作导致最大值移动。

    在误操作时须要弹个框帮助用户确认。

    只是为了不要频繁的弹窗,在最大值大于512后才開始提示。这里的算法是推断最大值是否有移动。假设移动,是否会移入到四个角。

    是否是在边界处移动。而非向内部移动。


    4. 随机生成的色块,能够帮助某些值merge.这里比較tricky的地方。假设某个比較大的两个值须要merge, 可是这两个值差了一个空格。那么就在对应的地方补上2、4。使得这两个比較大的值能够merge。

    比例如以下图中的两个32色块:

    这个图中向左移动后,32和32会移动到左边。那么第二行的32的右边出现小方块,那么下一次向右移动,32就有机会和32合并。

    例如以下图所看到的:

    然后继续右移,32能够和32合并了:



    5. 在最空旷的地方生成2/4. 这个比較简单就是找4联通最大的空白所在的点。然后将此点设置为2、4。

    例如以下图所看到的:



    再次优化

    当然,经过这系列优化之后。难度有所减少。但不意味着你不动脑筋能够玩到4096. 另外另一些值得优化的点。

    1. 比如第5点,在这一点中,须要生成的色块不应该和最大值在一条直线上。
    2. 另外还须要做的优化就是:假设你一直左右移。非常有可能有一个状态导致无法再左右移动。那么就须要上下移动。这种带来的问题就是最大色块一定会脱离原有的边界。这种移动极有可能导致整个游戏挂掉。所以须要对这一状态进行优化。

    3. 在手机上玩这款游戏。事实上灵敏度是个问题。总感觉慢了半拍(性能上还有值得优化的点)
    4. 在某一个状态,最大值一定在边界上,但不是在四个角。那么最好的情况是能够将最大值移入到四个角中。假如一直是左右移动变为的这个状态。最大值和次大值都都在底线上。之后的步骤一定要让最大值所在的色块不能向上移动。而其它的底线色块能够向上移动。这样上移后,底线就仅仅有最大值。然后再次左右移动就能够将最大值放入到边角中。假设这时随机生成色块,非常有可能次大值等再也无法移回底线。

      所以这种状态也须要优化。

       



    结束了吗?

    这些优化会在以后慢慢放出来。

    如今游戏中bug有些多。像这种游戏也不知道怎么做自己主动化測试的。。

    。。。。慢慢做吧。

    以下是黑PM的时间:PM们,你们能走查到 8192 这个状态吗? 。

    。。。。

    算了,你们努力走查到1024就能够公布了吧~

  • 相关阅读:
    分页存储过程
    调存储过程
    winform httplicent调用API
    存储过程,触发器,等等。。。
    C# AJAXform上传图片
    Mysql order by与limit联用出现的问题
    将Sublime Text 3 放到右键中
    Vue-cli构建步骤
    Javascript面试知识点
    position详解
  • 原文地址:https://www.cnblogs.com/yxwkf/p/5304805.html
Copyright © 2020-2023  润新知