设计一个简单的游戏界面.java_分享一下自己写的2048游戏(3*3,4*4,5*5,6*6多种玩法,可反悔)...

2048是一款非常常见的小游戏,所以我也想自己尝试着写一款,给自己练练手。说道练手,这里需要交代一下:我从事Android的工作刚刚一年,平时的工作主要是客制化UI和修改Bug,也就是这里改改,那里改改,因此,完整的开发项目的机会比较少,所以,对我而言,想要提高自己的编程水平,抽出时间自己做一些小项目是有意义的。虽然平时的工作主要是客制化UI和修改bug,但并不意味这我的工作是简单枯燥的,我时常会遇到系统中的一些bug,这样我有机会阅读android系统的源码,并从中分析问题出现的原因,这份工作对我而言非常有挑战性。。。

游戏展示

废话有点多,原归正转,其实当我写这篇博客的时候,这款游戏已经写的差不多了,大概花费了两周时间,当然这两周中,时间是自己挤出来的,因为还有工作要做。下面就展示一下这款游戏的界面吧:

游戏的启动界面:

920645375d08bdafbd488ba2ad4c3a64.gif

游戏的操作界面:

01dd797d57fafbfd1cec82c7215c6f47.gif

42584722845f9836cbfc70310ef189a8.gif

这些UI都是自己一个人弄的,没有找专业的美工美化,所以界面难免有点丑。背景的那张图片是我百度到的,就是凑个那么点意思。启动画面有没有不太协调??

后续,我会把这款游的游戏的算法,界面开发过程中遇到的问题,自定义UI(比如自定义Dialog,ProgressBar)等做一个回顾,算是不枉忙活这么久吧,感兴趣的盆友们可以关注下。(都是些基本知识,大神请绕道!)。

游戏的设计思路

如果对怎么写2048游戏感兴趣的话,可能会有兴趣看一下这款游戏的代码。这款游戏是一个小游戏,代码比较简单,但是看别人的代码总是一件头疼的事情,因为你必须去揣摩写代码的人的思想。所以,我这里对这份代码的设计思路做一个简单的介绍。

2048游戏是一个数字消除类益智游戏。它的典型界面如下:

718afcef8a2837a851a01c68cd9dd957.png

Number

其中的数字就由一个Number类表示,很多个数字的管理有Numbers类实现,Number类有如下属性:

public int mScores;

public int mCurPosition;

public int mBeforePosition;

public boolean isNeedMove;

public boolean isNeedCombine;

mScores就是这个数字的值,其他四个变量都用来控制这个数字的移动与合并。所以,如果淡出写一个没有动画的2048的话,事情就简单多了,因为动画的控制会比较麻烦一点。

Numbers

Numbers类就是管理着一个mNumbers 数组,这个数组由玩家选择的游戏模式决定,玩家可以选3*3,4*4,5*5,6*6中的一种,对应的这个数组的大小也为如此。

Numbers类如下:

Number [][] mNumbers = new Number[Game2048StaticControl.gamePlayMode][Game2048StaticControl.gamePlayMode];

public Numbers(){

for(inti=0;i

for(intj=0;j

mNumbers[i][j] = new Number(0,0);

}

}

}

...

Game2048Algorithm

算法类中的所有算法都是针对Numbers对象实现的,也就是算法只对Numbers对象负责,这样思路更加清晰。算法类会实现Numbers整体移动、合并等操作。

以上就是游戏算法的整体思路,对于确切的算法实现,后续再做介绍。

游戏界面设计

下面介绍下游戏界面的设计思路:

游戏启动

涉及两个文件:StartActivity.java,StartAniSurfaceView.java

从名字中就可以看到,启动的动画是一个SurfaceView了,具体的布局思路是SurfaceView绘制启动动画,同时下面放置一个无限循环的进度条显示游戏在加载。

画面中的动画模仿了焰火的效果,不断的喷出2048四个数字,数字的大小颜色都是在一定范围内随机生成的,进度条还有待改进,目前的看起来还是很丑。

b0117e1c6f38d8d62f87de924c321c19.png

游戏的主界面

涉及三个个文件:GameModeChoiceActivity.java,GameModeChoiceBodyFragment.java,GameModeChoiceHeaderFragment.java

游戏的主界面由两个Fragment组成,一个Header,一个是body,当选中Header的一个条目时,body会显示相应的预览图。

当时的设计思路:

72c62ee3fe29623090b3047925ccc664.png

做出来的效果做了些许调整:

dc729f2136be581529a18d7ba70557f2.png

游戏界面

游戏界面的UI主要涉及MainActivity.java,GameSurfaceView.java,GameSurfaceViewHelper。java,DrawTool.java。

GameSurfaceViewHelper.java的出现是因为GameSurfaceView.java中的绘制逻辑比较复杂,把其中一部分拿出来放到Helper中,为GameSurfaceView减压,很多的绘制方法都在DrawTool.java中实现。绘制过程中遇到的算法在Game2048Algorithm.java文件中。

比如3*3的界面如下:

bd5e50c6c096c5c39a6bd2f85af553ba.png

游戏的设置界面

游戏的设置界面非常简单,就是一个GameSettingsActivity.java。

abb7bccaf5a85788380887558cdd648d.png

对话框

游戏中用到的对话框我对使用了自定义的,依然采用的是半透明的设计,比如,游戏推出询问对话框:

7d446318ad01732665ef088c91ac1faa.png

此外,游戏胜利和失败后都会弹出对话框,选择具体游戏模式后也会弹出对话框询问是否可反悔,可见对话框的应用还是很多的。

通过以上对UI设计思路和游戏算法的设计思路的介绍,后续会对具体的环节做进一步分析,感兴趣的可以关注下!

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值