how can i create custom controlls with UWP?

Question

When I searched Google for custom controls, I could only find a way to extend the existing controls.

However, I want to know how to make a control from scratch like the attached picture.

Specifically, I want to make the shape of the tree over there so that I can move the circle like Progress bar and register the writing.

Can i create a new control by adding detailed functions like this?

Answer 1

Hi,

Welcome to Microsoft Q&A!

A custom control is based on an existing control combination. You design new styles and write logic codes for it.

A custom (templated) control allows an app to use the Template property to replace the control’s internal element tree. If you don’t need your control to have that re-templating feature, it is easier to use UserControl.

I suggest using UserControl to achieve it, there is a simple sample to use UserControl.

MyUserControl1.xaml:

<UserControl  
  ….>  
   <UserControl.Resources>  
        <Style TargetType="TextBox" x:Key="Textboxstyle">  
            <Setter Property="FontStyle" Value="Italic"/>  
            <Setter Property="Width" Value="100"/>  
            <Setter Property="Height" Value="40"/>  
            <Setter Property="VerticalAlignment" Value="Center"/>  
            <Setter Property="HorizontalAlignment" Value="Center"/>  
        </Style>  
    </UserControl.Resources>  
    <Grid>  
        <!--place your control-->  
        <TextBox Style="{StaticResource Textboxstyle}" Text="Hi"/>  
    </Grid>  
</UserControl>  

MainPage.xaml:

<Page  …>  
    <Grid><local:MyUserControl1/></Grid>  
</Page>  

More info can be found here.

---

If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.