Developers share libraries and resources by bundling their work into packages. You can pull a package into Visual Studio to provide extra functionality to projects. For example, to add support for JSON or add animation routines to XAML.

NuGet is built into Visual Studio, so you don't have to leave the IDE.

Install a NuGet package

Let's use NuGet to install new XAML animation features from the Win2D package:

1. Click Project, and then select Manage NuGet Packages.

2. Click Browse, type Win2D in the search box, and press Enter. A list of available packages displays.

3. Select the Win2D.uwp package from the list and click Install. The package begins installing.


With the package installed, we can call a feature directly in the XAML code to define our main page.

NOTE

If you get an error during installation, you might not have set the correct minimum version.

1. Click Project.
2. Select Hello World Properties.
3. Change the Min Version to Windows 10.
4. A Preview Changes window displays. Click OK.

5. A License Acceptance window displays. To agree to the license terms, click I Accept.

6. Double-click MainPage.xaml in the Solutions Explorer to open it in design view.

7. Use the Arrows button to expand the editing view.

8. Replace all of the XAML code in MainPage.xaml with this code:

<Page
  x:Class="Hello_World.MainPage"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
  xmlns:canvas="using:Microsoft.Graphics.Canvas.UI.Xaml">
  <Grid>
    <canvas:CanvasControl Draw="CanvasControl_Draw" ClearColor="CornflowerBlue"/>
  </Grid>
</Page>
            

9. Replace all of the C# code in MainPage.xaml.cs with this code:

using Windows.UI;
using Windows.UI.Xaml.Controls;
using Microsoft.Graphics.Canvas.UI.Xaml;

namespace Hello_World
{
  public sealed partial class MainPage : Page
  {
    public MainPage()
    {
      this.InitializeComponent();
    }

    void CanvasControl_Draw(CanvasControl sender, CanvasDrawEventArgs args)
    {
      args.DrawingSession.DrawEllipse(155, 115, 80, 30, Colors.White, 3);
      args.DrawingSession.DrawText("Hello world!", 100, 100, Colors.White);
    }
  }
}
            

This XAML code includes a reference to the package we installed earlier.

10. Run your program to see the results.


You should see an ellipse circling the text "Hello world!" on a blue background.

Next unit: More advanced Visual Studio features

Continue