¿Cómo arrastrar y colocar en WPF en mi aplicación "Metro Style"?

Question

Estoy intentando crear una imitación primitiva de la aplicación de estilo Windows Metro. Lo que he hecho hasta ahora es agregar nuevos mosaicos a la ventana en ObservableCollection, puedo cambiar su color y eliminarlos usando ContextMenu. Ahora quiero hacer Arrastrar y soltar con una vista previa real del arrastre (con mosaico semitransparente). Traté de hacerlo solo con muchos tutoriales que describen la clase DragDrop en WPF, pero tengo que admitir que no puedo entenderlo y necesito ayuda. Traté de seguir: this tutorial. Aquí hay una screenshot de mi aplicación: Y mi código:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Data; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Imaging; 
using System.Windows.Navigation; 
using System.Windows.Shapes; 
using System.Collections.ObjectModel; 

namespace Metro_Pawel_Michna 
{ 
    /// <summary> 
    /// Interaction logic for MainWindow.xaml 
    /// </summary> 
    public partial class MainWindow : Window 
    { 
     private ObservableCollection<myButton> _tiles = new ObservableCollection<myButton>(); 
     Random r = new Random(); 
     private int index = -1; 
     private List<Color> myColors = new List<Color>(); 
     public MainWindow() 
     { 
      InitializeComponent(); 
      this.DataContext = _tiles; 
      webBrowser.Visibility = Visibility.Collapsed; 
      btnClose.Visibility = Visibility.Collapsed; 
      myColors.Add(Colors.DarkCyan); 
      myColors.Add(Colors.Black); 
      myColors.Add(Colors.DarkGoldenrod); 
      myColors.Add(Colors.DarkBlue); 
      myColors.Add(Colors.DarkGray); 
      myColors.Add(Colors.DarkKhaki); 
     } 

     private void btnAdd_Click(object sender, RoutedEventArgs e) 
     { 
      myButton b = new myButton(); 
      b.Content = txtUrl.Text; 
      b.MouseDoubleClick += new MouseButtonEventHandler(tileDbl_Click); 
      b.MouseRightButtonUp += new MouseButtonEventHandler(b_MouseRightButtonUp); 

      Color random = new Color(); 
      int losuj = r.Next(6); 
      b.colorIndex = losuj; 

      random = myColors.ElementAt(losuj); 

      LinearGradientBrush lgb = new LinearGradientBrush(Colors.White, random, 45); 
      lgb.StartPoint = new Point(-0.5,-0.5); 
      lgb.EndPoint = new Point(1, 1); 
      b.Background = lgb; 
      _tiles.Add(b); 
     } 

     private void tileDbl_Click(object sender, RoutedEventArgs e) 
     { 
      const string http = "http://"; 
      const string https = "https://"; 
      string address = (sender as Button).Content.ToString(); 

      if (String.Compare(http, 0, address, 0, 6) == 0 && address.Length > 7) webBrowser.Navigate(address); 
      else if (String.Compare(https, 0, address, 0, 7) == 0 && address.Length > 8) webBrowser.Navigate(address); 
      else webBrowser.Navigate("http://www.google.com/search?q=" + address); 

      tilesBox.Visibility = Visibility.Collapsed; 
      btnClose.Visibility = Visibility.Visible; 
      txtUrl.Visibility = Visibility.Collapsed; 
      btnAdd.Visibility = Visibility.Collapsed; 
      toolbar.HorizontalAlignment = HorizontalAlignment.Right; 
      webBrowser.Visibility = Visibility.Visible; 
     } 

     private void btnClose_Click(object sender, RoutedEventArgs e) 
     { 
      tilesBox.Visibility = Visibility.Visible; 
      btnClose.Visibility = Visibility.Collapsed; 
      txtUrl.Visibility = Visibility.Visible; 
      btnAdd.Visibility = Visibility.Visible; 
      toolbar.HorizontalAlignment = HorizontalAlignment.Left; 
      webBrowser.Visibility = Visibility.Collapsed; 
     } 

     private void Remove_Click(object sender, RoutedEventArgs e) 
     { 
      _tiles.RemoveAt(index); 
     } 

     private void b_MouseRightButtonUp(object sender, RoutedEventArgs e) 
     { 
      index = _tiles.IndexOf(sender as myButton); 
     } 

