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 - 红,绿,蓝,透明度,所以我们如果想将图片反色(比如红车换成绿车)的话,只要交换 相应的分量即可。

转载请注明来自菩提树下的杨过 http://www.cnblogs.com/yjmyzz/archive/2010/01/20/1652391.html

时间: 2024-09-23 19:51:16

silverlight:如何在图片上挖个洞?的相关文章

Silverlight中的拖拽实现的图片上传

原文 http://blog.csdn.net/dujingjing1230/article/details/5443003 在Silverlight中因为可以直接从系统的文件夹里面拖出来一个文件直接放到浏览器中,我在想使用这个功能来做成图片上传(或者文件上传),这样的用户体验将会是非常好的. 传统的上传都是打开对话框,选择文件,然后点击上传.步骤比较多.使用Silverlight做的文件上传如下图所示:     直接左键鼠标,拖拽过去就OK了.如下图:     这边文章里不能完全实现服务器端的

plupload图片上传显示问题,新手跪求帮忙解决,多谢!

问题描述 我想实现图片上传后在旁边显示的功能,但每次上传都会提示"上传失败HTTPError,上传图片大小不能超过5M"的错误.界面如下:代码如下:pageInit.prototype.initUploader=function(fn){varuploader=newplupload.Uploader({runtimes:'html5,flash,silverlight,html4',browse_button:'uploaderBtn',//youcanpassinid...url:

从图片上传的三个步骤来分析其中的交互过程

传统的图片上传交互很简单:一个文件域要求用户选择图片文件,一个提交按钮(如下图). 这种方式有很多缺点,比如选择图片后看不到预览,一次只能选择一张图,上传过程看不到进度.当然也有它自身的优点:html本身的表单控件,代码简单,上传不易出错,适合低速网络环境.现在富媒体横行的时代,用户需要长传大量图片,这种传统表单的方式上传图片显然已经跟不上时代的需求,基于 flash.html5的新型上传方式被广泛的应用. 我们从上传图片前.上传中.上传后三个步骤来分析其中的交互过程. 上传前 上传图片前一般可

标签-Java如何在图片上添加文字

问题描述 Java如何在图片上添加文字 小白没事干想P图玩 然后想在文字上加字 发现如果用标签那么两者是分开的 如果把文字也弄做一个标签的话会被图片遮盖 希望各位大大能赐教我如何把文字添加在图片上 谢谢 解决方案 java?给图片添加文字 最近开发中要实现给图片加文字功能,本打算用Jmagick实现的,可是中文出现乱码,没有找到解决办法,就用 最原始的方法实现了,如果随知道Jmagick图片解决中文乱码问题,可以告诉我,谢谢!!! public?class?d?{? public?static?

asp.net 怎么给在数据库读出的二进制图片上添加水印?

问题描述 asp.net 怎么给在数据库读出的二进制图片上添加水印? 想给在数据库中读取出的所以二进制图片知道添加图片水印怎么弄? 解决方案 asp.net 给图片添加水印asp.net为图片添加文字水印ASP.NET上传图片到数据库并加水印 解决方案二:

如何在Word背景图片上打字

  如何在Word背景图片上打字          方法/步骤 首先建立一个Word文档并打开. 添加一个背景图片,粘贴复制就行. 接着选择插入文本框.插入后在文本框中输入你要输入的内容. 将文本框拖到你需要的地方,接着选中文本档-右单击选择-设置文本框格式,将填充选项中颜色设置为白色.

位置-求组android怎么通过屏幕上的坐标点换算成图片上的坐标点

问题描述 求组android怎么通过屏幕上的坐标点换算成图片上的坐标点 简单说:界面上有一张图片,想实现点击图片不同位置响应不同事件,所以就想说点击屏幕可以获得点击的坐标,然后通过得到的点的坐标然后换算成该点在图片上的坐标.但是把屏幕上得到的点的坐标换算成该点在图片上的坐标值要怎么换算呢?网上搜过说得到图片坐标,分辨率,点击点的坐标就可以换算成该点在图片上的坐标,但是没说怎么换算的问题...求大神解答 解决方案 方法网上其实都说到了,只是具体的要根据你图片显示的布局才能确定. 你要知道: 1 图

上传图片-图片上传过程和下载过程的问题

问题描述 图片上传过程和下载过程的问题 从客户端上传图片给服务器这个过程中图片是被压缩后上传还是直接原图?一般从服务器下载的图片会比当初自己上传的照片小很多这个是不是在下载的过程中被处理了还是说服务器里面存的照片只有这么大? 非常感谢 解决方案 如果不怕浪费带宽和无所谓服务器的性能和存储,服务器提供下载100MB的图片也可以的. 解决方案二: 一般是网站在得到上传文件的时候会进行处理,比如裁剪和缩放控制分辨率.或者转换成统一的格式,比如png/jpg等. 解决方案三: 上传一般是原图上传,没有原

手机社交应用的图片上传下载功能分别使用ftp和http的优缺点是什么?

问题描述 手机社交应用的图片上传下载功能分别使用ftp和http的优缺点是什么? 手机上流行的社交应用,可以查看好友的拍照相册,也可以自己拍照上传和好友分享等,分别使用ftp和http技术实现上传下载的优缺点是什么?