Building a Windows 8 App: Phase 1

Hello there! So in my last post I mentioned that I was about to start building my first Windows 8 app, and that I did! Today I'm going to give you a step by step on what I've done with my app. This could be helpful for anyone else out there who may be thinking about/or already making their first Windows 8 app. 

Step 1: Get a handle on the tools
So I had all these glorious and wildly creative ideas for what I wanted my app to be, and I thought to myself "how hard can Visual Studio be, really?" I tried dive right in and start building, but I quickly realized that the time I was taking to figure out each little step was really adding up. I decided to regroup, and start at square one. A coworker of mine who had also just made an app, insisted that the "Hello world" tutorial on the Windows Dev center was the way to go, so I decided to try it out.
I followed through each and every step on there, and well, I'm convinced. It really does provide you with a great understanding of the fundamentals of Visual Studio, and how to use XAML and C# for your app. 

Step 2: Pick an idea and get the basic functionality working
I decided that I wanted to make an app that would incorporate my love for music, and thus I decided to build a piano app.

  • Firstly, I found an image of a piano on the interwebs to use as a placeholder. Then, I found piano sounds that I could use while trying to get the functionality going.
    ****Be sure to save each sound file in the 'Assets' folder of your project.**** 
  • I then created a Media Element for one note:
    <MediaElement x:Name="C" Source="Assets/soundfile.wav" AutoPlay="False" Height="0" Width="0" /> 
  • Next I created a Button and placed it exactly over one of the piano keys, so that tapping this button would emulate how you would press a piano key. I made the Opacity = 0 so that they can't be seen.
    ****I found editing buttons in Blend to be easier**** 
  • Create a handler for the 'Tapped' event and then in the MainPage.xaml.cs put in:
    private void Tap_Note(object sender, TappedRoutedEventArgs e)


With this, you should have one piano note that plays a sound when tapped! Hope this helps some of you get started, will post next updates soon.

Coming Up: More on Sounds, Copyrights, and Polishing Your App. 

Comments (3)

  1. Nice post! This is really helpful for me as a new user coming to XAML/C# in Blend/VS. If possible, could you post some screenshots as well? It'd be really helpful to know if I'm on the right track. Keep up the good work!

  2. I sure can! Thanks for stopping by, check back for them soon!

  3. Zahid Rouf says:

    Great post. Very Easy tutorial. Thanks for sharing. #<a href="">CodeInclude</a&gt;

Skip to main content