image - Windows Phone 8 C# Load and Draw PNGs

Question

I'm making a music theory game with C# and XAML, where a note appears on the stave and you press the corresponding button, and then it spawns a new note in a new position and gameplay 'loops' from there until you run out of lives...etc

Yet I can't find anything that tells me how to load and draw .png files for Windows Phone 8. The main issue is that the position is what changes, and all I want to do is make the note image appear at one of the defined positions when a new note is made.

It should be as simple as:

Define positions -> Load Image -> |: Select random position based on a random number -> Draw image at selected position -> if correct, remove image :| ...etc

Shouldn't it? (it is with XNA, but Microsoft sadly have discontinued that)

I've looked at the tutorials, existing questions and MSDN reference documents, but there is no Bitmap Class, and System.Drawing does not seem to exist. In XNA, this stuff was very simple, yet it seems to be unnecessarily complex (or maybe it's too obvious to point out). I've tried using the Image class, but I can't find anything to do with loading or drawing.

I'm just trying to load an image which is stored locally. I've stored all of my note coordinates in Point values, but it's loading and drawing images which is the stumbling block. :/

Thanks in advance.

Answer 1

There is an Image control to display pictures. You can put it in a Canvas container, this way you'll be able to set its position in pixels.

<Canvas>
    <Image Source="/YourPicture.png" Canvas.Top="50" Canvas.Left="30" />
</Canvas>

You can also do that programmatically:

var image = new Image();
image.Source = new BitmapImage(uri);
canvas.Children.Add(image);
Canvas.SetTop(image, 50);
Canvas.SetLeft(image, 30);