C# WPF使用箭头键移动图像

C# WPF使用箭头键移动图像,c#,wpf,xaml,C#,Wpf,Xaml,您好,我正在尝试制作一个蛇游戏,但是我不想使用形状,而是想使用头部图像和身体其他部分的其他图像。 我是WPF新手,我发现的所有教程都只使用形状。 此时,我希望能够通过使用箭头键移动图像,并最终在工作完成后检测与电路板上其他图像的碰撞。 这是我的主窗口xaml代码。它由一个简单的图像(DogeIcon)和另一个作为障碍物的图像(cat)组成 <Window x:Class="DogeSNake.MainWindow" xmlns="http://schemas.microsoft.c

您好,我正在尝试制作一个蛇游戏,但是我不想使用形状,而是想使用头部图像和身体其他部分的其他图像。 我是WPF新手,我发现的所有教程都只使用形状。 此时,我希望能够通过使用箭头键移动图像,并最终在工作完成后检测与电路板上其他图像的碰撞。 这是我的主窗口xaml代码。它由一个简单的图像(DogeIcon)和另一个作为障碍物的图像(cat)组成

<Window x:Class="DogeSNake.MainWindow"
    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"
    xmlns:local="clr-namespace:DogeSNake"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
<Grid>
    <Image Name="DogeIcon" HorizontalAlignment="Left" Height="64" Margin="33,27,0,0" VerticalAlignment="Top" Width="64" Source="media/doge.png" MouseEnter="RectangleMouseEnter" />
    <Image Name="CatIcon" HorizontalAlignment="Left" Height="40" Margin="445,247,0,0" VerticalAlignment="Top" Width="40" Source="media/cat.png" />
</Grid>


您需要的不是网格而是画布

<Window x:Class="DogeSNake.MainWindow"
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"
xmlns:local="clr-namespace:DogeSNake"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525" FocusManager.FocusedElement="{Binding ElementName=MyCanvas}">
    <Canvas Name="MyCanvas" KeyDown="Canvas_KeyDown" Focusable="True" >
            <Image Name="DogeIcon" Canvas.Left="10" Canvas.Top="10" HorizontalAlignment="Left" Height="64" Margin="0" VerticalAlignment="Top" Width="64" Source="media/doge.png" MouseEnter="RectangleMouseEnter"/>
            <Image Name="CatIcon"  Canvas.Left="200" Canvas.Top="200" HorizontalAlignment="Left" Height="40" Margin="0" VerticalAlignment="Top" Width="40" Source="media/cat.png"/>
    </Canvas>
</Window>

考虑到它应该成为一个“蛇游戏”,它还可以在网格上运行,并更改键输入上的列和行索引。重要的一点是,您需要定义适当数量的列和行,并且不要在图像上设置边距。
    private void Canvas_KeyDown(object sender, KeyEventArgs e)
    {
        if (e.Key == Key.Down)
        {
            Canvas.SetTop(DogeIcon, Canvas.GetTop(DogeIcon) + 10);
        }
        else if (e.Key == Key.Up)
        {
            Canvas.SetTop(DogeIcon, Canvas.GetTop(DogeIcon) - 10);
        }
        else if (e.Key == Key.Left)
        {
            Canvas.SetLeft(DogeIcon, Canvas.GetLeft(DogeIcon) - 10);
        }
        else if (e.Key == Key.Right)
        {
            Canvas.SetLeft(DogeIcon, Canvas.GetLeft(DogeIcon) + 10);
        }
    }