circularProgressBar.xaml

<UserControl x:Class="TestUsers.circularProgressBar"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing"
             xmlns:local="clr-namespace:TestUsers"
             mc:Ignorable="d" x:Name="circularProgress"
             d:DesignHeight="120" d:DesignWidth="120">
    <UserControl.Resources>
        <local:ValueToAngleConverter x:Key="ValueToAngleConverter"/>
        <local:ValueToTextConverter x:Key="ValueToTextConverter"/>
    </UserControl.Resources>
    <Grid>
        <ed:Arc Stretch="None" EndAngle="360" ArcThickness="{Binding ElementName=circularProgress, Path=ArcThickness}" Fill="#FFEFF0F6"/>
        <Label x:Name="percentValue" Content="{Binding Converter={StaticResource ValueToTextConverter}, ElementName=circularProgress, Path=Value}"
               FontSize="{Binding ElementName=circularProgress, Path=PercentFontSize}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        <ed:Arc Name="progressBar" Stretch="None" EndAngle="{Binding Converter={StaticResource ValueToAngleConverter},
            ElementName=circularProgress, Path=Value}" ArcThickness="{Binding ElementName=circularProgress,
            Path=ArcThickness}" Fill="#372579"/>
    </Grid>
</UserControl>