最近在朋友圈，朋友转了一个html小游戏【壹秒】，游戏的规则是：用户按住按钮然后释放，看谁能精准地保持一秒的时间。^_^刚好刚才在linux服务器上调试程序的时候服务器挂了，腾出点时间分享下前天自己做的这个小游戏。

话不多说，直接上图：

呐，作为一个对android无比热爱的小伙伴，腾出一个小小时间做一个小小的小游戏，也不失为一种享受哈。整个游戏比较简单，主要分为UI设计与开发和时间计算逻辑。当然，这个小游戏界面要做得漂亮点，所以我侧重讲下UI设计与开发。

UI设计与开发

采用RelativeLayout相对布局来控制整个界面比较灵活。基本的布局相信对你们来说都很easy，都是简单的排版。主要在于按住“按住”按钮之后怎么实现布局变长，这里提一下。我的思路是显示秒数布局一开始包含了全部所需要的空间，这个布局采用高度随内容增长，然后写一个高度10dp的view把高度撑起来，然后其他直接隐藏，后面根据逻辑直接显示就好。

下面是我的xml布局代码

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical"android:background="#ffffff"><!--   android:background="@drawable/bg"--><!--    <TextViewandroid:layout_width="match_parent"android:layout_height="50dp"android:text="one second game，ready GO！"android:textSize="22sp"android:gravity="center"android:textColor="#ffffff"android:background="#000000"/>--><LinearLayoutandroid:id="@+id/linearLayout"android:layout_marginTop="30dp"android:layout_width="fill_parent"android:layout_height="wrap_content"android:orientation="horizontal"><TextViewandroid:id="@+id/tip_l"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:text="你的"android:textSize="50sp"android:gravity="right"android:textColor="#666666"android:textStyle="bold"/><TextViewandroid:id="@+id/tip_r"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1.3"android:text="一秒钟"android:textSize="50sp"android:textColor="#FF3333"android:gravity="left"android:textStyle="bold"/></LinearLayout><TextViewandroid:layout_marginTop="3dp"android:id="@+id/tip_b"android:paddingLeft="8dp"android:layout_below="@+id/linearLayout"android:layout_width="fill_parent"android:layout_height="wrap_content"android:text="到底有多长？"android:textSize="40sp"android:textColor="#666666"android:textStyle="bold"android:gravity="center"/><TextViewandroid:layout_marginTop="15dp"android:id="@+id/tip_e"android:layout_below="@+id/tip_b"android:layout_width="fill_parent"android:layout_height="wrap_content"android:text="How long is one second？"android:textSize="15sp"android:textColor="#666666"android:textStyle="bold"android:gravity="center"/><LinearLayoutandroid:layout_below="@+id/tip_e"android:id="@+id/show_linearlayout"android:layout_marginLeft="50dp"android:layout_marginRight="50dp"android:layout_marginTop="3dp"android:layout_width="fill_parent"android:layout_height="wrap_content"android:background="@drawable/show"android:orientation="vertical"><TextViewandroid:layout_width="fill_parent"android:layout_height="10dp"/><LinearLayoutandroid:layout_marginTop="10dp"android:id="@+id/show_result"android:layout_width="fill_parent"android:layout_height="wrap_content"android:orientation="horizontal"android:visibility="gone"><TextViewandroid:id="@+id/show_result_l"android:layout_width="0dp"android:layout_weight="1.7"android:layout_height="wrap_content"android:gravity="right"android:textColor="#CC9933"android:textSize="40sp"/><TextViewandroid:layout_marginLeft="3dp"android:id="@+id/show_result_r"android:text="秒"android:gravity="left"android:layout_width="0dp"android:layout_weight="1"android:layout_height="wrap_content"android:textColor="#ffffff"android:textSize="25sp"/></LinearLayout><TextViewandroid:paddingLeft="30dp"android:paddingRight="30dp"android:layout_marginTop="5dp"android:gravity="center"android:id="@+id/show_remark"android:layout_width="fill_parent"android:layout_height="wrap_content"android:visibility="gone"android:textColor="#ffffff"android:textSize="15sp"android:layout_marginBottom="20dp"/></LinearLayout><Buttonandroid:layout_below="@+id/show_linearlayout"android:layout_centerHorizontal="true"android:background="@drawable/button"android:layout_marginTop="20dp"android:id="@+id/cul_bt"android:layout_height="120dp"android:layout_width="120dp"android:layout_gravity="center_horizontal"android:gravity="center"android:text="按住"android:textColor="#ffffff"android:textSize="30sp"/>
</RelativeLayout>

在UI界面中，为了更加美化加入了特殊字体。我加的是“方体卡通”和“华文彩云”字体。在android中显示特殊字体的方法是：如果你的IDE是eclipse，那么直接放在assets中（方法在此我不多介绍），我的IDE是android studio，如果你的IDE和我是一样的，可以使用以下方法：

首先在app→src→main目录下新建assets包，然后在自己项目的.iml文件中添加

<option name="ASSETS_FOLDER_RELATIVE_PATH" value="/src/main/assets" />

之后在自己的代码中进行引用

private Typeface fangtikatong,huawencaiyun;//方体卡通，华文彩云

