How do I implement movement in a WPF Adventure game?

Question

I'm working on making a short WPF adventure game. The only major hurdle I have right now is how to animate objects on the screen correctly. I've experimented with DoubleAnimation and ThicknessAnimation both enable movement of the character, but the speed is a bit erratic. The objects I'm trying to move around are labels in a grid, I'm checking the mouse's position in terms of the canvas I have the grid in.

Does anyone have any suggestions for coding the movement, while still allowing mouse clicks to pick up items when needed? It would be nice if I could continue using the Visual Studio GUI Editor. By the way, I'm fine with scrapping labels in a grid for a more ideal object to manipulate.

Here's my movement code:

ThicknessAnimation ta = new ThicknessAnimation();

The event handling movement:

private void Hansel_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
     ta.FillBehavior = FillBehavior.HoldEnd;
     ta.From = Hansel.Margin;

      double newX = Mouse.GetPosition(PlayArea).X;
      double newY = Mouse.GetPosition(PlayArea).Y;
      if (newX < Convert.ToDouble(Hansel.Margin.Left))
      {
           //newX = -1 * newX;
           ta.To = new Thickness(0, newY, newX, 0);

      }
      else if (newY < Convert.ToDouble(Hansel.Margin.Top))
      {
            newY = -1 * newY;
      }
      else
      {
            ta.To = new Thickness(newX, newY, 0, 0);
      }
      ta.Duration = new Duration(TimeSpan.FromSeconds(2));
      Hansel.BeginAnimation(Grid.MarginProperty, ta);
}

Screenshot with annotations:

Screenshot with example movement:

Answer 1

I've spent a lot of time worrying about WPF performance and animations when writing the WPF Mind Mapping app NovaMind.

On Stackoverflow I've written down some WPF animation best practices. Maybe those can help you.

Regarding your question:

I've experimented with DoubleAnimation and ThicknessAnimation both enable movement of the character, but the speed is a bit erratic.

Without knowing the details of your app it's hard to say why your animation is erratic. Most often the reason is the misuse of Effects such as a DropDownShadow or Blur.

If the element you are moving has Effects on them it's probably better to cache the visual in a Bitmap first or to move the Effect to the container.

One way to find out what's going on is to use the WPF Performance Suite. Especially the Visual Profiler can show you easily if you have a CPU-bound issue or problems on the GPU.

As far as coding animations is concerned I had way more fun with artefact animator. Definitely worth a look as it makes it easier to define nice animations.

Overall I can only warn you that WPF is really not suited for game development. It might be fine for a protoype or hobby project and for a simple adventure game it might be okay but if you're interested in game development I would not invest any more time in WPF. One reason for this is that it's impossible to get a constant framerate which makes it pretty much useless for games.

Having written a game in HTML/JS myself since I've worked with WPF I see how much easier it can be. WPF is simply not suited.