[C#/WINUI3/COMMUNITY TOOLKIT/.NET8] RadialGauge 엘리먼트 : 라디오 게이지 만들기 1

■ RadialGauge 엘리먼트를 사용해 라디오 게이지를 만드는 방법을 보여준다.

※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다.
※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType 태그를 None으로 추가했다.

▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8"?>
<Page x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:control="using:CommunityToolkit.WinUI.UI.Controls"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <control:RadialGauge
        Width="280"
        Height="280"
        BorderThickness="0"
        Minimum="0"
        Maximum="240"
        MinAngle="-150"
        MaxAngle="150"
        ScaleWidth="12"
        ScaleTickWidth="0"
        ScalePadding="0"
        NeedleWidth="4"
        NeedleLength="60"
        StepSize="30"
        TickWidth="2"
        TickLength="6"
        TickSpacing="15"
        ValueStringFormat="N0"
        Value="120"
        IsInteractive="True"
        IsEnabled="True" />
</Page>

<?xml version="1.0" encoding="utf-8"?>

<Page x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:control="using:CommunityToolkit.WinUI.UI.Controls"

Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"

FontFamily="나눔고딕코딩"

FontSize="16">

<control:RadialGauge

Width="280"

Height="280"

BorderThickness="0"

Minimum="0"

Maximum="240"

MinAngle="-150"

MaxAngle="150"

ScaleWidth="12"

ScaleTickWidth="0"

ScalePadding="0"

NeedleWidth="4"

NeedleLength="60"

StepSize="30"

TickWidth="2"

TickLength="6"

TickSpacing="15"

ValueStringFormat="N0"

Value="120"

IsInteractive="True"

IsEnabled="True" />

</Page>

TestProject.zip