说到刮刮乐这个功能,我们最先想到的是上下两张(长方形)重叠,之后对上面这张图片进行操作。

我的想法是:通过手势,让手指划过的地方变成透明的,底部就会显示了。

那如何让图片变为透明呢?这就要对图片的像素进行处理了。

首先,图片的像素是一个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下实现刮刮乐(橡皮擦)功能的更多相关文章

  1. vue 刮刮乐功能实现

    <template> <!--游玩区域--> <div class="panel"> <canvas id="canvas&qu ...

  2. 游戏的套路你知道吗? H5 Canvas刮刮乐

    玩游戏的人 很多时候都会遇到翻牌子  开宝箱. 总有人傻傻的在哪里还纠结很久到底点哪一个! 纠结  指不定翻哪一个会多一点,你明明看到那个卡片的奖项多 . 那我就告诉你好了  其实很多时候在你点开那个 ...

  3. [cocos2d-js]cc.RenderTexture几种用法(数字图片、刮刮乐效果)

    [转]http://blog.csdn.net/realcrazysun1/article/details/42393629 本文基于cocos2d-js 3.0版本引擎开发 RenderTextur ...

  4. H5 Canvas刮刮乐

    玩游戏的人 很多时候都会遇到翻牌子  开宝箱. 总有人傻傻的在哪里还纠结很久到底点哪一个! 纠结  指不定翻哪一个会多一点,你明明看到那个卡片的奖项多 . 那我就告诉你好了  其实很多时候在你点开那个 ...

  5. canvas刮刮乐

    这周有点迷茫,不知道干嘛了,一天天就过去了!我在博客右侧公告栏加了qq交流,各位有好的主题,或者有趣的技术,欢迎交流!今天突发奇想,就写了2个h5 canvas的demo玩玩! demo一:刮刮乐 舍 ...

  6. 20行js代码制作网页刮刮乐

    分享一段用canvas和JS制作刮刮乐的代码,JS部分去掉注释不到20行代码效果如下 盖伦.jpg 刮刮乐.gif HTML部分 <body> ![](img/gailun.jpg) &l ...

  7. Android 撕衣服(刮刮乐游戏)

    项目简单介绍: 该项目为撕衣服,相似刮刮乐游戏 具体介绍: 用户启动项目后.载入一张图片,当用户点击图片的时候,点击的一片区域就会消失.从而显示出在这张图片以下的图片 这个小游戏相似与刮奖一样,刮开涂 ...

  8. HTML5 CSS3 诱人的实例 :canvas 模拟实现电子彩票刮刮乐

    转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/34089553 今天给大家带来一个刮刮乐的小例子~基于HTML5 canvas的, ...

  9. 用Canvas画一个刮刮乐

    Canvas 通过 JavaScript 来绘制 2D图形.Canvas 是逐像素进行渲染的.开发者可以通过javascript脚本实现任意绘图.Canvas元素是HTML5的一部分,允许脚本语言动态 ...

随机推荐

  1. Neutron 理解(10):虚拟专用网(VPN)虚拟化 [How Neutron implements VPN Virtualization]

    学习 Neutron 系列文章: (1)Neutron 所实现的虚拟化网络 (2)Neutron OpenvSwitch + VLAN 虚拟网络 (3)Neutron OpenvSwitch + GR ...

  2. 如何用python在Windows系统下,生成UNIX格式文件

    平时测试工作中,少不了制造测试数据.最近一个项目,我就需要制造一批可在UNIX下正确读取的文件.为确保这批文件能从FTP下载成功,开发叮嘱我:“文件中凡是遇到换行,换行符必须是UNIX下的LF,而不是 ...

  3. Python函数作用域的查找顺序

    函数作用域的LEGB顺序 1.什么是LEGB? L:local 函数内部作用域 E:enclosing 函数内部与内嵌函数之间 G:global 全局作用域 B:build-in 内置作用域 2.它们 ...

  4. [No000084]C# 使用Log4Net(1)-快速建立一个demo

    1.下载Log4Net: http://logging.apache.org/log4net/download_log4net.cgi 2.新建一个WinForm程序,取名Log4NetDemo 3. ...

  5. iOS widget开发

    链接: iOS Widget开发 iOS开发之构建Widget iOS开发Widget iOS开发-widget基础 ios8新特性widget开发 ios 10 开发-widget实现 Widget ...

  6. Linux Linux程序练习十九

    题目:编写一个同步服务器模型 要求: )客户端A主机给服务器B主机发送报文, )B服务器主机收到报文以后同时分发给C1主机.C2主机: )C1主机和C2主机打印出客户端A的报文 bug总结:本来这道题 ...

  7. Qt——消息对话框的设计

    1.消息对话框是什么 消息对话框(MessageBox)提供了一个模态对话框,用来通知用户某些信息,或者用来询问用户一个问题并获得一个答复. 先看下面2张图—— 第一张图是网易云音乐的界面截图,在删除 ...

  8. jquery替换所有逗号

    代码: var aa= $("input[name=aa]").val().replace(/\,/g,""); 原文:http://blog.csdn.net ...

  9. Win10升级后回退后无法检测新版本的修复办法

    笔记本原来装的是Win10 10240版本,升级到14393版本后进行了回退.回退后,Win10系统再也检测不到新版本更新了.   解决办法如下: 1.打开注册表:HKEY_LOCAL_MACHINE ...

  10. 琴弦文字 - jquery插件

    这是一个基于jquery的琴弦效果插件. 以前曾经见过这个效果,有过尝试的想法但是当时技能点还不够. 前天在火车上偶然想起这个,认真思索了一下,一气呵成 :D 看来最近技能树点偏的不太远. 效果展示 ...