android仿淘宝刮刮卡功能实现

简介:

去年淘宝和天猫的活动搞的有声有色的,其中有一个游戏还是很受大家欢迎的,那就是红包刮刮卡,自己也挺迷的,一刮起来就停不下来,有没有?

最近自己也在学习android入门,正好前些日子在搜索一个功能示例的时候,找到一个哥们分享的一篇介绍刮刮卡的文章,文章很简单,基本没有废话,直接贴了如何通过自定义view来实现刮刮卡的示例代码,链接如下:

http://www.cnblogs.com/xinye/p/3616095.html

 

后来又借着给大家分享android开发入门知识的机会,以这个示例为主要功能参考,并主要仿照天猫红包刮刮卡的外观样式和交互功能,做了一个还算功能齐全的示例,因为主要是为了讲解,所以特意把注释标注的比较完整,大家可以通过下面的链接到我共享的列表中下载示例源码:

https://github.com/yangguilin/GuaGuaLe

 

下面简单分析一下,实现刮刮卡功能的几点关键知识点:

1. 自定义一个View子类(TextView当然也可以,俺就是用得TextView做父类),并且重写下面几个主要方法:

(1) 构造函数

(2)视图绘制方法:protected void onDraw(Canvas canvas)

(3) 触屏事件处理方法:public boolean onTouchEvent(MotionEvent event)

 

2. 第一步中的三个方法是主要且必须的三个方法,接下来,在构造函数中,需要添加初始化刮刮卡视图的功能,该功能可以分解为以下几个关键步骤:

(1) 设置视图背景图片:因为涉及到随机变换的是否中奖的图片,所以意味着这个背景需要通过canvas来操作bitmap来做一次简单的绘制,首先为bitmap设置一种背景色,然后再通过canvas将得到的,需要显示的图片,根据具体的尺寸比例,画到bitmap中即可。

(2) 视图背景搞定后,接下来要搞定的就是刮刮卡的涂层,也就是咱们能用手指划掉的那一层,原理基本类似于背景,首先创建一个topBitmap,然后将该topBitmap载入到一个Canvas中进行编辑,为该topBitmap添加一层灰色的背景色,然后再通过定义一个画笔,再在该topBitmap上绘制上提示文字“请刮开涂层”,这样刮刮卡的所谓上下两层均已经定义完毕。

(3) 接下来,需要定义一只手指划到涂层时,来绘制透明色的画笔,其工作原理主要就是,通过调用默认的触屏事件 + 视图自动绘制,来实现所谓的手指刮开涂层的操作。(这部分也是不太容易理解的,或许是我说不清楚,总之看代码注释吧,会比较清楚)

(4) 此外,如何实现当手指划开大部分背景图片时,自动去除全部涂层,说来也挺简单,不排除有更完美的处理方案,俺用的是关键点法,即定义若干(示例中定义了9个)关键点,分布于待显示的背景图的主要区域,然后在每一次判断手指滑动的事件的同时,顺便检查是否有大多数的关键点的颜色值已经变为了透明(颜色值为0,即已被刮开),如果是,则通过canvas直接将topBitmap的颜色统一设置为透明色即可。

(5) 针对不同尺寸的android手机,如何做到显示一致?这也是一个后期的主要问题,因为前期通过不断调试,设定的一些尺寸,都是基于调试机的,既然要在各种不同版本、品牌的机器上运行,那么适配就是一个主要的问题,我是用了一种比较偷懒的方法,及将调试机的各项参数数据作为默认的参数,然后每次初始化的时候,都会获取当前屏幕的分辨率尺寸,然后与默认值的屏幕宽度进行比较,得到一个比例,然后在所有需要明确使用数值的地方,都乘以该比例,间接地达到了对试图缩放的目的。

 

最后,附上两张示例的截图:

Screenshot_2014-04-02-19-21-22    Screenshot_2014-04-02-19-21-43

 

Screenshot_2014-04-02-19-22-16     Screenshot_2014-04-02-19-21-51

相关文章
|
1月前
|
XML 缓存 Android开发
Android开发,使用kotlin学习多媒体功能(详细)
Android开发,使用kotlin学习多媒体功能(详细)
97 0
|
3月前
|
安全 Linux Android开发
Android 安全功能
Android 安全功能
37 0
|
6月前
|
安全 Android开发 开发者
Android 原生 Picture in Picture 画中画功能避坑指南(下)
Android 原生 Picture in Picture 画中画功能避坑指南(下)
100 0
|
4月前
|
XML 前端开发 Java
Android App实战项目之实现手写签名APP功能(附源码,简单易懂 可直接实用)
Android App实战项目之实现手写签名APP功能(附源码,简单易懂 可直接实用)
45 0
|
6月前
|
JavaScript Java 开发工具
Cocos Creator Android 平台接入 Google Firebase (Analytics功能)(二)
Cocos Creator Android 平台接入 Google Firebase (Analytics功能)
153 0
|
4月前
|
传感器 物联网 Android开发
【Android App】物联网中查看手机支持的传感器及实现摇一摇功能-加速度传感器(附源码和演示 超详细)
【Android App】物联网中查看手机支持的传感器及实现摇一摇功能-加速度传感器(附源码和演示 超详细)
62 1
|
4月前
|
XML Java 定位技术
【Android App】定位导航GPS中开启手机定位功能讲解及实战(附源码和演示 超详细)
【Android App】定位导航GPS中开启手机定位功能讲解及实战(附源码和演示 超详细)
113 0
|
4月前
|
XML 前端开发 Java
【Android App】三维处理中三维投影OpenGL功能的讲解及实战(附源码和演示 超详细必看)
【Android App】三维处理中三维投影OpenGL功能的讲解及实战(附源码和演示 超详细必看)
33 1
|
4月前
|
JSON 语音技术 Android开发
【Android App】在线语音识别功能实现(使用云知声平台与WebSocket 超详细 附源码)
【Android App】在线语音识别功能实现(使用云知声平台与WebSocket 超详细 附源码)
34 0
|
4月前
|
JSON Java 语音技术
【Android App】实现在线语音合成功能(使用云知声平台和WebSocket 超详细 附源码)
【Android App】实现在线语音合成功能(使用云知声平台和WebSocket 超详细 附源码)
43 0