I am currently working on a project based on Kinect and I can't find a way how to resize the image relative to the image center. I managed to update image width and height as I move my hands and I get the picture resized, but relative to the TopLeft corner. So, basically if you imagine a rectangle, the top left corner is always fixed, while other corners move. The picture resizes only in the directions from right to left and from bottom to top.
I first tried to use ScaleTransform to resize the image and there i could specify the transform origin ( which I was setting in the middle of the picture), but it does not allow to update the image size in the result... so it makes no use to me..
So, if anyone could give my some sort of an idea of how to approach the task of resizing in all directions dynamically I would be very grateful. Maybe there is some way how to set the point to a different value than top left?
Thanks in advance!
You can use RenderTransformOrigin to move the center point of a scale action. For example:
<Setter Property="RenderTransformOrigin" Value="0.5, 0.5" />
I had a similar question related to resizing on a DP from the center of a UserControl. The discovery of how to resize from the center of the object is mentioned in one of the comments of the accepted answer.
Growing UserControl Size with Style Trigger?
Related
So I am using WinForms to create an application that needs to render overlays at certain image positions. For that, I need to translate pixel positions on a PictureBox to a position in the Window so I can draw a textbox at that location. The stuff is inside a "TabPane" element from Devexpress, which is treated as a panel. I first tried to use relative positioning from the center of the image, but that never worked. I could not find any information on the internet.
Any helpful ideas would be helpful and appreciated!
Hi I'm hoping someone can help point me in the right direction to how i might go about solving this issue.
I have a blank image (white) which is 3000x1500 which acts a a canvas, i then have an image which again could be any size and any orientation. What i need to do is scale this image to fit inside the blank white canvas as best as possible and also center it. I would expect to see white gaps at the top or bottom of the final image if the image could not be scaled to fix the exact canvas.
Can anyone suggest what i should research, how i would go about drawing an image inside another in C# WPF and anything that may already exist that i could use to achieve this.
I forgot to mention that this would need to output to a bitmap so it could be saved to disk
All you need to do is to put an Image control into an appropriately sized Grid with white background, and set its Stretch property to Uniform. No Viewbox required.
<Grid Width="3000" Height="1500" Background="White">
<Image Source="<path to image file>" Stretch="Uniform"/>
</Grid>
Look up ViewBox. A ViewBox automatically scales its single child element based off of the stretch parameter.
Is there a way to implement pixel snapping in UWP from code behind ?
I know XAML controls in UWP automatically do this, but I'm using a thir party library, Win2D, to draw some lines, and pixel snapping is not default.
Aligning these lines with the rest of the interface is a pain. I need to align some vertical borders drawn with Win2D with the pixel snapped vertical borders of some cells drawn inside a XAML horizontal ListView.
What I would need would be a way to get the exact X and Y coordinates of the closest pixel. I need to draw a vertical / horizontal line with Win2D.DrawLine from A to B and I need to snap to pixels to prevent antialising and to align with a XAML Border.
This is picture of the actual issue. The lower raw is drawn with Win2d, The upper raw is the table header and is drawn with XAML controls.
I need a way to snap to pixel the lines drawn with Win2D just as XAML does this.
I got the exact coordinates of the items I needed to align to using this sample:
Absolute coordinates of UIElement in WinRT
Then I have simply drawn the lines to the exact coordinates.
The alternative to your own answer might be to draw just these lines using XAML.
I'm working on an image editor, there are some shape controls like rectangle, eclipse etc with drag drop feature on canvas and they are re-sizable(one corner is fixed, other three are re-sizable), attached a screen shot below:
I'd like to only resize the seleted corner, other three will be fixed, any ideas?
DaveRook Edit
In Photoshop, this is achieved by wrapping (under transforms)! This means re-drawing that corner un-proportionally to the rest of the image.
You will need to do a few things to achieve resizing of your rectangle.
a drag handle (something for the user to click and move).
to calculate the new height and width of your rectangle based upon the mouse position when the drag handle is being moved.
to update the height and width of the rectangle.
There is no shortcut here, but this SO question should be enough to get you started
I have seen lot of posts which demonstrate how to move objects in a Canvas but what I need is, a way to move either
1. the entire canvas along with its every child
or
2. move every object manually (which is certainly not advisable)
I have put my Canvas in a ScrollViewer.
My actual issue is : I m trying to zoom the canvas using ScaleTransform but after zooming, i also need to move the scroll viewer to a point such that the clicked point is at the center after zooming.
I tried Canvas.SetLeft() and Canvas.SetTop() but bad luck..
Any idea?
Thanks in Advance..
You can communicate with the ScrollViewer to make it scroll its content to a particular offset by using ScrollToVerticalOffset and ScrollToHorizontalOffset.
You'll need to calculate the correct offset by taking into account the size of the "viewport" i.e. the area that you can see of the content, and the zoom level.
http://go4answers.webhost4life.com/Example/center-zoom-wpf-problem-159135.aspx
This might be useful for what you are doing:
http://autoscroller.codeplex.com/