silverlight:如何在图片上挖个洞?

一、不写代码的方法:用Blend

看图说话:

这是待处理的图片win7

在win7上,画一个矩形,再用钢笔随便画个封闭的path

将矩形与path合并组成复杂的路径

将合成后的复杂路径与win7图片同时选中,然后生成剪切路径

这样我们就得到了一个不规则的图片轮廓(当然这里演示的去掉不规则部分,反过来就是挖洞)

二、用代码挖洞

原理:先用WriteableBitmap把原图片复制一份,然后将原图隐藏,接下来把指定区域的象素透明度指定为0 

代码:

xaml部分

<UserControl
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    x:Class="Mark.Index"
    d:DesignWidth="400" d:DesignHeight="250" Width="400" Height="250" >

 <Grid x:Name="LayoutRoot"> 
 <Image x:Name="win7" Source="img/win7.jpg" Width="400" Height="250" d:IsHidden="True"/>
 <Image x:Name="imgMask" d:IsHidden="True" ></Image> 
 </Grid>
</UserControl>

后端cs

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media.Imaging;

namespace Mark
{
 public partial class Index : UserControl
    {
 public Index()
        {
 // Required to initialize variables
            InitializeComponent();

 this.Loaded += new RoutedEventHandler(Index_Loaded);
        }

 void Index_Loaded(object sender, RoutedEventArgs e)
        {
            WriteableBitmap wb = new WriteableBitmap(win7, null);
 this.imgMask.Source = wb;
            win7.Visibility = Visibility.Collapsed;
            GenMask(wb);
        }

 void GenMask(WriteableBitmap wb)
        {            
 int _width = (int)win7.Width;
 int _height = (int)win7.Height;

 #region 把四周边距50px以内的区域挖空
 int _padding = 50;
 
 for (int row = _padding + 1; row < _height - _padding; row++)
            {
 for (int i = _width * row + _padding; i < _width * (row+1) - _padding; i++)
                {
                    wb.Pixels[i] = BitConverter.ToInt32(new byte[] { 0, 0, 0, 0 }, 0);//注意顺序:byte数组的含义依次为 {b,g,r,a},即:{蓝,绿,红,透明度}
                }               
            }
 #endregion

        }

    }
}

效果:

利用这个还能玩点花样(在指定区域添加白色噪点): 

将鼠标所到之处挖空,即擦除效果: 

最后再补充一点位图象素的常识:

bitmap中的pixel是以int32整形数组形式存放的,数组的长度等于 图片的宽度 * 图片的高度,数组每个元素拆分成byte[]后,有4个分量,即r,g,b,a - 红,绿,蓝,透明度,所以我们如果想将图片反色(比如红车换成绿车)的话,只要交换 相应的分量即可。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏老司机的简书

CoreText实现图文混排

也好久没来写博客了,主要是最近也工作了,手头的事有点多,一时间也就断了,闲下来了我就来补博客了,刚好最近也做了很多东西,放在这里也算给自己做个笔记吧。

21220
来自专栏hightopo

HT for Web基于HTML5的图像操作(一)

18520
来自专栏深度学习之tensorflow实战篇

绘制动态心形图案::R语言绘制心形图

原始方程源于此贴一楼:直通车 整理修改后: 被窝修改成这样: x<-seq(-1.1,1.1,length = 3000) rep<-30 y<-matri...

50670
来自专栏码神联盟

碎片化 | 第四阶段-41-struts2字节流生成验证码-视频

如清晰度低,可转PC网页观看高清版本: http://v.qq.com/x/page/r056700jckx.html 验证码实现 需求: 在登录的页面,增...

30090
来自专栏AhDung

【C#】分享一个弹出容器层,像右键菜单那样召即来挥则去

------------------201508261813更新(源码有更新、Demo未更新)------------------

18620
来自专栏向治洪

React Native之TextInput组件实现联想输入

TextInput组件是最基本的组件,相关介绍请查看TextInput组件介绍 输入框组件属性 输入框组件的主要属性如下: autoCapitalize : ...

251100
来自专栏吾爱乐享

php学习之html的标签属性(二)

16020
来自专栏疯狂的小程序

微信小程序版2048小游戏(附源码)

最近流行微信“跳一跳”小游戏,我也心血来潮写了一个微信小程序版2048,本篇文章主要分享实现2048的算法以及注意的点,一起来学习吧!(源码地址见文章末尾)

2.1K80
来自专栏大数据文摘

如何运用Python绘制NBA投篮图表

37580
来自专栏菩提树下的杨过

silverlight:手写板/涂鸦/墨迹/InkPresenter示例程序

这种应用现在已经比较常见了,比如论坛回贴中的手写功能 ,IM聊天中的个性化手写文字,个性签名等,在Silverlight中要实现该功能其实非常简单,只要一个I...

364100

扫码关注云+社区

领取腾讯云代金券