How to Create Canvas Option In Universal Windows Platform Application

Introduction - In this article, you will learn how to create canvas option in Universal Windows Platform application.

Requirement

• Visual Studio 2015 update 3

Step 1 - Open the Visual Studio 2015 update 3 and choose New >> Project (or press Ctrl+Shift+N).

 

Step 2 - Now, select Visual C# >> Universal >> Blank App (Universal Windows). Give your application  a name and click "OK" button.



Step 3 - Select Target and Minimum version that your app will support and click "OK.



Step 4 - In Solution Explorer, open cs page and click the MainPage.xaml. Open the design window and go View >> Toolbox. Open the Toolbox and choose canvas option.





Step 5 - Now, go to XAML page and write the XAML code for it as shown below- 

<Page x:Class="canvasexample.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:canvasexample" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Canvas HorizontalAlignment="Left" Height="251" Margin="101,45,0,0" VerticalAlignment="Top" Width="379" />
        <Rectangle Fill="DarkSlateBlue" Height="50" Width="100" Margin="150,82,390,228" />
        <Rectangle Fill="DeepPink" Height="100" Width="50" Margin="101,137,489,123" />
        <Rectangle Fill="DarkSeaGreen" Height="50" Width="100" Margin="150,237,390,73" />
        <Rectangle Fill="DimGray" Height="100" Width="50" Margin="243,132,347,128" /> </Grid>
</Page>

Step 7 - Now, we can run the app in machines or device. It should be like, Local  Machine, Device, Remote Machine.



Step 8 - Here, we can see the output.