UWP - Drawing on a Canvas example

MainPage.xaml

<Page
    x:Class="UniversalAppTutorials.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:UniversalAppTutorials"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    >
    <Canvas x:Name="Canvas1" Background="AliceBlue">
    </Canvas>
</Page>
MainPage.xaml.cs

using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Shapes;
using Windows.UI.Xaml.Media;
using Windows.UI;


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

        void DarwOnCanvas() {
            // Initialize a new Line instance
            Line line = new Line();

            // Set the line x y position and length
            line.X1 = 100;
            line.X2 = 250;
            line.Y1 = 100;
            line.Y2 = 300;

            // Set the line color and width
            line.Stroke = new SolidColorBrush(Colors.SeaGreen);
            line.StrokeThickness = 15;

            // Set set line drawing position on canvas
            Canvas.SetTop(line,25);
            Canvas.SetLeft(line, 75);

            // Set the line ZIndex value;
            Canvas.SetZIndex(line,1);

            // Finally, draw the line on canvas
            Canvas1.Children.Add(line);

            // Create a new ellipse and draw it on canvas
            Ellipse ellipse = new Ellipse();
            ellipse.Width = 150;
            ellipse.Height = 150;
            ellipse.Fill = new SolidColorBrush(Colors.HotPink);
            Canvas.SetLeft(ellipse,100);
            Canvas.SetTop(ellipse, 150);
            Canvas1.Children.Add(ellipse);
        }
    }
}
More uwp tutorials