c# - 在银行账户列表中拖放 UWP

Question

我有一个本地银行的通用 Windows 应用程序，我正在处理汇款 View ，他们需要使用 UWP 应用程序中的拖放功能将资金从一个账户转移到另一个账户。

我已经制作了动画部分，但是在将列表项拖放到“Account To”列表后我需要帮助。

我将附上屏幕截图以明确说明。

正如您在图片中看到的，我需要从“From Account”列表中拖出一个项目并将其放到“To Account”列表中的一个项目上。我怎样才能做到这一点？

Answer 1

我创建了 a small sample它显示了两个 ListViews 之间的拖放，其中填充了一些 Accounts。我将跳过 UserControls 的实现 - Page xaml 如下所示:

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="200"/>
        <RowDefinition Height="200"/>
    </Grid.RowDefinitions>

    <ListView Header="Source" Margin="10" Grid.Row="0" CanDragItems="True" ItemsSource="{x:Bind Accounts}" SelectionMode="None">
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsStackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
        <ListView.ItemTemplate>
            <DataTemplate>
                <controls:AccountControl CanDrag="True" DragStarting="AccountControl_DragStarting"/>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

    <ListView Header="Targets" Margin="10" Grid.Row="1" ItemsSource="{x:Bind Accounts}" SelectionMode="None">
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsStackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
        <ListView.ItemTemplate>
            <DataTemplate>
                <controls:AccountControl AllowDrop="True" DragEnter="AccountControl_DragEnter" Drop="AccountControl_Drop"/>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

如您所见，有一个 Source 列表，其中控件在被拖动时会触发一个事件。

private void AccountControl_DragStarting(UIElement sender, DragStartingEventArgs args)
{
    if ((sender as AccountControl)?.DataContext is Account account)
    {
        args.AllowedOperations = DataPackageOperation.Link;
        args.Data.SetData(accountId, account.Id);
    }
}

除了 name 和 balance 之外，Account 类有一个 Guid 标识符，因此我可以用它来传递在转账方法中使用了哪个源帐户的信息。

第二个列表中的项目 (Targets) 只接受放置操作，为此会触发两个事件:

private void AccountControl_DragEnter(object sender, DragEventArgs e)
{
    e.AcceptedOperation = DataPackageOperation.Link;
    e.DragUIOverride.Caption = "Transfer";
}

private async void AccountControl_Drop(object sender, DragEventArgs e)
{
    if ((e.OriginalSource as AccountControl)?.DataContext is Account targetAccount)
        if (await (e.DataView.GetDataAsync(accountId)) is Guid sourceAccountId)
        {
            var sourceAccount = Accounts.First(x => x.Id == sourceAccountId);
            sourceAccount.Balance -= 1000;
            targetAccount.Balance += 1000;
        }
}

第一个为用户设置接受的操作和一些信息。第二个将一些钱从一个帐户“转移”到第二个帐户。

一切看起来像这样:

您可以在 MS directly 找到更多帮助, other article在MS samples repository .