WPF contextMenu control for bring forward and send backward

Question

Having trouble with something here which I'm hoping is actually simple.

I have a custom UserControl in WPF which allows me to display an image. When the program is running a user can add this UserControl as many times as they like to a canvas. In effect a simple image viewer where they can add and move images about.

I would like to be able to right click these images open a contextMenu and then choose send backward of bring forward and the images would then change z order depending which menu choice was clicked.

I have the user control set up with the contextMenu so I just need to know the code for changing the z order of this userControl...

Any help is much appreciated :)

namespace StoryboardTool
{
    /// <summary>
    /// Interaction logic for CustomImage.xaml
    /// </summary>
    public partial class CustomImage : UserControl
    {
        private Point mouseClick;
        private double canvasLeft;
        private double canvasTop;

        public CustomImage()
        {
            InitializeComponent();
            cusImageControl.SetValue(Canvas.LeftProperty, 0.0);
            cusImageControl.SetValue(Canvas.TopProperty, 0.0);
        }

        public void chooseImage()
        {
            OpenFileDialog ofd = new OpenFileDialog();
            ofd.Title = "Choose Image to Add";

            if (ofd.ShowDialog() == true)
            {
                BitmapImage bImage = new BitmapImage();
                bImage.BeginInit();
                bImage.UriSource = new Uri(ofd.FileName);
                bImage.EndInit();

                image.Width = bImage.Width;
                image.Height = bImage.Height;
                image.Source = bImage;
                image.Stretch = Stretch.Fill;
            }
        }

        private void cusImageControl_LostMouseCapture(object sender, MouseEventArgs e)
        {
            ((CustomImage)sender).ReleaseMouseCapture();
        }

        private void cusImageControl_MouseUp(object sender, MouseButtonEventArgs e)
        {
            ((CustomImage)sender).ReleaseMouseCapture();
            cusImageControl.Cursor = Cursors.Arrow;
        }

        private void cusImageControl_MouseMove(object sender, MouseEventArgs e)
        {
            if ((((CustomImage)sender).IsMouseCaptured) && (cusImageControl.Cursor == Cursors.SizeAll))
            {

                Point mouseCurrent = e.GetPosition(null);
                double Left = mouseCurrent.X - mouseClick.X;
                double Top = mouseCurrent.Y - mouseClick.Y;
                mouseClick = e.GetPosition(null);
                ((CustomImage)sender).SetValue(Canvas.LeftProperty, canvasLeft + Left);
                ((CustomImage)sender).SetValue(Canvas.TopProperty, canvasTop + Top);
                canvasLeft = Canvas.GetLeft(((CustomImage)sender));
                canvasTop = Canvas.GetTop(((CustomImage)sender));

            }
            else if ((((CustomImage)sender).IsMouseCaptured) && (cusImageControl.Cursor == Cursors.SizeNWSE))
            {
                /*Point mouseCurrent = e.GetPosition(null);
                cusImageControl.Height = cusImageControl.canvasTop + mouseClick.Y;
                cusImageControl.Width = cusImageControl.canvasLeft + mouseClick.X;
                mouseClick = e.GetPosition(null);*/

            }
        }

        private void cusImageControl_MouseDown(object sender, MouseButtonEventArgs e)
        {
            mouseClick = e.GetPosition(null);
            canvasLeft = Canvas.GetLeft(((CustomImage)sender));
            canvasTop = Canvas.GetTop(((CustomImage)sender));
            ((CustomImage)sender).CaptureMouse();
        }

        private void ContextMenuBringForward_Click(object sender, RoutedEventArgs e)
        {
            MessageBox.Show("Bring Forward");

        }

        private void ContextMenuSendBackward_Click(object sender, RoutedEventArgs e)
        {
            MessageBox.Show("Send Backward");
        }

        private void ContextMenuMove_Click(object sender, RoutedEventArgs e)
        {
            cusImageControl.Cursor = Cursors.SizeAll;
        }   

        private void ContextMenuResize_Click(object sender, RoutedEventArgs e)
        {
            cusImageControl.Cursor = Cursors.SizeNWSE;
        }

    }
}

Answer 1

The following code works where selected is defined as my UserControl and set in the mouseDown event.

private void ContextMenuSendBackward_Click(object sender, RoutedEventArgs e)
        {
            Canvas parent = (Canvas)LogicalTreeHelper.GetParent(this);
            foreach (var child in parent.Children)
            {
                Canvas.SetZIndex((UIElement)child, 0);
            }
            Canvas.SetZIndex(selected, 1);
        }

Thanks to voo for all his help.

Answer 2

See Panel attached property Canvas.SetZIndex. Change z-Index of all elements to 0, and z-Index of your right-clicked control to 1.

void mouseUp(object sender, MouseButtonEventArgs e)
{
   foreach (var child in yourCanvas.Children) Canvas.SetZIndex(child, 0); 
   Canvas.SetZIndex((UIElement)sender, 1);
}