Shapes Clipping - wpf

I'm having a problem that's driving me crazy for a couple hours...
Situation:
I am drawing a shape - ellipse,
then im creating a new brush - from an image,
I apply the brush to my shape,
and then I rotate the shape..
The problem is: Everthying is displaying correctly - but...
As soon as I drag the shape to the edge of the window - thats where the formular ends,
it's starting to cut of some parts of the shape.
It's simply not drawing the part that should be not visible, because overflowing the form.
But in my case, I've rotated the shape, so it's cutting the wrong part of it.
This is what it look's like. Is there a way to kinda "reset" the cliping.. Or another solution...

Solved It.
Set the parent element's width and height larger then the window is (its was HorizontalAlignment.Stretch) before.
Now you'll never reach the cliping edge of the parent

Related

Speed of Thousands of Rectangles (with a Stroke!!!) in a WPF Canvas

this is my fist question here,
but I didn't find a real answer to my question.
I work on a visualization program and use C# and WPF.
I need to draw a treemap. I actually create Rectangle objects and then add them to the Canvas which works really nice and is very useful, since I also add event handlers to those rectangles (mouse click).
I have a problem with the performance though.
When I add the rectangles and set the Stroke property (SolidColorBrush) the whole process is slowing down extremely. Without those strokes set the speed is ok.
I already improved the performance a little by adding Rectangle objects to a newly created Canvas object and then adding this new Canvas object to the original Canvas object (so not all rectangles are direkt children of the original Canvas, which should help speeding things up).
So my question is how it is possible to add a Stroke to all those Rectangles without breaking the speed.
You can find a comparison of the 'strokeless' and 'stroked' treemap versions in the links.
Treemap without Strokes
Treemap with Strokes
Thank you very much for your help!
edit:
Ok, I have found a solution!
Sorry for writing here first, but I already searched for hours to find a solution but now I found out tht the problem was my used SolidColorBrush!
I have something like this:
public static SolidColorBrush TreeMapBorderBrush;
And I use this Brush to set the Stroke property of every Rectangle that should be added to the Canvas. But exactly that was the problem.
The code looked like this before:
rect.Stroke = Visualization_Helper.TreeMapBorderBrush;
I changed it to this now:
rect.Stroke = Visualization_Helper.TreeMapBorderBrush.Clone();
So I only work with a copy of that Brush on each Rectangle now, which speeds up the processing like there was no Stroke (like in my question)!
Just for your information! Weird!

scrollviewer and canvas - scrolling view to given position

I have some problems with implementing autoscrolling in WPF (I think I could call it that way).
I have a canvas placed inside a scrollviwer. On my canvas I can dynamicly add different shapes. The position of this shapes can be changed with mouse. Everytime I add new shape on canvas or change position of shape I fire measureOverride function.Thanks to this scrollview "know" the real size of canvas and the scrollbars appear. However even if scrolbars appear, the view doesn't "follow" shape which I currently move. I mean if I reach visible part of canvas I would like canvas to srcoll.
I was trying to use this function
ScrollToHorizontalOffset()
However I have problem with proper use of that function. I was trying to use (as a parameter) canvas actualwidth but it didn't work well. I also was trying to use as a parameter current position of shape (which I move) but it works only one way. I the viewer follow the moving element if I was moving this element to right side of canvas. However if I move shape back(to the left) the view don't follow the shape.
I hope somebody will understand this :) It is hard to explain my problem.
I also was trying to use as a
parameter current position of shape
That is the correct way to implement. Waht you need is a converter, which will returns the position according to the direction you move the object.

Animation in WPF query

I'm playing with WPF for the first time in an animation/graphics context, and I am wondering how you'd move sprites around. I googled and came up with this example, but the animation is done by increasing/decreasing the margins and padding.
My question is, is this normal? I would have thought you'd do animation by changing the x and y co-ordinates of a sprite, not its padding.
Position and Margin are the same thing. Position is the distance to the edge of the screen, or the egde of the window. Margin is the same thing.

WPF Clipping Problem

I have a UserControl which has a quadratic Image as a Child. This Image is at the bottom of the UserControl, and half of it is clipped (e.g. the Control's Height is 400, Image's height is 200 and it is set to y=300).
Now, When I rotate the Image, it is still clipped like the way it was first. Like when rotating around 90 degrees, I suddenly have an Image which is only 100px wide.
It seems like the original clipping which was made because of the bounds of the UserControl, are applied forever.
How do I solve this problem? I hope I explained my problem understandable ;)
How are you rotating the image? If you are rotating using a RenderTransform, then WPF does not re-render what was already displayed on the screen - it simply rotates the pixels.
Instead, rotate the image using a LayoutTransform; this forces WPF to re-render the control given the new area it occupies, which should eliminate the clipping you see.
You can also call InvalidateMeasure() after applying render transform.

WPF Canvas: centered origin, scaled axes (and y inverted), responding to mouse events

In a simple code-only WPF application I'm writing, I would like to have a custom Canvas.
I've found questions similar to this one here in StackOverflow, but couldn't find exactly this one, nor a simple way to adapt another answer to my specific problem (please note that I have not much experience in WPF).
In my canvas, I'd like it to have the following properties:
the point (0, 0) is on the center of the Canvas;
the x-axis points to the right;
the y-axis points to the top;
the point (1, 0) is about 1 inch to the right of the origin; and
in every event, the position of the mouse is given in the coordinate system defined above.
In this answer, Ray Burns propose a very simple solution to my first 3 points. It is trivial to modify that code so that it deals with my point number 4 as well (change 1 and -1 in the RenderTransform to other constants).
However, that very simple and excellent solution for many problems is based on setting width and height to 0, and centering the canvas on its container. Therefore, there's no canvas to capture events like a click, so this solution won't handle my fifth property.
What's the easiest way to achieve this? Inherit from Panel and do everything by hand? Inherit from Canvas, intercept every event and modify the coordinates?
Put Canvas inside a Border. Border has mouse events. Another case is to place Border on the top of the Canvas.

Resources