备案控制台
探索云世界
开发者社区 开发与运维 文章 正文

仿刮刮乐刮奖效果

2014-07-28 1369
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： <div id="article_content" class="article_content"><span style="font-size:14px">该功能实现很简单，就是根据手指坐标位置在画板上画</span> <h1><a target="_blank" name="t0"></a><span style="color:#cc0000">1.效果图</span></h1
该功能实现很简单，就是根据手指坐标位置在画板上画

1.效果图

          

2.代码实现

[java] view plain copy 在CODE上查看代码片 派生到我的代码片
  1. public class ErinieShow extends RelativeLayout {  
  2.     Context context;  
  3.     RelativeLayout bg;  
  4.     MyView MyView;  
  5.     int level;  
  6.     public ErinieShow(Context context, int level) {  
  7.         super(context);  
  8.         this.context = context;  
  9.         this.level = level;  
  10.           
  11.         bg = new RelativeLayout(context);  
  12.         MyView = new MyView(context);  
  13.         bg.addView(MyView);  
  14.         addView(bg);  
  15.           
  16.         int[] resolution = PhoneUtil.getResolution(context);  
  17.         RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(  
  18.                 resolution[0], PhoneUtil.getFitHeight(context, 125));  
  19.   
  20.         bg.setId(100001);  
  21.         bg.setLayoutParams(params);  
  22.         MyView.setLayoutParams(params);  
  23.           
  24.         switch (level) {  
  25.         case 0:  
  26.             bg.setBackgroundResource(R.drawable.rewardlevel0);  
  27.             break;  
  28.         case 1:  
  29.             bg.setBackgroundResource(R.drawable.rewardlevel1);  
  30.   
  31.             break;  
  32.         case 2:  
  33.             bg.setBackgroundResource(R.drawable.rewardlevel2);  
  34.             break;  
  35.         default:  
  36.             bg.setBackgroundResource(R.drawable.rewardlevel3);  
  37.             break;  
  38.         }  
  39.           
  40.         MyView.init(Color.parseColor("#d3d3d3"), 30, 10);  
  41.     }  
  42. }  