// 将字体文件保存在assets目录下，www.linuxidc.com创建Typeface对象
fangtikatong = Typeface.createFromAsset(getAssets(),"fangtikatong.ttf");
huawencaiyun = Typeface.createFromAsset(getAssets(),"huawencaiyun.TTF");
result_r.setTypeface(fangtikatong);
tip_l.setTypeface(huawencaiyun);

时间计算逻辑

时间计算逻辑比较简单，首先对按钮实现触摸监听，设置两个变量记录手摁下那一刻和离开那一刻（同个触摸过程）的系统时间，后者减去前者再进行单位换算就可以算出手触碰的持续时间。

代码如下：

click_cl.setOnTouchListener(new View.OnTouchListener() {@Overridepublic boolean onTouch(View v, MotionEvent event) {if(event.getAction() == MotionEvent.ACTION_DOWN){x1 = (long)System.currentTimeMillis();//show = new StringBuffer("第一次按下"+'\n'+x1+'\n');}if(event.getAction() == MotionEvent.ACTION_UP){x2 = (long)System.currentTimeMillis();if(result_l.getVisibility() == View.GONE ||result_l.getVisibility() == View.GONE ||remark.getVisibility() == View.GONE ){result.setVisibility(View.VISIBLE);result_l.setVisibility(View.VISIBLE);result_r.setVisibility(View.VISIBLE);remark.setVisibility(View.VISIBLE);}num = (x2-x1)*1.000/1000;result_l.setText(num+"");//小于或等于1的先乘以1000再除以200if(num <= 1){remark.setText(remarks[(int)((num*1000)/200)]);//大于1的先乘以1000再除以200}else{remark.setText(remarks[(int)((num*1000+200)/200)]);}}return true;}});

到此，整个小游戏基本开发完成，是不是也挺简单的呢？

热爱android的你们，空闲的时候也可以尝试开发自己的小游戏呢？

CSDN游戏代码下载：一秒游戏源码

github游戏代码下在：一秒游戏源码

最近微信上很火的小游戏【壹秒】android版——开发分享相关推荐

微信小游戏直播在Android端的跨进程渲染推流实践
本文由微信开发团队工程师"virwu"分享. 1.引言近期,微信小游戏支持了视频号一键开播,将微信升级到最新版本,打开腾讯系小游戏(如跳一跳.欢乐斗地主等),在右上角菜单就可以看 ...
python如何写生日快乐说说_抖音上很火的生日句子，适合过生日发的高逼格
抖音上很火的生日时发的句子,还有给自己生日的高逼格祝福,码起来,迟早会用到. 抖音上很火的生日句子,适合过生日发的高逼格祝福: 1. 没有零点的生日祝福没有煽情的语录感恩所有都是馈赠和成长祝自 ...
抖音上很火的3D立体动态相册
带背景音乐网站效果: http://www.fengzhao.icu/photos/html/%E6%8A%96%E9%9F%B3%E4%B8%8A%E5%BE%88%E7%81%AB%E7%9A%8 ...
基于Java语言在窗体上实现飞机大战小游戏
全套资料下载地址:https://download.csdn.net/download/sheziqiong/85594271 项目介绍飞机大战:用 Java 语言在窗体上实现飞机大战小游戏,运行程 ...
android 字符画,抖音上很火的字符画 Android 实现 | 视频转换实现
作者:Line_cut_feng 链接:https://www.jianshu.com/p/a14f1ac558e1 之前我推送过抖音上很火的字符画 Android 实现,当时文末:按说拿到ascii ...
抖音高贵气质的签名_抖音上很火的个性签名女生,抖音个性签名女有气质
抖音上很火的个性签名女生,抖音个性签名女有气质 1.坠入爱河有什么意义?放弃一群男人,一个男人,我什至会想不到! 2.我还年轻,需要您的指导.我会谦虚地接受并纠正它,但是我永远不需要您的指导. 抖音上 ...
最近分享一款抖音上很火的七夕节程序员表白页面_html5七夕表白放烟花动画特效...
html5七夕表白放烟花动画特效最近分享一款抖音上很火的七夕节程序员表白页面.小姐姐,我好喜欢你,你愿意做我女朋友吗? 表白成功触发烟花背景动画特效. 表白内容:有人说,人的一生会遇到2920万人, ...
最近分享一款抖音上很火的七夕节程序员表白页面_html5七夕表白放烟花动画特效
html5七夕表白放烟花动画特效最近分享一款抖音上很火的七夕节程序员表白页面.小姐姐,我好喜欢你,你愿意做我女朋友吗? 表白成功触发烟花背景动画特效. 表白内容:有人说,人的一生会遇到2920万人, ...
vue+netty+redis微信猜数对战小游戏
vue+netty+redis微信猜数对战小游戏 GITHUB 需求列表微信登录每小时一次领取积分1000 分享给好友赢1000积分,每微信账号一次积分小于-10000不可进行游戏排行榜ran ...

最近微信上很火的小游戏【壹秒】android版——开发分享

UI设计与开发

时间计算逻辑

最近微信上很火的小游戏【壹秒】android版——开发分享相关推荐

最新文章

热门文章