Answer the question
In order to leave comments, you need to log in
How to create blurry edges on an Image in Windows Phone?
Hello.
In the Windows Phone application, there is a task - to blur the edges of an Image.
With a slider, the user should be able to change the thickness of the edge blur.
Let's assume that our image has a size of 200x200 pixels.
I had an idea to create a Canvas 200x200, fill the Canvas with a group of Rectangles (100 pieces) with different degrees of transparency (the degree of transparency depends on slider.value and is considered as 255/slider.value), store the Canvas in a WriteableBitmap, create an ImageBrush from the WriteableBitmap. And use ImageBrush for Image.OpacityMask:
var canvas=new Canvas();
var canvasSize = 200;
var mainRectCount = 100;
var changedRectCount = 50;
var tempCanvas = new Canvas();
tempCanvas.Height = tempCanvas.Width = canvasSize;
var rectangleSizeStep = canvasSize / mainRectCount;
var opacityStep = 255.0 / changedRectCount;
var rectangleSize = canvasSize;
var opacity = 0.0;
var rectMargin = 0.0;
for (int i = 0; i < mainRectCount; i++)
{
Rectangle rect = new Rectangle();
rect.Height = rect.Width = rectangleSize;
var color = new Color();
color.A = (byte)opacity;
color.R = 1;
color.G = 150;
color.B = 5;
rect.Fill = new SolidColorBrush(color);
rect.Margin = new Thickness(rectMargin, rectMargin, 0, 0);
rectMargin += rectangleSizeStep / 2;
rect.RadiusX = 25;
rect.RadiusY = 25;
if (i < changedRectCount)
{
opacity += opacityStep;
}
else
{
opacity = 255;
}
rectangleSize -= rectangleSizeStep;
canvas.Children.Add(rect);
}
var writeBit= new WriteableBitmap(canvas, null);
var imgBrush = new ImageBrush();
imgBrush .ImageSource = writeBit;
img.OpacityMask = imgBrush ;
Answer the question
In order to leave comments, you need to log in
I have an implementation - do something like this, but I also have a problem. see question. WP8 gradient on control border, pixel gaps
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question