Silverlight: How to make a hole in the image?

1. Do not writeCodeMethod: Use Blend

Figure-based speech:

This is the image to be processed.

Draw a rectangle on win7 and use a pen to draw a closed path.

Combine the rectangle and path to form a complex path

Select the merged complex path and win7 image at the same time, and then generate a cut path

In this way, we get an irregular image contour (of course, the demonstration here removes the irregular part, and the reverse is digging holes)

 

Ii. Use code to dig holes

Principle: Use writeablebitmap to copy the original image, hide the source image, and set the pixel transparency of the specified area to 0.

Code:

XAML Section

< 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 >

 

Backend 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+ = NewRoutedeventhandler (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)
{< br> int _ width = ( int ) win7.width;
int _ height = ( int ) win7.height;

# Region Empty the area with a margin of less than 50 PX.
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 ); // Note: The meaning of the byte array is {B, G, R, a} in sequence, that is, {blue, green, red, transparency}
}
}
# Endregion

}

}
}

Effect:

This can also be used to play tricks (add white noise in the specified area ):

Empty the mouse to erase the effect:

Finally, I would like to add a bit of Bitmap pixel knowledge:

In bitmap, pixel is stored as an int32 integer array. The length of the array is equal to the width of the image * the height of the image. After each element of the array is split into byte [], there are four components, that is, R, G, B, A-red, green, blue, and transparency. If we want to reverse the color of the image (for example, change the red car to a green car), we only need to exchange the corresponding components.

reprinted please indicate from the bodhi tree Yang Guo http://www.cnblogs.com/yjmyzz/archive/2010/01/20/1652391.html