Is it possible to draw a wpf control to memory (Bitmap) without drawing on the screen at all?
I found an example of how to save to Bitmap, but it only works when the window has been drawn in the screen.
BitmapImage bitmap = new BitmapImage();
RenderTargetBitmap renderTarget =
new RenderTargetBitmap((int)canvaspad.Width,
(int)canvaspad.Height,
96,
96,
System.Windows.Media.PixelFormats.Default);
renderTarget.Render(canvaspad);
As the control has no parent container, you need to call Measure and Arrange in order to do a proper layout. As layout is done asynchronously (see Remarks in Measure and Arrange), you may also need to call UpdateLayout to force the layout to be updated immediately.
public BitmapSource RenderToBitmap(UIElement element, Size size)
{
element.Measure(size);
element.Arrange(new Rect(size));
element.UpdateLayout();
var bitmap = new RenderTargetBitmap(
(int)size.Width, (int)size.Height, 96, 96, PixelFormats.Default);
bitmap.Render(element);
return bitmap;
}
In case you have already set the Width and Height of the element you may use that for the size parameter:
var grid = new Grid
{
Width = 200,
Height = 200,
Background = Brushes.Yellow
};
grid.Children.Add(
new Ellipse
{
Width = 100,
Height = 100,
Fill = Brushes.Blue
});
var bitmap = RenderElement(grid, new Size(grid.Width, grid.Height));
Related
I have a bug in my image editor with the blur tool.
When I select the rectangle to set the blur effect, and when I apply, result is a bit different see:
To create the "Before" I do:
var blurredImage = ExtractImageToBlur(); // extract the selected area from image
BlurredImageRectangle.Fill = new ImageBrush(blurredImage);
var effect = new BlurEffect();
effect.KernelType = KernelType.Gaussian;
effect.RenderingBias = RenderingBias.Quality;
effect.Radius = m_blurValue;
BlurredImageRectangle.Effect = effect;
To create the "After", I do:
var blurredImage = ExtractImageToBlur(); // extract the selected area from image
Rectangle rectangleToRender = new Rectangle();
rectangleToRender.Fill = new ImageBrush(blurredImage);
var effect = new BlurEffect();
effect.KernelType = KernelType.Gaussian;
effect.RenderingBias = RenderingBias.Quality;
effect.Radius = m_blurValue;
rectangleToRender.Effect = effect;
Size size = new Size(croppedImg.PixelWidth, croppedImg.PixelHeight);
rectangleToRender.Measure(size);
rectangleToRender.Arrange(new Rect(size));
var render = new RenderTargetBitmap(croppedImg.PixelWidth, croppedImg.PixelHeight, 96, 96, PixelFormats.Pbgra32);
render.Render(rectangleToRender);
// Merge the source with the blurred section
DrawingVisual drawingVisual = new DrawingVisual();
using (DrawingContext context = drawingVisual.RenderOpen())
{
int left = (int)(Canvas.GetLeft(BlurredImageRectangle) * WidthRatio);
int top = (int)(Canvas.GetTop(BlurredImageRectangle) * HeightRatio);
context.DrawImage(Source, new Rect(0, 0, Source.PixelWidth, Source.PixelHeight));
context.DrawImage(render, new Rect(left, top, croppedImg.PixelWidth, croppedImg.PixelHeight));
}
var bitmap = new RenderTargetBitmap(Source.PixelWidth, Source.PixelHeight, 96, 96, PixelFormats.Pbgra32);
bitmap.Render(drawingVisual);
And when I play with the blur radius, its sometimes a lot more different from both images.
Why its not the same?
Found the problem.
When I was drawing the rectangle on the screen, I applied the blur effect on the pixels on the screen.
When I hit save, the blur effect is applied on the pixel on the image on disk.
Huge difference.
I have a FrameworkElement and I want to save it as a Height-Resolution Image (Jpeg). I tried the following code, but the results are not what I had hoped. I got an image with bad resolution when I print it with A4 as the paper size.
// ...
FrameworkElement element = this.Content;
element.Measure(new System.Windows.Size(double.PositiveInfinity, double.PositiveInfinity));
element.Arrange(new Rect(element.DesiredSize));
element.UpdateLayout();
// i used element.ActulaHeight and ActualWidth but not works.
RenderTargetBitmap bitmap = new RenderTargetBitmap((int)element.Width, (int)element.Height, GPFReporstPageSizeExtension.DPI, GPFReporstPageSizeExtension.DPI, System.Windows.Media.PixelFormats.Pbgra32);
bitmap.Render(element);
// ....
Finally i solved my problem, i posted the full solution in my blog "gamadev web site":
Saving FrameworkElement as Image
FrameworkElement element = myControl.Content;
// you can set the size as you need.
Size theTargetSize = new Size(1500,2000)
element.Measure(new System.Windows.Size(double.PositiveInfinity, double.PositiveInfinity));
element.Arrange(new Rect(theTargetSize ));
// to affect the changes in the UI, you must call this method at the end to apply the new changes
element.UpdateLayout();
double dpiScale = 300.0 / 96;
double dpiX = 300.0;
double dpiY = 300.0;
RenderTargetBitmap bmp = new RenderTargetBitmap(Convert.ToInt32(
(theTargetSize .Width) * dpiScale),
Convert.ToInt32((theTargetSize .Height) * dpiScale),
dpiX, dpiY, PixelFormats.Pbgra32);
bmp.Render(element);
element.Measure(new System.Windows.Size());
element.Arrange(new Rect());
element.UpdateLayout();
System.Windows.Media.Imaging.BitmapEncoder encoder = new System.Windows.Media.Imaging.PngBitmapEncoder();
MemoryStream myStream = new MemoryStream();
encoder.Frames.Add(System.Windows.Media.Imaging.BitmapFrame.Create(this.CreateRenderTargetBitmap()));
encoder.Save(myStream);
var img = System.Drawing.Bitmap.FromStream(myStream);
Bitmap bmp = new Bitmap((int)theTargetSize .Width, (int)theTargetSize .Height);
var g = Graphics.FromImage(bmp);
g.Clear(System.Drawing.Color.White);
g.DrawImage(this.GetPageAsImage(), (int)this.Margin.Left, (int)this.Margin.Top);
fileName = #”D:\myImage.png”;
bmp.Save(fileName);
I am trying to resize image to width=100 height=100
public ActionResult RegisterUser(userAuthModel user, HttpPostedFileBase userimage)
{
if (userimage.ContentLength > 0 && userimage != null)
{
string fname = userimage.FileName;
var path = Server.MapPath("~/Images/User_DP/" + userimage.FileName);
var image_100 = new System.Drawing.Bitmap(userimage, new Size(100, 100));
userimage.SaveAs(path);
}
.
.
.
.
.
}
Here I am using bitmap approach to resize imgae to some specific width and height.
But this shows me error in line-
var image_100 = new System.Drawing.Bitmap(userimage, new Size(100, 100));
of invalid arguments. How Do Ii resize image with using bitmap?
The System.Drawing.Bitmap class asks for two parameters in the constructor your are using:
System.Drawing.Image
System.Drawing.Size
In your code, you are passing the size correctly, but not the image. HttpPostedFileBase does not extend the Image class.
You will need to change that part of your code. If you are using the HttpPostedFileBase as a stream, then keep in mind that System.Drawing.Bitmap has no constructor asking for a Stream and a Size.
References:
System.Drawing.Image
System.Web.HttpPostedFileBase
you have to use mentioned method it may help you
private static BitmapFrame CreateResizedImage(ImageSource source, int width, int height, int margin)
{
var rect = new Rect(margin, margin, width - margin * 2, height - margin * 2);
var group = new DrawingGroup();
RenderOptions.SetBitmapScalingMode(group, BitmapScalingMode.HighQuality);
group.Children.Add(new ImageDrawing(source, rect));
var drawingVisual = new DrawingVisual();
using (var drawingContext = drawingVisual.RenderOpen())
drawingContext.DrawDrawing(group);
var resizedImage = new RenderTargetBitmap(
width, height, // Resized dimensions
96, 96, // Default DPI values
PixelFormats.Default); // Default pixel format
resizedImage.Render(drawingVisual);
return BitmapFrame.Create(resizedImage);
}
I know how to make a snapshot in WPF.
draggableObject = new Image();
AssociatedObjectParent.Children.Add(draggableObject);
Grid panel = AssociatedObject as Grid;
draggableObject.Height = panel.ActualHeight;
draggableObject.Width = panel.ActualWidth;
DrawingVisual dv = new DrawingVisual();
using (DrawingContext dc = dv.RenderOpen())
{
VisualBrush vb = new VisualBrush(AssociatedObject);
dc.DrawRectangle(vb, null, new Rect(new Point(0,0), new Size(draggableObject.Width, draggableObject.Height)));
}
double x = draggableObject.Width;
double y = draggableObject.Height;
RenderTargetBitmap renderTargetTd = new RenderTargetBitmap((int)x, (int)y, 96, 96, PixelFormats.Default);
RenderOptions.SetBitmapScalingMode(renderTargetTd, BitmapScalingMode.Fant);
RenderOptions.SetEdgeMode(renderTargetTd, EdgeMode.Aliased);
renderTargetTd.Render(dv);
But now I have this ScrollViewer that is 600px wide and Content with 1000px.
When I use this code and my horizontalOffset is 0 (so I haven't scrolled at all), then all is well and I get an image of the ScrollViewer-Control just fine.
However when I scroll my ScrollView and make a snapshot just the same way. The snapshot is all messed up.
How can I make a snapshot of the visible '400 to 1000' area of the scrollview content like I can with the '0 to 600' area of the scrollview?
I want to use RenderTargetBitmap to render a UserControl to a bitmap without having to write the XAML for it. When I do this I get a blank image, am I missing a crucial step?
ValTool.Controls.VideoFisheyeOverlayControl vfoc = new Controls.VideoFisheyeOverlayControl();
vfoc.Width = (int)this.VideoContainer.ActualWidth;
vfoc.Height = (int)this.VideoContainer.ActualHeight;
vfoc.FieldsOfView=this.FieldsOfView;
vfoc.CountLines = this.CountLines;
vfoc.UpdateLayout();
vfoc.InvalidateVisual();
RenderTargetBitmap visual = new RenderTargetBitmap((int)this.VideoContainer.ActualWidth, (int)this.VideoContainer.ActualHeight, 96, 96, PixelFormats.Pbgra32);
visual.Render(vfoc);
var finalImage = BitmapFrame.Create(visual);
// Encoding the RenderBitmapTarget as a PNG file.
PngBitmapEncoder png = new PngBitmapEncoder();
png.Frames.Add(BitmapFrame.Create(finalImage));
using (Stream stm = File.Create(#"new.png"))
{
png.Save(stm);
}
Instead of UpdateLayout you have to call Measure and Arrange to get the layout done:
var width = VideoContainer.ActualWidth;
var height = VideoContainer.ActualHeight;
vfoc.Measure(new Size(width, height));
vfoc.Arrange(new Rect(0, 0, width, height));
vfoc.InvalidateVisual();