     private void ChangeColor_Click(object sender, RoutedEventArgs e) 
     { 
      myButton b = _tiles.ElementAt(index); 
      LinearGradientBrush lgb; 
      if (b.colorIndex != myColors.Count - 1) 
       lgb = new LinearGradientBrush(Colors.White, myColors.ElementAt(++b.colorIndex), 45); 
      else 
      { 
       lgb = new LinearGradientBrush(Colors.White, myColors.ElementAt(0), 45); 
       b.colorIndex = 0; 
      } 
      lgb.StartPoint = new Point(-0.5, -0.5); 
      lgb.EndPoint = new Point(1, 1); 
      b.Background = lgb; 
     } 
    } 
} 

XAML:

<Window x:Class="Metro_Pawel_Michna.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:Metro_Pawel_Michna="clr-namespace:Metro_Pawel_Michna" 
     Title="MainWindow" Height="350" Width="525" MinWidth="180" MinHeight="200"> 
    <DockPanel LastChildFill="True"> 
     <ToolBarTray Name="toolbar" DockPanel.Dock="Top"> 
      <ToolBar> 
       <TextBox Name="txtUrl">Type an URL</TextBox> 
       <Button Name="btnAdd" Click="btnAdd_Click">Add</Button> 
       <Button Name="btnClose" Click="btnClose_Click">Close</Button> 
      </ToolBar> 
     </ToolBarTray> 
     <WebBrowser Height="auto" Name="webBrowser" Width="auto" /> 
     <ScrollViewer> 
      <ItemsControl Name="tilesBox" ItemsSource="{Binding}"> 
       <ItemsControl.ContextMenu> 
        <ContextMenu Name="contextMenu"> 
         <MenuItem Header="Remove" Click="Remove_Click"/> 
         <MenuItem Header="Change color" Click="ChangeColor_Click"/> 
        </ContextMenu> 
       </ItemsControl.ContextMenu> 
       <ItemsControl.Resources> 
        <Style TargetType="{x:Type Metro_Pawel_Michna:myButton}"> 
         <Setter Property="Width" Value="120"/> 
         <Setter Property="Height" Value="120"/> 
         <Setter Property="Margin" Value="10"/> 
         <Setter Property="Foreground" Value="White" /> 
         <Setter Property="Template"> 
          <Setter.Value> 
           <ControlTemplate> 
            <Grid> 
             <Rectangle Fill="{TemplateBinding Background}" /> 
             <ContentPresenter Content="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}" VerticalAlignment="Center" HorizontalAlignment="Center" /> 
            </Grid> 
           </ControlTemplate> 
          </Setter.Value> 
         </Setter> 
        </Style> 
       </ItemsControl.Resources> 

       <ItemsControl.ItemsPanel> 
        <ItemsPanelTemplate> 
         <WrapPanel /> 
        </ItemsPanelTemplate> 
       </ItemsControl.ItemsPanel> 
      </ItemsControl> 
     </ScrollViewer> 

    </DockPanel> 

</Window> 

Answer 1

Usted puede tratar de utilizar algunos de arrastrar & marco gota a implementar esta funcionalidad, como gong-WPF-dragdrop -

La biblioteca GongSolutions.Wpf.DragDrop es un marco de arrastrar y soltar para WPF. Tiene las siguientes características:

• Funciona con MVVM: la lógica para arrastrar y soltar se puede colocar en un ViewModel. No es necesario colocar ningún código en el código subyacente; en su lugar, , las propiedades adjuntas se utilizan para vincular a un controlador de arrastrar/soltar en un ViewModel.
• Funciona con múltiples selecciones.
• Puede arrastrar datos dentro del mismo control para reordenar, o entre controles.

http://code.google.com/p/gong-wpf-dragdrop/

reordenamiento es lo que busca ...

En caso de que no desee utilizar cualquier marco de entonces sugeriría que ir a través de estos artículos -

How can I drag and drop items between data bound ItemsControls? || WayBack Link

http://www.codeproject.com/Articles/37161/WPF-Drag-and-Drop-Smorgasbord

e ir a través del código fuente de algunos controles de aplicación de arrastrar & gota -

Drag and Drop Controls