Infragistics｜Ultimate UI for WPF｜XamDataCards 拖放

這是透過拖放 XamDataCards 卡來更改其位置的範例。

Infragistics 拖放框架已合併到代表 XamDataCards 卡的 Border 元素 (x:Name=”Bd”) 中。

<Style TargetType="{x:Type igDP:CardViewCard}">     ...     <Setter Property="Template">         <Setter.Value>             <ControlTemplate TargetType="{x:Type igDP:CardViewCard}">                 <Border x:Name="Bd"                     ...>                     <Grid>                         <Grid.RowDefinitions>                             <RowDefinition Height="Auto"/>                             <RowDefinition Height="*"/>                         </Grid.RowDefinitions>                         ...                     </Grid>                     <--追加-->                     <ig:DragDropManager.DragSource>                         <ig:DragSource IsDraggable="True" Drop="DragSource_Drop" />                     </ig:DragDropManager.DragSource>                     <ig:DragDropManager.DropTarget>                         <ig:DropTarget IsDropTarget="True" />                     </ig:DragDropManager.DropTarget>                     <--追加-->                 </Border>                 <ControlTemplate.Triggers>                     ...                 </ControlTemplate.Triggers>             </ControlTemplate>         </Setter.Value>     </Setter> </Style>

現在您可以拖放卡片。當卡片放下時，處理 DragSource.Drop 事件並交換卡片的位置。

private void DragSource_Drop(object sender, Infragistics.DragDrop.DropEventArgs e) {     // ドラッグしたカード     var draggedCard = e.DragSource as Border;     // ドロップされたカード     var droppedCard = e.DropTarget as Border;     // カードにバインドされているデータ     var draggedEmployee = (draggedCard.DataContext as DataRecord).DataItem as Employee;     var droppedEmployee = (droppedCard.DataContext as DataRecord).DataItem as Employee;      var employees = this.DataContext as ObservableCollection;     var index = employees.IndexOf(droppedEmployee);          // カードデータの入れ替え     employees.Remove(draggedEmployee);     employees.Insert(index, draggedEmployee); }