WPF C# Tutorial – Make a Hello MOO (Hello World) Program in Visual Studio
- Subject: WPF C# Tutorials
- Learning Time: 1 hour
In this tutorial we will learn how to make a simple button and text application using WPF C# in Visual Studio. This is our first C# tutorial in WPF format we have done plenty of tutorials in the windows form application format so its time to change over. The reason for change was shared in the WPF VS Windows form application article released a while ago and we think this will benefit our learners immensely as most of the programs made for Windows Platforms are now in WPF.
The objectives for this lesson are –
- Make your first application in WPF C#
- Use XML and C# in visual studio
- Review basic syntaxes in XML
- Add names and events to component properties in XML
- Add mouse interactivity to the components
- Debug the program and check for learning
First lets create a new project in Visual Studio. Click on File -> New Project ->Make sure you select the WPF Application and under that name the application hello WPF and click OK.
Once you clicked OK you will be greeted with this screen. We number the screen shot to make it easier to explain them.
1 – This is your project preview screen you can see what the project looks like in this and how its coming along as you work on it. This screen can also be used to drag and drop elements in different places but we also can XML to make the move as we will look at later on.
2 – This is the XML part of the program. We can directly input the things we want for this program in there. So at any point if we mention add this to the XML then add it to that screen.
3 – This is the solutions explorer, this is where we can keep track of the project files for example importing images or sound also when we want to add our C# scripts we can always find the CS file necessary to make the changes.
4 – Just like your web browser visual studio also can have multiple tabs. In this example your XML and C# files will both be open for our convenience. On the tab you will see the file main window XAML file which is the XML file and main window XAML . CS file which is the C# script file we need. We cannot add the C# script to the XML file because they are not compatible that way however we have separate script to run and communicate with the XML file when we run the program.
Go to the XML code and it should look like below [this is the 2nd window from the screen shot above]-
<Windowx:Class="hello_WPF.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:hello_WPF" mc:Ignorable="d" Title="MainWindow" Height="350" Width="525"> <Grid> </Grid> </Window>
Above is the standard XML scrip that comes with every new WPF application. In here you will see that it has got these tags that almost look like HTML tags. Lets break it down so it makes sense.
<Window> … </Window> this tag will cover the entire the program. This tag tells the application what it is, its compatibility and we can see it as an identity for the application. The same as HTML tags we start it with <Window> the content goes in the middle and we end it with </Window>.