Before reading this article, please go through the following article.
- Introduction To Universal Windows Platform (UWP) App Development Using Windows 10 And Visual Studio 2015
- How to add UWP ToolKit controls in Universal Application Development With XAML AND C#
Reading this article, you can learn how UWP Tool Kit Control - HeaderedTextBlock is used in Universal Windows Apps development, with XAML and Visual C#.
The following important tools are required for developing UWP.
- Windows 10 (Recommended)
- Visual Studio 2015 Community Edition (It is a free software available online).
Now, we can discuss step by step app development.
Step 1 - Open Visual Studio 2015 -> Start -> New Project-> Select Universal (under Visual C#->Windows)-> Blank App -> Give suitable name for your App (UWPToolkitHeaderedTBL)->OK.
Step 2 - Choose the Target and Minimum platform versions for your Windows Universal Application. After this, the project creates App.xaml and MainPage.xaml.
For adding UWPToolKit Control, Please refer,
Step 3 - Add TextBlock control and change the name and text property for title.
Step 4 - Add UWP Tool Kit namespace in Mainpage.xaml.
- xmlns:Controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
Add HeaderTextBlock control from UWP Tool Kit, change the name property, and set the Header and Text Properties.
Note- Automatically, the following code will be generated in XAML code View, while we are done in the design View.
- <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:UWPHeaderedTBL" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:Controls="using:Microsoft.Toolkit.Uwp.UI.Controls" x:Class="UWPHeaderedTBL.MainPage" mc:Ignorable="d">
- <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
- <TextBlock x:Name="tblTitle" HorizontalAlignment="Left" Margin="72,31,0,0" TextWrapping="Wrap" Text="Headered Text Block Test" VerticalAlignment="Top" FontSize="20" FontWeight="Bold" Width="250" Height="29" />
- <Controls:HeaderedTextBlock x:Name="HTBtest" HorizontalAlignment="Left" Margin="97,154,0,0" VerticalAlignment="Top" Width="183" Height="65" Header="C# Corner" Text="Welcomes You All" /> </Grid>
- </Page>
Step 5 - Deploy your App in Local Machine. The output of the UWPToolkitHeaderedTBL App is,
Summary - Now, you have successfully tested UWP Tool Kit – HeaderedTextBlock Control in Visual C# - UWP environment.