Josh Theman
Josh Theman

Reputation: 3

Placing an image using x and y Coordinates in a WPF application

I'm currently trying to insert random images onto a canvas using mouse click coordinates. However, I am unsure where the X & Y coordinates would be placed in the code. Any pointers would be great thanks!

        private void canvas1_MouseDown(object sender, System.Windows.Input.MouseButtonEventArgs e)
        {
            Point p = Mouse.GetPosition(canvas1);
            double x = p.X;
            double y = p.Y;

            Image myImage = new Image();
            string[] imageNames = { "greenslime.png", "blueslime.png", "redslime.png", "yellowslime.png" };
            var rand = new Random();
            string imageName = imageNames[rand.Next(imageNames.Length)];

            string imageSlime = string.Concat("", imageName);            
            myImage.Source = new BitmapImage(new Uri(imageSlime, UriKind.Relative));
            myImage.Width = 200;
            myImage.Height = 200;

            canvas1.Children.Add(myImage);
        }

Upvotes: 0

Views: 1202

Answers (1)

Jeroen van Langen
Jeroen van Langen

Reputation: 22038

You should use the Canvas.Top/Canvas.Left attached dependency properties.

In code behind you should use:

myImage.Source = new BitmapImage(new Uri(imageSlime, UriKind.Relative));
myImage.Width = 200;
myImage.Height = 200;
Canvas.SetLeft(myImage, x);
Canvas.SetTop(myImage, y);
canvas1.Children.Add(myImage);

Because the image is placed in the canvas, the canvas will use these properties.


In XAML it would be:

<Canvas x:Name="canvas1">
    <Image Canvas.Top="10" Canvas.Left="20" Width="200" Height="200" />
</Canvas>

Upvotes: 1

Related Questions