WP8下实现刮刮乐(橡皮擦)功能
说到刮刮乐这个功能,我们最先想到的是上下两张(长方形)重叠,之后对上面这张图片进行操作。
我的想法是:通过手势,让手指划过的地方变成透明的,底部就会显示了。
那如何让图片变为透明呢?这就要对图片的像素进行处理了。
首先,图片的像素是一个int型数组:int[], 此数组长度为图片高(像素)*宽(像素)
比如:一张图片的高宽为200pixel、400pixel,那么这个数组为int[80000]
对于每一个元素,官方文档说都是ARGB32[预乘RGB24] (A指的是Alpha通道 控制透明度的)
256级(0-255)的RGB色彩总共能组合出约1678万种色彩,即256×256×256=16777216
即每一个元素都为:(-1:白色)----- (-16777216:黑色) 0或其他正值时为透明色
通过
originalWb = new WriteableBitmap(bitmapImage);
我们获取到是一维数组,为了便于操作,我们将其转换为二维数组。
for (int i = ; i < iOriginalHeight; i++) //图片高
{
for (int j = ; j < iOriginalWidth; j++) //图片宽
{
pixelTwo[i, j] = originalWb.Pixels[i * (iOriginalWidth) + j];
}
}
之后我们在手势触摸后,我们就要处理像素了

如图所示:假设我们length=1(指的触摸后的大小吧)
如果我们选中的是红色那个位置,我就要将包括红色像素边上的距离为1的像素组成的正方形(绿色位置)变为透明
我们可以获取到绿色范围的开始结束行和列。
之后只要改变那个像素的颜色就行了。
originalWb.Pixels[(i * iOriginalWidth) + j] = ;//获取到的周边某个像素的下标为(i * l) + j
最后赋值给图片
下面给出WP8下的demo:记住:需要联网下载一张图片
PS:但是效果不是非常的好,由于使用的是正方形(可惜writeablebitmap没有WPF下的一些方法)
如果有更好的方法,希望能告诉我!
WP8下实现刮刮乐(橡皮擦)功能的更多相关文章
- vue 刮刮乐功能实现
<template> <!--游玩区域--> <div class="panel"> <canvas id="canvas&qu ...
- 游戏的套路你知道吗? H5 Canvas刮刮乐
玩游戏的人 很多时候都会遇到翻牌子 开宝箱. 总有人傻傻的在哪里还纠结很久到底点哪一个! 纠结 指不定翻哪一个会多一点,你明明看到那个卡片的奖项多 . 那我就告诉你好了 其实很多时候在你点开那个 ...
- [cocos2d-js]cc.RenderTexture几种用法(数字图片、刮刮乐效果)
[转]http://blog.csdn.net/realcrazysun1/article/details/42393629 本文基于cocos2d-js 3.0版本引擎开发 RenderTextur ...
- H5 Canvas刮刮乐
玩游戏的人 很多时候都会遇到翻牌子 开宝箱. 总有人傻傻的在哪里还纠结很久到底点哪一个! 纠结 指不定翻哪一个会多一点,你明明看到那个卡片的奖项多 . 那我就告诉你好了 其实很多时候在你点开那个 ...
- canvas刮刮乐
这周有点迷茫,不知道干嘛了,一天天就过去了!我在博客右侧公告栏加了qq交流,各位有好的主题,或者有趣的技术,欢迎交流!今天突发奇想,就写了2个h5 canvas的demo玩玩! demo一:刮刮乐 舍 ...
- 20行js代码制作网页刮刮乐
分享一段用canvas和JS制作刮刮乐的代码,JS部分去掉注释不到20行代码效果如下 盖伦.jpg 刮刮乐.gif HTML部分 <body>  &l ...
- Android 撕衣服(刮刮乐游戏)
项目简单介绍: 该项目为撕衣服,相似刮刮乐游戏 具体介绍: 用户启动项目后.载入一张图片,当用户点击图片的时候,点击的一片区域就会消失.从而显示出在这张图片以下的图片 这个小游戏相似与刮奖一样,刮开涂 ...
- HTML5 CSS3 诱人的实例 :canvas 模拟实现电子彩票刮刮乐
转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/34089553 今天给大家带来一个刮刮乐的小例子~基于HTML5 canvas的, ...
- 用Canvas画一个刮刮乐
Canvas 通过 JavaScript 来绘制 2D图形.Canvas 是逐像素进行渲染的.开发者可以通过javascript脚本实现任意绘图.Canvas元素是HTML5的一部分,允许脚本语言动态 ...
随机推荐
- [bootsrap]模态框使用例
<a href="#modal1" role="button" class="btn btn-primary btn-sm" data ...
- Excel自文本导入内容时如何做到单元格内换行
前言:今天在处理数据的时候,在数据库中用到了\n换行符号,目的是在同表格内做到数据多行显示,比如 字段名1 字段名2 字段名3 1 数据一行 数据二行 数据三行 例子是在sql查询后的结果 ...
- CI连接多个数据库
参考http://codeigniter.org.cn/user_guide/database/connecting.html手册 首先,在database.php中设置多个数据库的连接信息,这里命名 ...
- JS实现类似QQ好友头像hover时显示资料卡的效果
一.应用场景 鼠标hover弹出div,并且鼠标离开后不能马上隐藏,因为这个div上还有功能入口.比如: 鼠标经过好友列表中的好友头像时显示资料卡的效果 hover时显示二维码 二.实现 用如下这样一 ...
- pacemaker+corosync/heartbeat对比及资源代理RA脚本
一.Pacemaker概念 (1)Pacemaker(心脏起搏器),是一个高可用的群集资源管理器.它实现最大可用性资源管理的节点和资源级故障检测和恢复,通过使用首选集群基础设施(Corosync或He ...
- C#学习笔记-输入数据判断(int、double、string)
代码: using System; using System.Windows.Forms; namespace CheckInput { public partial class Form1 : Fo ...
- 一个开关电源传导、辐射处理案例-----Layout环路
这是一款输入宽电压120-277V 60HZ,输出48V,273mA的电源,使用美芯晟MT7933,采用Buck拓扑结构. 注:在最初的设计中,预留电感L1.L2,CBB电容C1.C2作为传导测试元 ...
- hdu-5977 Garden of Eden(树分治)
题目链接: Garden of Eden Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/ ...
- Vector3.forward
这里我要说的就是Vector3.forward ,它等价与 new Vector3(0,0,1):它并不是一个坐标,它是一个标准向量,方向是沿着Z轴向前.这样平移一次的距离就是1米, 如果 Vecto ...
- Python-06-面向对象(基础篇)
面向对象编程--Object Oriented Programming,简称OOP,是一种程序设计思想.OOP把对象作为程序的基本单元,一个对象包含了数据和操作数据的函数. 面向过程的程序设计把计算机 ...