[java] view plain copy 在CODE上查看代码片 派生到我的代码片
  1. public class MyView extends TextView {  
  2.   
  3.     private float TOUCH_TOLERANCE; // 填充距离，使线条更自然，柔和,值越小，越柔和。  
  4.     private Bitmap mBitmap;  
  5.     private Canvas mCanvas;  
  6.     private Paint mPaint;  
  7.     private Path mPath;  
  8.     private float mX, mY;  
  9.     private boolean isDraw = false;  
  10.     int time=0;  
  11.       
  12.     public MyView(Context context) {  
  13.         super(context);  
  14.     }  
  15.   
  16.     @Override  
  17.     protected void onDraw(Canvas canvas) {  
  18.         super.onDraw(canvas);  
  19.         if (isDraw) {  
  20.             mCanvas.drawPath(mPath, mPaint);  
  21.             canvas.drawBitmap(mBitmap, 0, 0, null);  
  22.         }  
  23.     }  
  24.   
  25.     /** 
  26.      * 开启檫除功能 
  27.      *  
  28.      * @param bgColor 
  29.      *            覆盖的背景颜色 
  30.      * @param paintStrokeWidth 
  31.      *            触点（橡皮）宽度 
  32.      * @param touchTolerance 
  33.      *            填充距离,值越小，越柔和。 
  34.      */  
  35.     public void init(final int bgColor, final int paintStrokeWidth,  
  36.             float touchTolerance) {  
  37.         TOUCH_TOLERANCE = touchTolerance;  
  38.         // 设置画笔  
  39.         mPaint = new Paint();  
  40.         // mPaint.setAlpha(0);  
  41.         // 画笔划过的痕迹就变成透明色了  
  42.         mPaint.setColor(Color.BLACK); // 此处不能为透明色  
  43.         mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));  
  44.         // 或者  
  45.         // mPaint.setAlpha(0);  
  46.         // mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));  
  47.   
  48.         mPaint.setAntiAlias(true);  
  49.         mPaint.setDither(true);  
  50.         mPaint.setStyle(Paint.Style.STROKE);  
  51.         mPaint.setStrokeJoin(Paint.Join.ROUND); // 前圆角  
  52.         mPaint.setStrokeCap(Paint.Cap.ROUND); // 后圆角  
  53.         mPaint.setStrokeWidth(paintStrokeWidth); // 笔宽  
  54.   
  55.         // 痕迹  
  56.         mPath = new Path();  
  57.         // 覆盖  
  58.         LayoutParams layoutParams = getLayoutParams();  
  59.         int height = layoutParams.height;  
  60.         int width;  
  61.         if (getLayoutParams().width == LayoutParams.MATCH_PARENT) {  
  62.             width = 700;  
  63.         } else {  
  64.             width = layoutParams.width;  
  65.         }  
  66.   
  67.         mBitmap = Bitmap.createBitmap(width, height, Config.ARGB_8888);  
  68.         mCanvas = new Canvas(mBitmap);  
  69.   
  70.         mCanvas.drawColor(bgColor);  
  71.         isDraw = true;  
  72.     }  
  73.   
  74.     @Override  
  75.     public boolean onTouchEvent(MotionEvent event) {  
  76.         if (!isDraw) {  
  77.             return true;  
  78.         }  
  79.         switch (event.getAction()) {  
  80.         case MotionEvent.ACTION_DOWN: // 触点按下  
  81.             // touchDown(event.getRawX(),event.getRawY());  
  82.             touchDown(event.getX(), event.getY());  
  83.             invalidate();  
  84.             break;  
  85.         case MotionEvent.ACTION_MOVE: // 触点移动  
  86.             touchMove(event.getX(), event.getY());  
  87.             invalidate();  
  88.             break;  
  89.         case MotionEvent.ACTION_UP: // 触点弹起  
  90.             touchUp(event.getX(), event.getY());  
  91.             invalidate();  
  92.             break;  
  93.         default:  
  94.             break;  
  95.         }  
  96.         return true;  
  97.     }  
  98.   
  99.     private void touchDown(float x, float y) {  
  100.         mPath.reset();  
  101.         mPath.moveTo(x, y);  
  102.         mX = x;  
  103.         mY = y;  
  104.     }  
  105.   
  106.     private void touchMove(float x, float y) {  
  107.         float dx = Math.abs(x - mX);  
  108.         float dy = Math.abs(y - mY);  
  109.         if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {  
  110.             mPath.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);  
  111.             mX = x;  
  112.             mY = y;  
  113.         }  
  114.   
  115.     }  
  116.   
  117.     private void touchUp(float x, float y) {  
  118.         mPath.lineTo(x, y);  
  119.         mCanvas.drawPath(mPath, mPaint);  
  120.         mPath.reset();  
  121.     }  
  122.   
  123. }  

源码下载http://download.csdn.net/detail/strawberry2013/7682865


