I'm trying to draw a row of rectangles across my Canvas. When I run the following code, I only get one rectangle, even though my canvas element says it has 12 children.
Dimensions is a class with 2 integer properties, Height and Width. The canvas I am drawing this is on 400px by 600px.
Dimensions windowDimensions = new Dimensions()
{
Width = (int)cvsGameWindow.Width,
Height = (int)cvsGameWindow.Height
};
//init rectangles
for (int i = 0; i < windowDimensions.Width; i+=50)
{
Rectangle rect = new Rectangle(); //create the rectangle
rect.StrokeThickness = 1; //border to 1 stroke thick
rect.Stroke = _blackBrush; //border color to black
rect.Width = 50;
rect.Height = 50;
rect.Name = "box" + i.ToString();
Canvas.SetLeft(rect,i * 50);
_rectangles.Add(rect);
}
foreach (var rect in _rectangles)
{
cvsGameWindow.Children.Add(rect);
}
and the private members declared at the top of my code:
private SolidColorBrush _blackBrush = new SolidColorBrush(Colors.Black);
private SolidColorBrush _redBrush = new SolidColorBrush(Colors.Red);
private SolidColorBrush _greenBrush = new SolidColorBrush(Colors.Green);
private SolidColorBrush _blueBrush = new SolidColorBrush(Colors.Blue);
private List<Rectangle> _rectangles = new List<Rectangle>();
This is the culprit:
Canvas.SetLeft(rect,i * 50);
On the first loop, with i=0, you're setting Canvas.Left = 0; Since your for loop is doing i+=50, on the second loop i will be 50, so you'll be setting Canvas.Left = 2500. You said your Canvas is 400x600, so your rectangles are off-screen.
The simplest fix: use Canvas.SetLeft(rect, i) - since i is increasing in increments of 50.
Related
I am having trouble when trying to obtain the actual width of a transformed ( rotated ) element in WPF.
I have a rectangle containing an image, in a Canvas. When I rotate the rectangle, I would like to get the rendered width to center it in my window, but I always get the base Width, no matter how I try.
I tried using Width, ActualWidth, RenderSize.Width : exact same result.
I tried using a LayoutTransform and RenderTransform, same.
I really don't get what I'm doing wrong, everything I've read about the subject suggest that I should get the rendered width of the whole bounding box using ActualWidth, and not the default width of my rectangle/image.
Here is my code :
Setting up the scaleTransform :
private ScaleTransform scaleT = new ScaleTransform();
private RotateTransform rotateT = new RotateTransform();
private TransformGroup tGroup = new TransformGroup();
//Adding renderTransform
scaleT.ScaleX = 1;
scaleT.ScaleY = 1;
rotateT.Angle = 0;
tGroup.Children.Add(rotateT);
tGroup.Children.Add(scaleT);
imageContainer.RenderTransform = tGroup;
And the rotation :
private void rotateWindow(string direction)
{
double prevWidth = this.Width;
double prevHeight = this.Height;
this.Width = prevHeight;
this.Height = prevWidth;
imageContainer.RenderTransformOrigin = new Point(0.5, 0.5);
if (direction == "Right")
{
rotateT.Angle += 30;
}
if (direction == "Left")
{
rotateT.Angle -= 30;
}
adaptWindowToGrid();
}
Thanks !
Background: I am currently busy with showing position of a Vehicle on a Zoomable Canvas based on the Position (X,Y) and Orientation (for Rotation). I use Rectangle for visualizing the vehicle. Everything works well but I got a bit greedy and now I want to replace the Rectangle with Top View Picture of the Vehicle, so it looks that the vehicle itself is moving instead a Rectangle.
Code Below:
private void PaintLocationVehicle(VehicleClass vc)
{
IEnumerable<Rectangle> collection = vc.ZoomableCanvas.Children.OfType<Rectangle>().Where(x => x.Name == _vehicleobjectname);
List<Rectangle> listE = collection.ToList<Rectangle>();
for (int e = 0; e < listE.Count; e++)
vc.ZoomableCanvas.Children.Remove(listE[e]);
// Assign X and Y Position from Vehicle
double drawingX = vc.gCurrentX * GlobalVar.DrawingQ;
double drawingY = vc.gCurrentY * GlobalVar.DrawingQ;
// Scale Length and Width of Vehicle
double tractorWidthScaled = vc.tractorWidth * GlobalVar.DrawingQ;
double tractorLengthScaled = vc.tractorLength * GlobalVar.DrawingQ;
// Get Drawing Location
double _locationX = drawingX - (tractorLengthScaled / 2);
double _locationY = drawingY - ((tractorWidthScaled / 2));
RotateTransform rotation = new RotateTransform();
// Angle in 10th of a Degree
rotation.Angle = vc.gCurrentTheeta/10 ;
double i = 0;
//paint the node
Rectangle _rectangle = new Rectangle();
_rectangle.Stroke = new SolidColorBrush((Color)ColorConverter.ConvertFromString(vc.VehicleColor == "" ? "Black" : vc.VehicleColor));
_rectangle.Fill = new SolidColorBrush((Color)ColorConverter.ConvertFromString(vc.VehicleColor == "" ? "Black" : vc.VehicleColor));
i += 0;
_rectangle.Width = tractorLengthScaled ;
_rectangle.Height = tractorWidthScaled;
rotation.CenterX = _rectangle.Width / 2;
rotation.CenterY = _rectangle.Height / 2;
_rectangle.RenderTransform = rotation;
Canvas.SetTop(_rectangle, _locationY + i);
Canvas.SetLeft(_rectangle, _locationX + i);
_rectangle.SetValue(ZoomableCanvas.ZIndexProperty, 2);
string _tooltipmsg = "Canvas: " + vc.ZoomableCanvas.Name;
// Assign ToolTip Values for User
_tooltipmsg += "\nX: " + vc.gCurrentX;
_tooltipmsg += "\nY: " + vc.gCurrentY;
_rectangle.ToolTip = _tooltipmsg;
_rectangle.Name = _vehicleobjectname;
//add to the canvas
vc.ZoomableCanvas.Children.Add(_rectangle);
}
Note: VehicleClass holds all the Values for a certain Vehicle. DrawingQ holds the transformation scale from Reality to Zoomable Canvas.
So the issues I forsee:
How to append the Size of a Jpeg file to get the size same as
Rectangle?
What kind of Shape object shall I use? Please
suggest.
If i undrestand you correctly. you wanted to show an image of the vechicle inside the rectangle. in order to do that you can use
ImageBrush and assign to the Rectangle Fill property
something like this
Rectangle rect = new Rectangle();
rect.Width = 100;
rect.Height = 100;
ImageBrush img = new ImageBrush();
BitmapImage bmp = new BitmapImage();
bmp.BeginInit();
bmp.UriSource = new Uri("vehicle image path");
bmp.EndInit();
img.ImageSource = bmp;
rect.Fill = img;
I hope that helps
I have a uniform grid that has rectangles dynamically added to it. I want to remove a particular rectangle, but I am getting the following error when trying to pass it to the Remove method:
Cannot convert from 'System.Drawing.Rectangle' to 'System.Windows.UIElement'
My code is:
Rectangle swatch = (Rectangle)ug_Thumbnails.FindName("s_" + _instance);
ug_Thumbnails.Children.Remove(swatch);
I tried casting, and got an error saying that you couldn't do it.
EDIT: Per request, here's the code to create the rectangle:
System.Windows.Shapes.Rectangle swatch = new System.Windows.Shapes.Rectangle();
swatch.Width = 50;
swatch.Height = 50;
swatch.Margin = new Thickness(0, 5, 5, 0);
swatch.StrokeThickness = 1;
swatch.Stroke = System.Windows.Media.Brushes.Gray;
swatch.Name = "s_" + name.ToString();
double groupsize = 100 / colors.Count();
DrawingBrush blackBrush = new DrawingBrush();
DrawingGroup checkersDrawingGroup = new DrawingGroup();
List<SolidColorBrush> brushes = colors;
double location = 0;
for (int i = 0; i < colors.Count(); i++)
{
GeometryDrawing drawing = new GeometryDrawing(brushes[i], null,
new RectangleGeometry(new Rect(location, 0, groupsize, groupsize)));
checkersDrawingGroup.Children.Add(drawing);
location += groupsize;
}
blackBrush.Drawing = checkersDrawingGroup;
swatch.Fill = blackBrush;
swatch.MouseUp += new MouseButtonEventHandler(loadSwatchResources);
ug_Thumbnails.Children.Add(swatch);
You need to use the Rectangle in System.Windows.Shapes when trying to reference a rectangle in WPF. This is specifically for rectangles in WPF and as such is a bit different than the System.Drawing rectangle class. You should be able to cast to this version of rectangle since it derives from FrameworkElement. See http://msdn.microsoft.com/en-us/library/system.windows.shapes.rectangle(v=vs.110).aspx for more info.
I have a Canvas in my WPF application. I am adding the Rectangle on button click. The Width is Fixed but, Height is value entered by user in TextBox/GridCell.
When i add rectangle on Canvas with specifying Height. it adds the rectangle but, it doesnt appear one after other. Any idea?
In .xaml.cs:
int width=200;
Reactangle rect;
static int val=0;
Protected void Add()
{
rect = new Rectangle();
rect.Stroke = Brushes.Red;
rect.StrokeThickness = 1;
rect.Height = Convert.ToInt32(txtheight.Text);
rect.Width = width;
Canvas.SetLeft(rect,100);
Canvas.SetTop(rect,rect.Height);
rect.Tag = val;
canvasboard.Children.Add(rect);
val=val+1;
}
This adds Rectangle but not Exactly one after other on canvas.
<Canvas Name="canvasboard" Background="White" Margin="2">
</Canvas>
<TextBox Name="txtheight" Width="150"/>
Note: I cant use WrapPanel or StackPanel for this form. and want to make changes in existing code.
Help Appreciated!
If all your adding is sequential elements vertically into this Canvas, you can do it without having to add a new variable in class scope as well.
private void Add() {
rect = new Rectangle {
Stroke = Brushes.Red,
StrokeThickness = 1,
Height = Convert.ToDouble(txtheight.Text),
Width = width
};
Canvas.SetLeft(rect, 100);
double canvasTop = 0.0;
if (canvasboard.Children.Count > 0) {
var lastChildIndex = canvasboard.Children.Count - 1;
var lastChild = canvasboard.Children[lastChildIndex] as FrameworkElement;
if (lastChild != null)
canvasTop = Canvas.GetTop(lastChild) + lastChild.Height + 1;
}
Canvas.SetTop(rect, canvasTop);
rect.Tag = val++;
canvasboard.Children.Add(rect);
}
Try storing a local variable that maintains the combined height of all Rectangles:
private double _top = 0;
protected void Add()
{
var rect = new Rectangle();
rect.Stroke = Brushes.Red;
rect.StrokeThickness = 1;
rect.Height = double.Parse(txtheight.Text);
rect.Width = 20;
Canvas.SetLeft(rect, 100);
Canvas.SetTop(rect, _top);
_top += rect.Height;
rect.Tag = val;
canvasboard.Children.Add(rect);
val = val + 1;
}
I have a a PictureBox on my Windows Forms.
I am drawing a Rectangle on the PictureBox, with ControlPaint.DrawReversibleFrame(), and want to code some boundaries, so I am only drawing on the PictureBox and not the whole screen.
How do I find the screen-coordinates of the topleft point of the PictureBox?
EDIT with solution: Here's my solution, if anybody need to code some PictureBox boundaries.
if (_isDragging) // If the mouse is being dragged, undraw and redraw the rectangle as the mouse moves.
{
pictureBoxMap.Refresh();
ControlPaint.DrawReversibleFrame(_theRectangleScreenCoords, BackColor, FrameStyle.Dashed); // Hide the previous rectangle by calling the DrawReversibleFrame method with the same parameters.
Point endPoint = ((Control)sender).PointToScreen(new Point(e.X, e.Y));
var topLeftPictureBoxMap = pictureBoxMap.PointToScreen(new Point(0, 0));
int width = endPoint.X - _startPointTheRectangleScreenCoords.X;
int height = endPoint.Y - _startPointTheRectangleScreenCoords.Y;
// limit rectangle in x-axis
var diff_x = pictureBoxMap.Width - (_startPointTheRectangleScreenCoords.X - topLeftPictureBoxMap.X);
var diff_x_2 = (pictureBoxMap.Width - (_startPointTheRectangleScreenCoords.X - topLeftPictureBoxMap.X)) - pictureBoxMap.Width;
if (width > diff_x)
{
width = diff_x;
}
else if(width < diff_x_2)
{
width = diff_x_2;
}
// limit rectangle i y-aksen
var diff_Y = pictureBoxMap.Height - (_startPointTheRectangleScreenCoords.Y - topLeftPictureBoxMap.Y);
var diff_Y_2 = (pictureBoxMap.Height - (_startPointTheRectangleScreenCoords.Y - topLeftPictureBoxMap.Y)) - pictureBoxMap.Height;
if (height > diff_Y)
{
height = diff_Y;
}
else if(height < diff_Y_2)
{
height = diff_Y_2;
}
_theRectangleScreenCoords = new Rectangle(
_startPointTheRectangleScreenCoords.X,
_startPointTheRectangleScreenCoords.Y,
width,
height);
ControlPaint.DrawReversibleFrame(_theRectangleScreenCoords, Color.Red, FrameStyle.Dashed); // Draw the new rectangle by calling DrawReversibleFrame again.
}
Use Control.PointToScreen( new Point(0, 0) ) where Control is your PictureBox.
See http://msdn.microsoft.com/en-us/library/system.windows.forms.control.pointtoscreen.aspx