Hello World

Learn how to output Hello World using Windows App SDK with this Tutorial

Hello World has been used to introduce many new programming languages, in this case it is an introduction to the Windows App SDK and will display a message when you Click on a Button.

Step 1

Follow Setup and Start on how to get Setup and Install what you need for Visual Studio 2022 and Windows App SDK.

In Windows 11 choose Start and then find or search for Visual Studio 2022 and then select it.
Visual Studio 2022
Once Visual Studio 2022 has started select Create a new project.
Create a new project
Then choose the Blank App, Packages (WinUI in Desktop) and then select Next.
Blank App, Packages (WinUI in Desktop)
After that in Configure your new project type in the Project name as HelloWorld, then select a Location and then select Create to start a new Solution.
Configure project

Step 2

Within Solution Explorer for the Solution select the arrow next to MainWindow.xaml then double-click on MainWindow.xaml.cs to see the Code for the Main Window.
Solution Explorer MainWindow.xaml.cs

Step 3

In the Code for MainWindow.xaml.cs there will already be a Method of myButton_Click(...) and within this the following Line should be Removed:


myButton.Content = "Clicked";
                                    

Step 4

Then in myButton_Click(...) where myButton.Content = "Clicked"; was Removed type in the following:


await new ContentDialog()
{
    XamlRoot = Content.XamlRoot,
    Content = "Hello World",
    PrimaryButtonText = "Close"
}
.ShowAsync();
                                    

This will create a ContentDialog with the Content of Hello World with the PrimaryButtonText of Close and uses the Method for ShowAsync to display the ContentDialog. It also sets the XamlRoot to allow the ContentDialog to work correctly. The Method of ShowAsync uses the Keyword for await which means it will perform a Task that won't happen at the same time, or asynchronously.

Step 5

While still in the Method for myButton_Click(...) between private and void type in the following:


async
                                    

Because the Method for ShowAsync is asynchronous using the Keyword of await so you need to mark the Method it is used in as such, this done with the Keyword of async.

The Method for myButton_Click(...) should look as follows:


private async void myButton_Click(object sender, RoutedEventArgs e)
{
    await new ContentDialog()
    {
        XamlRoot = Content.XamlRoot,
        Content = "Hello World",
        PrimaryButtonText = "Close"
    }
    .ShowAsync();
}                                        
                                    

When the Button is Clicked, the Method of myButton_Click(...) will be triggered and this display a ContentDialog with the Content of Hello World.

Step 6

That completes the Windows App SDK application. In Visual Studio 2022 from the Toolbar select HelloWorld (Package) to Start the application.
HelloWorld (Package)

Step 7

Once running you should see the Button with the text of Click Me

Hello World Running

Step 8

If you Click on the Button with the text, Click Me, it will display the ContentDialog which you can then dismiss with the Button of Close.

Hello World Output

Step 9

To Exit the Windows App SDK application, select the Close button from the top right of the application as that concludes this Tutorial for Windows App SDK from tutorialr.com!
Close application