使用 WPF 显示可以通过 C# 中的箭头键移动的图像答案

【问题标题】：using WPF to display an image that can be moved by using the arrow keys in C#使用 WPF 显示可以通过 C# 中的箭头键移动的图像
【发布时间】：2015-04-20 12:23:44
【问题描述】：

我正在为一个班级编写游戏 Galaga 并且正在使用 WPF 来完成它并且从未使用过 WPF。我已经能够上传玩家飞船的图像，并找到了如何使用 Canvas.SetLeft 和 Canvas.SetTop 命令设置其位置，但我还没有找到如何使用箭头键输入来更改这些值。我在查找输入的过程中放置了一个 do while 循环，但它无法启动。下面是我的 XAML 代码，下面是我的 XAML.cs。

<Window x:Class="GalagaGame.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="500" Width="1000">
<Canvas Background="Black">
    <Image Name="HumanShipGraphic" Source="GalagaPlayerShip.png" HorizontalAlignment="Left" Height="100" Canvas.Top="350" Canvas.Left="450" VerticalAlignment="Top" Width="100"/>
    <Image Name="BlueAlienShipGraphic" Source="BlueAlienShip.png" Height="75" Width="75" Canvas.Left="100" Canvas.Top="100" />
    <TextBlock Foreground="Red" FontFamily="Arial" FontSize="20" FontWeight="Bold"  Canvas.Top="400" Canvas.Right="900" TextWrapping="Wrap" Text="Score"/>
    <TextBlock Name="ScoreText" Foreground="White" FontFamily="Arial" FontSize="15" FontWeight="Bold"  Canvas.Top="420" Canvas.Right="900" TextWrapping="Wrap" Text="300" />
    <Rectangle Name="LaserGraphic" Fill="#FFF4F4F5" Height="15" Width="5" Canvas.Top="118" Canvas.Left="532" Stroke="White"  />
    <Image Name="BlowUpImage" Height="100" Canvas.Left="408" Canvas.Top="308" Width="100">
        <Image.Triggers>
            <EventTrigger>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Name="BlowUpAnimation" Storyboard.TargetName="BlowUpImage" 
                                         Storyboard.TargetProperty="Width" From=" 100" To=" 100" 
                                         Duration="0:0:0.1" Completed="DoubleAnimation_Completed"/>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Image.Triggers>
    </Image>

</Canvas>

    namespace GalagaGameTestProject
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
    public MainWindow()
    {
        InitializeComponent();
        do
        {
            ProcessInput();
            MoveShip(x, y);
        } while (quit == 0);

    }
    int x = 100;
    int y = 100;
    int quit = 0;
    public void Start()
    {
        Game newGame = new Game();
        newGame.Run();
    }
    public void MoveShip(int x, int y)
    {
        Canvas.SetTop(HumanShipGraphic, x);
        Canvas.SetLeft(HumanShipGraphic, y);
    }
    private void ProcessInput()
    {
        ConsoleKeyInfo keyInfo;
        if (Console.KeyAvailable)
        {
            keyInfo = Console.ReadKey();
            switch (keyInfo.Key)
            {

                case ConsoleKey.LeftArrow:
                    x -= 5;
                    break;
                case ConsoleKey.RightArrow:
                    x -= 5;

                    break;
                case ConsoleKey.Spacebar:
                    quit = 1;
                    break;

            }
        }
    }


    }
}

【问题讨论】：

你不想要一个 do 循环，你想要挂钩那些击键的事件
您是否尝试过使用 keyDown/keyUp 处理程序？比如discussed here，或者here?
UI 编程有“即时模式”和“保留模式”两种范式。 WPF 是“保留模式”。这意味着，没有一个应用程序驱动的渲染循环一遍又一遍地处理东西，但它是事件驱动的。您的循环想法适用于 DirectX 等即时模式技术，但不适用于 WPF。您需要的是事件处理程序，其中包含您希望在键盘操作发生时执行的代码。

标签： c# wpf xaml imagesource

【解决方案1】：

您的循环在您的 Windows 构造函数中，它使您的窗口窗体保持显示。将您的键盘输入改为OnPreviewKeyDown 事件。

protected override void OnPreviewKeyDown(KeyEventArgs e)
{
   base.OnPreviewKeyDown(e);
   switch (e.Key )
   {
       case Key.Left: 
           break;
       case Key.Right:
           break; 
       case Key.Space:
           break;
   }

}

【讨论】：