C# 通用应用程序：拖动时的图像前景

Question

我有这个益智游戏，我可以在游戏场上拍电影。

我最近添加了一种触摸屏方式来做到这一点，它可以工作，但有一个问题。当我将图像从一个地方移动到另一个地方时，拖动的图像在背景中，其他图像在前景中，我想以另一种方式显示，请参见屏幕截图。 1

我的 delta 函数是这样的：

   public void Touch_Delta(object sender, Windows.UI.Xaml.Input.ManipulationDeltaRoutedEventArgs e)
    {
        Image img_touched = (Image)sender;


        TranslateTransform _Transform = (img_touched.RenderTransform = (img_touched.RenderTransform as TranslateTransform) ?? new TranslateTransform()) as TranslateTransform;
        _Transform.X += e.Delta.Translation.X;
        _Transform.Y += e.Delta.Translation.Y;

        if(_Transform.X > 90.0)
        {
            img_touched.RenderTransform = null;
            Move_Right(this, null);
        }
        else if(_Transform.X < -90)
        {
            img_touched.RenderTransform = null;
            Move_Left(this, null);
        }
        else if (_Transform.Y > 90.0)
        {
            img_touched.RenderTransform = null;
            Move_Down(this, null);
        }
        else if (_Transform.Y < -90.0)
        {
            img_touched.RenderTransform = null;
            Move_Up(this, null);
        }

        Rotate_Touch += e.Delta.Rotation;
        if(Rotate_Touch > 55.0)
        {
            Rotate_Right(this, null);
            Rotate_Touch = 0;
        }
        else if(Rotate_Touch < -55.0)
        {
            Rotate_Left(this, null);
            Rotate_Touch = 0;
        }

    }

对应的XAML是这样的：

<UserControl
    x:Class="PictureSplitter.Views.PictureView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="768"
    d:DesignWidth="1024">

    <Grid Height="1000" Width="600" Background="Black">
    <GridView ItemsSource="{Binding Splitter.PuzzlePositions}" Background="Black">
        <GridView.ItemTemplate>
            <DataTemplate>
                <Border BorderBrush="#FF888E91" BorderThickness="2" Background="Black">
                    <Grid Name="picGrid" Background="Black" >
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"></RowDefinition>
                            <RowDefinition Height="Auto"></RowDefinition>
                            <RowDefinition Height="Auto"></RowDefinition>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                        </Grid.ColumnDefinitions>

                            <Image Source="{Binding Piece.ImageSource}" Tapped="Image_Tapped" ManipulationMode="All" CanDrag="False" Loaded="Load_Events" />
                    </Grid>
                </Border>
            </DataTemplate>
        </GridView.ItemTemplate>
    </GridView>
    </Grid>
</UserControl>

我知道 Windows.Canvas 中有一个 zindex，但我没有在这里找到类似的东西。有办法吗？

Answer 1

通常情况下，如果没有 z-index，元素将遵循它们原来的 z 顺序 written/generated - 我想如果您尝试将第 3 个元素移到第 2 个元素上，它会位于它:)

现在不使用 canvas 我不认为你可以这样做，因为即使是新的 Transform3D 东西也尊重原始的 Z 顺序，所以如果你移动一个项目 "above" 其他(translate-z: +1) 它仍然会被绘制在下一个之后。

有了这一切：使用 canvas - 无论如何这对游戏来说更好 ;)

C# 通用应用程序：拖动时的图像前景

C# Universal App: Image foreground while dragging

c#

windows

xaml

touch

uwp