ItemsControl에서 WPF의 드래그 가능한 객체는 무엇입니까?

Question

드래그 가능한 항목이있는 ItemsControl을 구현할 수 있기를 원합니다. ItemsControl의 이유는 백그라운드에서 내 ViewModel에 바인딩 할 수 있기 때문입니다.

저는 캔버스에서 엄지 컨트롤을 사용해 보았습니다. 그리고 ItemsControl에 고정 시키 자마자 작업을 멈추는 것을 제외하고는 완벽하게 작동합니다. 여기에 내가 뭘하려 :

 <ItemsControl ItemsSource="{Binding MyItems}"> 
     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <Thumb Canvas.Left="0" Canvas.Top="0" Width="50" Height="50" DragDelta="MyThumb_DragDelta"/> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
     <ItemsControl.ItemsPanel> 
      <ItemsPanelTemplate> 
       <Canvas /> 
      </ItemsPanelTemplate> 
     </ItemsControl.ItemsPanel> 

    </ItemsControl> 

코드 숨김

public partial class MainWindow : Window 
{ 
    public MainWindow() 
    { 
     InitializeComponent(); 

     DataContext = new MainViewModel(); 
    } 

    private void MyThumb_DragDelta(object sender, System.Windows.Controls.Primitives.DragDeltaEventArgs e) 
    { 
     Canvas.SetLeft((UIElement)sender, Canvas.GetLeft((UIElement)sender) + e.HorizontalChange); 
     Canvas.SetTop((UIElement)sender, Canvas.GetTop((UIElement)sender) + e.VerticalChange); 
    } 

그리고 마지막으로 내 뷰 모델 : 잘 작동

public class MainViewModel : DependencyObject 
{ 
    public ObservableCollection<Note> MyItems { get; set;} 


    public MainViewModel() 
    { 
     MyItems = new ObservableCollection<Note>(); 
     MyItems.Add(new Note(){Name="test"}); 
    } 

} 

public class Note : INotifyPropertyChanged 
{ 
    public event PropertyChangedEventHandler PropertyChanged; 

    private string name; 

    public string Name 
    { 
     get { return name; } 
     set 
     { 
      name = value; 
      if(PropertyChanged!=null) PropertyChanged(this,new PropertyChangedEventArgs("Name")); 
     } 
    } 


} 

나는 창에서 다음을 수행하십시오

<Canvas> 
     <Thumb Canvas.Left="0" Canvas.Top="0" Width="50" Height="50" DragDelta="MyThumb_DragDelta"/>    
    </Canvas> 

하지만 내가 가지고있을 때 temsControl은 더 이상 작동하지 않습니다. ItemsControl이 마우스 이벤트 등록 중이고 Thumb를 재정의한다고 가정합니다.

누구나이 솔루션을 사용할 수있는 좋은 해결책이 있습니까? 스타일

<Style x:Key="ThumbStyle"> 
    <Setter Property="Canvas.Left" Value="{Binding Path=Left}"/> 
    <Setter Property="Canvas.Top" Value="{Binding Path=Top}"/> 
    <!-- more if required --> 

</Style> 

를 통해 캔버스 바인딩 속성을 설정

Answer 1

벤 내가 그 접근 방식은 처음에는 일을하지만 더 실험 후 생각하지 않았다 알았다.

문제는 다음과 같이 요약 될 수 있습니다. 항목 컨트롤에서 Canvas.Top 및 Canvas.Left가 작동하지 않습니다. 그러나 스타일이 문제를 해결할 수있는 방법이라는 것이 맞습니다.

<ItemsControl ItemsSource="{Binding Notes}"> 
     <ItemsControl.ItemsPanel> 
      <ItemsPanelTemplate> 
       <Canvas /> 
      </ItemsPanelTemplate> 
     </ItemsControl.ItemsPanel> 
     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <Thumb Width="150" Height="150" DragDelta="Thumb_DragDelta" /> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
     <ItemsControl.ItemContainerStyle> 
      <Style> 
       <Setter Property="Canvas.Left" Value="{Binding X}" /> 
       <Setter Property="Canvas.Top" Value="{Binding Y}" /> 
      </Style> 
     </ItemsControl.ItemContainerStyle> 
    </ItemsControl> 

그리고 숨김 : 답장을

이

public partial class MainWindow : Window 
{ 
    public ObservableCollection<Note> Notes { get; set; } 

    public MainWindow() 
    { 
     InitializeComponent(); 

     DataContext = this; 

     Notes = new ObservableCollection<Note>(); 
     Notes.Add(new Note(){Title="test", X=100, Y=0}); 
    } 

    private void Thumb_DragDelta(object sender, System.Windows.Controls.Primitives.DragDeltaEventArgs e) 
    { 
     Note n = (Note)((FrameworkElement)sender).DataContext; 
     n.X += e.HorizontalChange; 
     n.Y += e.VerticalChange; 
    } 
} 

public class Note : INotifyPropertyChanged 
{ 
    private string title; 
    private double x; 
    private double y; 

    public double Y 
    { 
     get { return y; } 
     set 
     { 
      y = value; 
      if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs("Y")); 
     } 
    } 

    public double X 
    { 
     get { return x; } 
     set 
     { 
      x = value; 
      if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs("X")); 
     } 
    } 


    public string Title 
    { 
     get { return title; } 
     set 
     { 
      title = value; 
      if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs("Title")); 
     } 
    } 

    public event PropertyChangedEventHandler PropertyChanged; 

Answer 2

봅니다 그런 다음 엄지 손가락이된다 :

<Thumb Style={StaticResource ThumbStyle}" ... />