文章标签：
前端开发
ctrip_xzh
目录
相关文章
小蜗牛耶
|
缓存 Linux
Centos7配置国内yum源和epel源
本篇内容记录了Centos7如何配置国内yum源和epel源。
小蜗牛耶
4761 0
问答收割机
|
3月前
|
弹性计算 Linux 数据安全/隐私保护
【阿里云幻兽帕鲁】搭建 密码 存档 使用 费用 常见问题合集
本文持续更新幻兽帕鲁玩家在阿里云上遇到的问题及解法。
问答收割机
59129 91
【阿里云幻兽帕鲁】搭建 密码 存档 使用 费用 常见问题合集
游客renxdt7j7326a
|
8月前
|
前端开发
如何用canvas实现刮刮乐自助
如何用canvas实现刮刮乐自助
游客renxdt7j7326a
38 0
大雄修斯
|
8月前
|
Java 数据库连接 数据库
解析Java中的MyBatis Plus注解 @FieldFill：优雅处理字段填充
在数据库操作中，有些字段的值在插入或更新时需要自动填充，比如创建时间、更新时间等。MyBatis Plus作为一款强大的ORM框架，提供了注解 `@FieldFill`，使得开发者能够更加灵活地处理字段的自动填充，从而减少了重复的代码编写。本文将详细介绍 `@FieldFill` 注解的用法及其在持久层开发中的应用。
大雄修斯
955 0
dotNative
|
Linux iOS开发 MacOS
IIS10 部署网站报【HTTP 错误 500.19 - Internal Server Error】的解决办法
原有的 web 发布文件是可以正常部署 IIS10 上面运行的，由于本地电脑环境迁移，重新换了一个宿主机部署 IIS10，网站运行提示如下信息：HTTP 错误 `500.19 - Internal Server Error` 无法访问请求的页面，因为该页的相关配置数据无效。详细错误信息:模块 `IIS Web Core` 通知 `未知 处理程序 尚未确定 错误...
dotNative
1476 0
IIS10 部署网站报【HTTP 错误 500.19 - Internal Server Error】的解决办法
zuoben
|
前端开发
刮刮乐，前端代码html+js实现，直接运行
刮刮乐，前端代码html+js实现，直接运行
zuoben
402 0
刮刮乐，前端代码html+js实现，直接运行
服务支持
|
流计算 Serverless Java
阿里云活动奖品大盘点（长期更新）
2024.1.4号 更新： 1、ACA/ACP考试折扣
服务支持
156129 15
阿里云活动奖品大盘点（长期更新）
小生生
|
弹性计算 Linux Shell
云服务器ECS 云盘缩容教程步骤来啦！
由于目前云服务器ECS不支持系统盘或者数据盘缩容，如果您有云盘缩容的需求，可用通过阿里云迁云工具达成目的。
小生生
2718 0
云服务器ECS 云盘缩容教程步骤来啦！
唐僧0929
|
存储 固态存储 虚拟化
新一代服务器预览：M.2 SSD系统盘RAID1方案
Xeon Processor Scalable服务器上的“BOSS”是啥？
唐僧0929
3319 0
阿里云瑶池数据库
|
7天前
|
NoSQL Cloud Native Redis
Redis核心开发者的新征程：阿里云与Valkey社区的技术融合与创新
阿里云瑶池数据库团队后续将持续参与Valkey社区，如过往在Redis社区一样耕耘，为开源社区作出持续贡献。
阿里云瑶池数据库
143167 5
Redis核心开发者的新征程：阿里云与Valkey社区的技术融合与创新

热门文章

最新文章

  • 1
    疑犯追踪第一季/全集Person Of Interest迅雷下载
  • 2
    【直播系列之一】1篇文章看懂峰值带宽、流量、转码、连麦、截图五大直播计费方式
  • 3
    理解事务的4种隔离级别
  • 4
    阿里云网站域名备案流程全过程讲解(图文)
  • 5
    在服务器的raid1中安装windows server系统（踩坑记录）
  • 6
    如何用Vue实现简易的富文本编辑器，并支持Markdown语法
  • 7
    怎么才能快速提高小程序留存率！
  • 8
    程序员请放下浮躁的心
  • 9
    如何解决域中普通用户只限于10台客户机加入域的数量问题
  • 10
    博客园模板 样式优化
  • 1
    未来技术纵横谈：区块链、物联网与虚拟现实的融合与创新
    34
  • 2
    软件体系结构 - 缓存技术（9）缓存穿透
    30
  • 3
    提升Android应用性能的实用技巧
    31
  • 4
    工具变量法(两阶段最小二乘法2SLS)线性模型分析人均食品消费时间序列数据和回归诊断（下）
    32
  • 5
    软件体系结构 - 缓存技术（8）缓存雪崩
    35
  • 6
    软件体系结构 - 缓存技术（7）Redis持久化方法
    36
  • 7
    Python用KShape对时间序列进行聚类和肘方法确定最优聚类数k可视化
    24
  • 8
    软件体系结构 - 缓存技术（6）淘汰策略
    31
  • 9
    基于R语言股票市场收益的统计可视化分析
    33
  • 10
    软件体系结构 - 数据分片（2）一致性哈希分片
    35

    • 相关电子书

    更多
  • 低代码开发师（初级）实战教程
  • 冬季实战营第三期：MySQL数据库进阶实战
  • 阿里巴巴DevOps 最佳实践手册
    • 下一篇
    部署LAMP环境（Alibaba Cloud Linux 3）