Dans l’optique de créer un système de gestion multi-documents ou multi-fenêtres  à l’intérieur d’une application Silverlight, il est utile de comprendre les base du drag and drop.

Les éléments enfants d’un canvas sont disposé dans ce dernier grâce à 3 dependency properties.

Ces propriétés sont :

  • Canvas.Top : axe y
  • Canvas.Left : axe x
  • Canvas.ZIndex : axe z

Pour modifier la valeur de ces propriété à partir du code behind de l’application il faut utiliser la méthode :

<Canvas Background="LightBlue" Name="MDIRoot">


      <Canvas Name="MDI1"
                    Background="Silver"
                    Width="200"
                    Height="150"
                    Canvas.Left="50"
                    Canvas.Top="50"
                    Canvas.ZIndex="1"
                    MouseLeftButtonDown="MDISelectCanvas"
                    MouseLeftButtonUp="MDIUnselectCanvas"
                    MouseLeave="MDILeaveCanvas"/>


      <Canvas Name="MDI2"
                    Background="Yellow"
                    Width="200"
                    Height="150"
                    Canvas.Left="100"
                    Canvas.Top="100"
                    Canvas.ZIndex="0"
                    MouseLeftButtonDown="MDISelectCanvas"
                    MouseLeftButtonUp="MDIUnselectCanvas"
                    MouseLeave="MDILeaveCanvas"/>


</Canvas>

[code:c#]       
Point? OrigineMDIMove;

private void MDISelectCanvas(object sender, MouseButtonEventArgs e)
{
    Canvas c = (Canvas)sender;
    OrigineMDIMove = e.GetPosition(MDIRoot);
    c.MouseMove += MDIMoveCanvas;

    c.SetValue(Canvas.ZIndexProperty,(Int32)
   MDIRoot.Children.Max(i=>i.GetValue(Canvas.ZIndexProperty))+1);
}

private void MDIUnselectCanvas(object sender, MouseButtonEventArgs e)
{
     Canvas c = (Canvas)sender;
     c.MouseMove -= MDIMoveCanvas;
     OrigineMDIMove = null;
}

 private void MDIMoveCanvas(object sender, MouseEventArgs e)
{
     if (!OrigineMDIMove.HasValue) return;

     Canvas c = (Canvas)sender;
     Point DestinationMDIMove = e.GetPosition(MDIRoot);
     Point MDIMove = new Point()
     {
         X = OrigineMDIMove.Value.X - DestinationMDIMove.X,
         Y = OrigineMDIMove.Value.Y - DestinationMDIMove.Y
      };

      c.SetValue(Canvas.TopProperty,
          ((double)c.GetValue(Canvas.TopProperty) - MDIMove.Y));

       c.SetValue(Canvas.LeftProperty,
          ((double)c.GetValue(Canvas.LeftProperty) - MDIMove.X));

       OrigineMDIMove = DestinationMDIMove;
}

private void MDILeaveCanvas(object sender, MouseEventArgs e)
{
    Canvas c = (Canvas)sender;
    c.MouseMove -= MDIMoveCanvas;
    OrigineMDIMove = null;
}

 image