WPF - How to work out how much of a canvas background image is cropped? - wpf

I have a canvas with a background image:
var bi = new BitmapImage(new Uri(imgLocFull));
var ib = new ImageBrush(bi) {Stretch = Stretch.UniformToFill};
MyCanvas.Background = ib;
I am overlaying various shapes on the image, and want the position of the shapes relative to the background image to be fixed.
If my application window is resized, the amount of the image that is cropped, horizontally and vertically, changes, and when my shapes are redrawn, they do not appear in the same position on the background image.
How can I determine how much of the image has been cropped (to apply an adjustment factor to the overlaid objects' positions?) Or is there a better way of fixing the location of a shape relative to the background image?
Here is my present drawing code:
var l = new Ellipse();
var scb = new SolidColorBrush();
scb.Color = Color.FromRgb(rCol, gCol, bCol);
l.Fill = scb;
l.StrokeThickness = 0;
l.Width = 3;
l.Height = 3;
Canvas.SetBottom(l, point.Y); // * clipping factor here?
Canvas.SetLeft(l, point.X); // * clipping factor here?
MyCanvas.Children.Add(l);
EDIT: Further Clarification
Here's a concrete example of what I am trying to achieve. My image is an aerial photograph, and I want to mark a particular geographical feature (with, say, an ellipse.)
When the window is resized, the ellipse doesn't stay on the feature, it stays relative to the left and top of the canvas.
I can get it closer to the right place by moving it using a factor (newx = newheight/oldheight * oldx) but this doesn't quite work because of the UniformToFill stretch mode, which sees some of the image clipped off the canvas.

The Top and Left of the Canvas are 'anchored', while the Bottom and Right move when resizing... try setting the Canvas.Top Attached Property instead, along with the Canvas.Left Attached Property as you are:
var l = new Ellipse();
var scb = new SolidColorBrush();
scb.Color = Color.FromRgb(rCol, gCol, bCol);
l.Fill = scb;
l.StrokeThickness = 0;
l.Width = 3;
l.Height = 3;
Canvas.SetTop(l, point.Y); // * clipping factor here?
Canvas.SetLeft(l, point.X); // * clipping factor here?
MyCanvas.Children.Add(l);
UPDATE >>>
You asked Or is there a better way of fixing the location of a shape relative to the background image?
I answered this question, so I don't understand why you would need to do anything else... your objects will not move when the screen in resized *if you only set the Grid.Top and Grid.Left properties.

Related

Wpf text rotation

I want to add some text on a canvas and decided to use textBlock for that (to set Font etc.)
But I cannot figure out how to rotate it.
I use the following function to add myText on myCanvas:
void text(double x_pos, double y_pos, string myText, double angle, Point rot_cen, Color color1)
{
TextBlock textBlock = new TextBlock()
{
Text = myText,
FontFamily = new FontFamily("Verdana"),
FontSize = 16,
TextAlignment = TextAlignment.Center
};
textBlock.Foreground = new SolidColorBrush(color1);
Canvas.SetLeft(textBlock, x_pos);
Canvas.SetTop(textBlock, y_pos);
textBlock.RenderTransform = new RotateTransform(angle, rot_cen.X, rot_cen.Y);
myCanvas.Children.Add(textBlock);
}
From what I've read rot_cen is a point from (0,0) - which is top left corner to (1,1) - which is bottom right corner. But when i set it to be (0.5,0.5) it still rotates around top left corner. Do I need to update it somehow?
The CenterX and CenterY properties of a RotateTransform use absolute coordinates.
You may want to set RenderTransformOrigin, which uses relative coordinates:
textBlock.RenderTransformOrigin = rot_cen;
textBlock.RenderTransform = new RotateTransform(angle);

How to set scrollbar postion of RadCartesian chart to Right side in wpf telerik

I have a RadCartesian chart. I have Zoomed it and I want its poistion at extreme right on X-axis.
We can do it by setting
radchart.HorizontalZoomRangeStart = somevalue;
radchart.HorizontalZoomRangeEnd = somevalue;
For e.g.
radchart.HorizontalZoomRangeStart = .9;
radchart.HorizontalZoomRangeEnd = 1;

Windows Phone 7 overflow clipping

I have a grid within a grid and i want the content of the second to move about without encroaching on the first grid.
Much like the panorama view but can move left or right as well as up and down.
I can get this working but unfortunately when you move down the top overflows into the outer grid overlapping any controls within it.
Is there a way to hide the overflow almost like CSS overflow:hidden?
Any help would be really appropriated.
Thank you
Andrew
Possible solution:
var gridWidth = (this.tilesize * (this.gridSize - 1)) / 2;
var top = -(((-offsetY + tileY) * this.tilesize) - gridWidth);
var left = -(((-offsetX + tileX) * this.tilesize) - gridWidth);
this.Container.Margin = new Thickness(left, top, 0, 0);
var clipSection = new RectangleGeometry();
clipSection.Rect = new Rect(-1 * left, -1 * top, 480, 400);
this.Container.Clip = clipSection;
this.Container.Dispatcher.BeginInvoke(new ThreadStart(delegate
{
this.Container.Clip = clipSection;
}));
You could do this by putting something in the cells of the "outer" grid and seeing a higher ZIndex than the elements you are moving around. The elements with the higher ZIndex appear above the lower ones.

Flip Horizontically Grid Background Image(Brush)

I have set a Grid's background brush as an ImageBrush.
But when I set the Grid's FlowDirection to RightToLeft, the image is flipped horizontically.
Is it possible to (un)flip the grid background ImageBrush using a certain Transition or any other way?
Not much you can do about that with sensible means (there same means that are far from sensible).
Instead place an Image element as the first item in the Grid with Grid.RowSpan, Grid.ColumnSpan to cover all the cells. Use Stretch="Fill" on the Image since thats how a background typically behaves.
Well, i do understand that my comment is outdated, but this question is popping up one of the first in Google search, so here is my solution:
I was localizing the application for the right-to-left culture. The simple decision to set FlowDirection=RTL comes with unexpected drawbacks like the background containing the company logo is flipped. I have applied the matrix transformation for the image brush used to render the background:
var mbgBrush = TryFindResource("MainBackground") as Brush;
if (mbgBrush == null) return null;
if (FlowDirection == FlowDirection.LeftToRight) return mbgBrush;
var mainBgImageBrush = mbgBrush as ImageBrush;
if (mainBgImageBrush == null) return mbgBrush;
var flipXaxis = new MatrixTransform(-1.0, 0, 0, 1.0, 1, 0);
var flippedBrush = new ImageBrush
{
Stretch = Stretch.None,
Opacity = 1.0,
ImageSource = mainBgImageBrush.ImageSource,
RelativeTransform = flipXaxis
};
return flippedBrush;

WPF - Set dialog window position relative to main window?

I'm just creating my own AboutBox and I'm calling it using Window.ShowDialog()
How do I get it to position relative to the main window, i.e. 20px from the top and centered?
You can simply use the Window.Left and Window.Top properties. Read them from your main window and assign the values (plus 20 px or whatever) to the AboutBox before calling the ShowDialog() method.
AboutBox dialog = new AboutBox();
dialog.Top = mainWindow.Top + 20;
To have it centered, you can also simply use the WindowStartupLocation property. Set this to WindowStartupLocation.CenterOwner
AboutBox dialog = new AboutBox();
dialog.Owner = Application.Current.MainWindow; // We must also set the owner for this to work.
dialog.WindowStartupLocation = WindowStartupLocation.CenterOwner;
If you want it to be centered horizontally, but not vertically (i.e. fixed vertical location), you will have to do that in an EventHandler after the AboutBox has been loaded because you will need to calculate the horizontal position depending on the Width of the AboutBox, and this is only known after it has been loaded.
protected override void OnInitialized(...)
{
this.Left = this.Owner.Left + (this.Owner.Width - this.ActualWidth) / 2;
this.Top = this.Owner.Top + 20;
}
gehho.
I would go the manual way, instead of count on WPF to make the calculation for me..
System.Windows.Point positionFromScreen = this.ABC.PointToScreen(new System.Windows.Point(0, 0));
PresentationSource source = PresentationSource.FromVisual(this);
System.Windows.Point targetPoints = source.CompositionTarget.TransformFromDevice.Transform(positionFromScreen);
AboutBox.Top = targetPoints.Y - this.ABC.ActualHeight + 15;
AboutBox.Left = targetPoints.X - 55;
Where ABC is some UIElement within the parent window (could be Owner if you like..) , And could also be the window itself (top left point)..
Good luck

Resources