如何使用常用方法拖放控件？

Question

我有以下XAML代码，该代码在一个较大的父堆栈面板中创建两个堆栈面板。 我希望能够在父bigStack面板中拖动每个小堆栈面板。

XAML

<StackPanel BorderThickness="1" BorderBrush="Black" x:Name="bigStack">
        <StackPanel x:Name="smallStack1" ManipulationMode="All" ManipulationDelta="objectManipulationDelta" ManipulationStarting="objectManipulationStarting">
            <TextBlock Text="John Doe"/>
            <TextBlock Text="CEO"/>
        </StackPanel>
        <StackPanel x:Name="smallStack2" ManipulationMode="All" ManipulationDelta="objectManipulationDelta" ManipulationStarting="objectManipulationStarting">
            <TextBlock Text="Jane Doe"/>
            <TextBlock Text="CTO"/>
        </StackPanel>
</StackPanel>

C＃后端：

private TranslateTransform dragtranslation ;

private void objectManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
    {
        dragtranslation.X += e.Delta.Translation.X;
        dragtranslation.Y += e.Delta.Translation.Y;

    }

private void objectManipulationStarting(object sender, ManipulationStartingRoutedEventArgs e)
    {
       var stackDragged = e.OriginalSource as StackPanel;

        dragtranslation = new TranslateTransform();
        stackDragged.RenderTransform = this.dragtranslation ;


    }

可在此处找到原始代码（Microsoft UWP官方文档），但根据我的需要进行了改编（显然是错误的）

问题1

1）第一次拖动smallStack1：确定

2）第二次拖动smallStack2：恢复到原始位置

问题2

1）第一次拖动smallStack1：确定

2）第一次拖动smallStack2：确定

3）再次拖动任一smallStack：恢复到原始位置

您可以在以下.gif文件中检查问题：

我希望达成的目标

使用通用方法拖动控件，因为我计划在bigStack面板中动态创建更多控件。

Answer 1

基本上，每次单击项目时，您都在重新实例化TranslateTransform 。 这就是为什么当您第二次单击该项目时，它会导航回到0,0 ，这是TranslateTransform的原始位置。

为了更轻松地处理此问题，这就是我要做的。

1）我会给smallStackPanel明确的TranslateTransform

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <StackPanel BorderThickness="1" BorderBrush="Black" x:Name="bigStack">
        <StackPanel x:Name="smallStack1" ManipulationMode="All" ManipulationDelta="objectManipulationDelta" >
            <StackPanel.RenderTransform>
                <TranslateTransform />
            </StackPanel.RenderTransform>
            <TextBlock Text="John Doe"/>
            <TextBlock Text="CEO"/>
        </StackPanel>
        <StackPanel x:Name="smallStack2" ManipulationMode="All" ManipulationDelta="objectManipulationDelta" >
            <StackPanel.RenderTransform>
                <TranslateTransform />
            </StackPanel.RenderTransform>
            <TextBlock Text="Jane Doe"/>
            <TextBlock Text="CTO"/>
        </StackPanel>
    </StackPanel>
</Grid>

然后，我在代码隐藏中所需要做的就是处理ManipulationDelta 。

private void objectManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
    var stackDragged = e.OriginalSource as StackPanel;
    (stackDragged.RenderTransform as TranslateTransform).X += e.Delta.Translation.X;
    (stackDragged.RenderTransform as TranslateTransform).Y += e.Delta.Translation.Y;
}

输出：

更新

从代码添加TranslateTransform

StackPanel sp = new StackPanel();
sp.RenderTransform = new TranslateTransform();

祝好运。