MAUI Archives - icodebroker

[C#/MAUI/.NET6] 페이지 시작시 애니메이션 사용하기

■ 페이지 시작시 애니메이션을 만드는 방법을 보여준다. ▶ AppShell.xaml


<?xml version = "1.0" encoding = "UTF-8" ?>
<Application x:Class="TestProject.App"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" />

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

<Application x:Class="TestProject.App"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    Shell.NavBarIsVisible="False"
    Shell.TabBarIsVisible="False">
    <Grid BackgroundColor="White">
        <Grid>
            <Frame x:Name="circleFrame1"
                Margin="-110,30,0,0"
                HorizontalOptions="Start"
                WidthRequest="400"
                HeightRequest="400"
                CornerRadius="200"
                Opacity="0.7"
                BackgroundColor="RoyalBlue" />
            <Frame x:Name="rectangleFrame"
                Margin="-50,0,0,0"
                HorizontalOptions="End"
                VerticalOptions="End"
                WidthRequest="280"
                HeightRequest="270"
                CornerRadius="0"
                Opacity="0.6"
                BackgroundColor="White" />
            <Frame x:Name="circleFrame2"
                Margin="0,0,-250,-230"
                HorizontalOptions="End"
                VerticalOptions="End"
                WidthRequest="450"
                HeightRequest="400"
                CornerRadius="200"
                Opacity="0.6"
                BackgroundColor="RoyalBlue" />
        </Grid>
        <Grid RowDefinitions="Auto,*,150">
            <Label Grid.Row="0"
                Margin="20"
                FontSize="Large"
                FontAttributes="Bold"
                Text="icodebroker" />
            <StackLayout Grid.Row="1"
                VerticalOptions="Center">
                <Label
                    Margin="10"
                    LineHeight="1"
                    FontAttributes="Bold,Italic"
                    FontFamily="Arial"
                    FontSize="50"
                    Text="Visit&#10;the icodebroker&#10;blog." />
                <Label
                    Margin="10"
                    LineHeight="1"
                    FontFamily="Arial"
                    FontSize="Body"
                    Text="Enter&#10;https://icodebroker.tistory.com&#10;in your web browser." />
                <Image
                    Margin="10,0"
                    HorizontalOptions="Start"
                    Source="arrow.png">
                    <Image.GestureRecognizers>
                        <TapGestureRecognizer x:Name="tapGestureRecognizer"
                            NumberOfTapsRequired="1" />
                    </Image.GestureRecognizers>
                </Image>
            </StackLayout>
        </Grid>
    </Grid>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

Shell.NavBarIsVisible="False"

Shell.TabBarIsVisible="False">

<Grid>

<Frame x:Name="circleFrame1"

Margin="-110,30,0,0"

HorizontalOptions="Start"

WidthRequest="400"

HeightRequest="400"

CornerRadius="200"

Opacity="0.7"

BackgroundColor="RoyalBlue" />

<Frame x:Name="rectangleFrame"

Margin="-50,0,0,0"

HorizontalOptions="End"

VerticalOptions="End"

WidthRequest="280"

HeightRequest="270"

CornerRadius="0"

Opacity="0.6"

BackgroundColor="White" />

<Frame x:Name="circleFrame2"

Margin="0,0,-250,-230"

HorizontalOptions="End"

VerticalOptions="End"

WidthRequest="450"

HeightRequest="400"

CornerRadius="200"

Opacity="0.6"

BackgroundColor="RoyalBlue" />

</Grid>

<Label Grid.Row="0"

Margin="20"

FontSize="Large"

FontAttributes="Bold"

Text="icodebroker" />

<StackLayout Grid.Row="1"

VerticalOptions="Center">

<Label

Margin="10"

LineHeight="1"

FontAttributes="Bold,Italic"

FontFamily="Arial"

FontSize="50"

Text="Visit
the icodebroker
blog." />

<Label

Margin="10"

LineHeight="1"

FontFamily="Arial"

FontSize="Body"

Text="Enter
https://icodebroker.tistory.com
in your web browser." />

<Image

Margin="10,0"

HorizontalOptions="Start"

Source="arrow.png">

<Image.GestureRecognizers>

<TapGestureRecognizer x:Name="tapGestureRecognizer"

NumberOfTapsRequired="1" />

</Image.GestureRecognizers>

</Image>

</StackLayout>

</Grid>

</ContentPage>

▶ MainPage.xaml.cs


namespace TestProject;

/// <summary>
/// 메인 페이지
/// </summary>
public partial class MainPage : ContentPage
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainPage()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainPage()
    {
        InitializeComponent();

        this.tapGestureRecognizer.Tapped += tapGestureRecognizer_Tapped;

        this.rectangleFrame.IsVisible = false;
        this.circleFrame2.IsVisible   = false;

        StartAnimationAsync();
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private
    //////////////////////////////////////////////////////////////////////////////// Event

    #region 탭 제스처 인식기 탭 처리하기 - tapGestureRecognizer_Tapped(sender, e)

    /// <summary>
    /// 탭 제스처 인식기 탭 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private async void tapGestureRecognizer_Tapped(object sender, EventArgs e)
    {
        await Task.WhenAll
        (
            this.rectangleFrame.FadeTo(0, 300, Easing.SinOut),
            this.circleFrame2.FadeTo(0, 300, Easing.SinOut)
        );

        await Task.WhenAll
        (
            this.circleFrame1.FadeTo(0, 1000, Easing.SinIn),
            this.circleFrame1.ScaleTo(10, 1000, Easing.SinOut)
        );

        await Navigation.PushAsync(new MainPage());
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////// Function

    #region 애니메이션 시작하기 (비동기) - StartAnimationAsync()

    /// <summary>
    /// 애니메이션 시작하기 (비동기)
    /// </summary>
    private async void StartAnimationAsync()
    {
        await Task.WhenAll
        (
            this.circleFrame1.ScaleTo(10, 0),
            this.circleFrame1.FadeTo(0, 0)
        );

        await Task.WhenAll
        (
            this.circleFrame1.ScaleTo(1, 1000, Easing.SinIn),
            this.circleFrame1.FadeTo(0.7, 1000, Easing.SinOut)
        );

        this.rectangleFrame.IsVisible = true;
        this.circleFrame2.IsVisible   = true;

        await Task.WhenAll
        (
            this.rectangleFrame.FadeTo(0.7, 300, Easing.SinIn),
            this.circleFrame2.FadeTo(0.7, 300, Easing.SinIn)
        );
    }

    #endregion
}

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public partial class MainPage : ContentPage

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

this.tapGestureRecognizer.Tapped += tapGestureRecognizer_Tapped;

this.rectangleFrame.IsVisible = false;

this.circleFrame2.IsVisible = false;

StartAnimationAsync();

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region 탭 제스처 인식기 탭 처리하기 - tapGestureRecognizer_Tapped(sender, e)

/// <summary>

/// 탭 제스처 인식기 탭 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private async void tapGestureRecognizer_Tapped(object sender, EventArgs e)

{

await Task.WhenAll

(

this.rectangleFrame.FadeTo(0, 300, Easing.SinOut),

this.circleFrame2.FadeTo(0, 300, Easing.SinOut)

);

await Task.WhenAll

(

this.circleFrame1.FadeTo(0, 1000, Easing.SinIn),

this.circleFrame1.ScaleTo(10, 1000, Easing.SinOut)

);

await Navigation.PushAsync(new MainPage());

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 애니메이션 시작하기 (비동기) - StartAnimationAsync()

/// <summary>

/// 애니메이션 시작하기 (비동기)

/// </summary>

private async void StartAnimationAsync()

{

await Task.WhenAll

(

this.circleFrame1.ScaleTo(10, 0),

this.circleFrame1.FadeTo(0, 0)

);

await Task.WhenAll

(

this.circleFrame1.ScaleTo(1, 1000, Easing.SinIn),

this.circleFrame1.FadeTo(0.7, 1000, Easing.SinOut)

);

this.rectangleFrame.IsVisible = true;

this.circleFrame2.IsVisible = true;

await Task.WhenAll

(

this.rectangleFrame.FadeTo(0.7, 300, Easing.SinIn),

this.circleFrame2.FadeTo(0.7, 300, Easing.SinIn)

);

}

#endregion

}

TestProject.zip

[C#/MAUI/COMMUNITY TOOLKIT/.NET6] AnimationBehavior 엘리먼트 : 버튼 클릭시 페이드 인/아웃 애니메이션 사용하기

■ AnimationBehavior 엘리먼트를 사용해 버튼 클릭시 페이드 인/아웃 애니메이션을 만드는 방법을 보여준다. ▶ MainPage.xml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    <Button
        HorizontalOptions="Center"
        VerticalOptions="Center"
        Padding="10"
        Text="애니메이션 테스트">
        <Button.Behaviors>
            <toolkit:AnimationBehavior EventName="Clicked">
                <toolkit:AnimationBehavior.AnimationType>
                    <toolkit:FadeAnimation Opacity="0.2" />
                </toolkit:AnimationBehavior.AnimationType>
            </toolkit:AnimationBehavior>
        </Button.Behaviors>
    </Button>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">

<Button

HorizontalOptions="Center"

VerticalOptions="Center"

Padding="10"

Text="애니메이션 테스트">

<Button.Behaviors>

<toolkit:AnimationBehavior EventName="Clicked">

<toolkit:AnimationBehavior.AnimationType>

<toolkit:FadeAnimation Opacity="0.2" />

</toolkit:AnimationBehavior.AnimationType>

</toolkit:AnimationBehavior>

</Button.Behaviors>

</Button>

</ContentPage>

▶ MauiProgram.cs


using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseMauiCommunityToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/COMMUNITY TOOLKIT/.NET6] AnimationBehavior 엘리먼트 : 버튼 클릭시 버튼 크기 변경 애니메이션 사용하기

■ AnimationBehavior 엘리먼트를 사용해 버튼 클릭시 버튼 크기 변경 애니메이션을 만드는 방법을 보여준다. ▶ ScaleAnimation.cs


using CommunityToolkit.Maui.Animations;

namespace TestProject
{
    /// <summary>
    /// 스케일 애니메이션
    /// </summary>
    public class ScaleAnimation : BaseAnimation
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Method
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 애니메이션 처리하기 - Animate(view)

        /// <summary>
        /// 애니메이션 처리하기
        /// </summary>
        /// <param name="view">뷰</param>
        /// <returns>태스크</returns>
        public override async Task Animate(VisualElement view)
        {
            await view.ScaleTo(1.2, Length, Easing);
            await view.ScaleTo(1  , Length, Easing);
        }

        #endregion
    }
}

using CommunityToolkit.Maui.Animations;

namespace TestProject

{

/// <summary>

/// 스케일 애니메이션

/// </summary>

public class ScaleAnimation : BaseAnimation

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 애니메이션 처리하기 - Animate(view)

/// <summary>

/// 애니메이션 처리하기

/// </summary>

/// <param name="view">뷰</param>

/// <returns>태스크</returns>

public override async Task Animate(VisualElement view)

{

await view.ScaleTo(1.2, Length, Easing);

await view.ScaleTo(1 , Length, Easing);

}

#endregion

}

▶ MainPage.xml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
    xmlns:local="clr-namespace:TestProject">
    <Button
        HorizontalOptions="Center"
        VerticalOptions="Center"
        Padding="10"
        Text="테스트">
        <Button.Behaviors>
            <toolkit:AnimationBehavior EventName="Clicked">
                <toolkit:AnimationBehavior.AnimationType>
                    <local:ScaleAnimation
                        Easing="{x:Static Easing.Linear}"
                        Length="100"/>
                </toolkit:AnimationBehavior.AnimationType>
            </toolkit:AnimationBehavior>
        </Button.Behaviors>
    </Button>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"

xmlns:local="clr-namespace:TestProject">

<Button

HorizontalOptions="Center"

VerticalOptions="Center"

Padding="10"

Text="테스트">

<Button.Behaviors>

<toolkit:AnimationBehavior EventName="Clicked">

<toolkit:AnimationBehavior.AnimationType>

<local:ScaleAnimation

Easing="{x:Static Easing.Linear}"

Length="100"/>

</toolkit:AnimationBehavior.AnimationType>

</toolkit:AnimationBehavior>

</Button.Behaviors>

</Button>

</ContentPage>

▶ MauiProgram.cs


using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseMauiCommunityToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

[C#/MAUI/COMMUNITY TOOLKIT/.NET6] StatusBarBehavior 클래스 : StatusBarColor/StatusBarStyle 속성을 사용해 상태바 색상 및 스타일 설정하기

■ StatusBarBehavior 클래스의 StatusBarColor/StatusBarStyle 속성을 사용해 상태바 색상 및 스타일을 설정하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    <Page.Behaviors>
        <toolkit:StatusBarBehavior x:Name="statusBarBehavior" />
    </Page.Behaviors>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">

<Page.Behaviors>

<toolkit:StatusBarBehavior x:Name="statusBarBehavior" />

</Page.Behaviors>

</ContentPage>

▶ MainPage.xaml.cs


using CommunityToolkit.Maui.Core;

namespace TestProject;

/// <summary>
/// 메인 페이지
/// </summary>
public partial class MainPage : ContentPage
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainPage()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainPage()
    {
        InitializeComponent();

        Loaded += ContentPage_Loaded;
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region 컨텐트 페이지 로드시 처리하기 - ContentPage_Loaded(sender, e)

    /// <summary>
    /// 컨텐트 페이지 로드시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void ContentPage_Loaded(object sender, EventArgs e)
    {
        // 생성자나 XAML에서 설정하면 예외가 발생한다.
        this.statusBarBehavior.StatusBarColor = Colors.Orange;
        this.statusBarBehavior.StatusBarStyle = StatusBarStyle.LightContent;
    }

    #endregion
}

using CommunityToolkit.Maui.Core;

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public partial class MainPage : ContentPage

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

Loaded += ContentPage_Loaded;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 컨텐트 페이지 로드시 처리하기 - ContentPage_Loaded(sender, e)

/// <summary>

/// 컨텐트 페이지 로드시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void ContentPage_Loaded(object sender, EventArgs e)

{

// 생성자나 XAML에서 설정하면 예외가 발생한다.

this.statusBarBehavior.StatusBarColor = Colors.Orange;

this.statusBarBehavior.StatusBarStyle = StatusBarStyle.LightContent;

}

#endregion

}

▶ MauiProgram.cs


using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseMauiCommunityToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

[C#/MAUI/SIMPLE TOOLKIT/.NET6] WindowExtensions 클래스 : SetDefaultStatusBarAppearance/SetDefaultNavigationBarAppearance 확장 메소드를 사용해 상태바/액션바 색상 설정하기 (ANDROID)

■ WindowExtensions 클래스의 SetDefaultStatusBarAppearance/SetDefaultNavigationBarAppearance 확장 메소드를 사용해 상태바/액션바 색상을 설정하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
    <Ellipse
        HorizontalOptions="Center"
        VerticalOptions="Center"
        StrokeThickness="20"
        Stroke="Red"
        Fill="DarkBlue" />
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

<Ellipse

HorizontalOptions="Center"

VerticalOptions="Center"

StrokeThickness="20"

Stroke="Red"

Fill="DarkBlue" />

</ContentPage>

▶ MauiProgram.cs


using SimpleToolkit.Core;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

#if ANDROID

        builder.SetDefaultStatusBarAppearance(color : Colors.Red, lightElements : true);

        builder.SetDefaultNavigationBarAppearance(color : Colors.Orange, lightElements : true);

#endif

        return builder.Build();
    }

    #endregion
}

using SimpleToolkit.Core;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

#if ANDROID

builder.SetDefaultStatusBarAppearance(color : Colors.Red, lightElements : true);

builder.SetDefaultNavigationBarAppearance(color : Colors.Orange, lightElements : true);

#endif

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/SIMPLE TOOLKIT/.NET6] WindowExtensions 클래스 : DisplayContentBehindBars 확장 메소드를 사용해 상태바/액션바를 컨텐츠 영역 위로 올리기

■ WindowExtensions 클래스의 DisplayContentBehindBars 확장 메소드를 사용해 상태바/액션바를 컨텐츠 영역 위로 올리는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
    <Ellipse
        HorizontalOptions="Center"
        VerticalOptions="Center"
        StrokeThickness="20"
        Stroke="Red"
        Fill="DarkBlue" />
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

<Ellipse

HorizontalOptions="Center"

VerticalOptions="Center"

StrokeThickness="20"

Stroke="Red"

Fill="DarkBlue" />

</ContentPage>

▶ MauiProgram.cs


using SimpleToolkit.Core;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .DisplayContentBehindBars()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using SimpleToolkit.Core;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.DisplayContentBehindBars()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/SIMPLE TOOLKIT/.NET6] ContentButton 엘리먼트 사용하기

■ ContentButton 엘리먼트 사용하는 기본적인 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:simpleCore="clr-namespace:SimpleToolkit.Core;assembly=SimpleToolkit.Core">
    <simpleCore:ContentButton
        HorizontalOptions="Center"
        VerticalOptions="Center">
        <Border Background="Orange">
            <Border.StrokeShape>
                <RoundRectangle CornerRadius="10" />
            </Border.StrokeShape>
            <HorizontalStackLayout
                Padding="30,10"
                Spacing="10">
                <simpleCore:Icon
                    VerticalOptions="Center"
                    WidthRequest="20"
                    HeightRequest="20"
                    TintColor="White"
                    Source="bird.png" />
                <Label
                    VerticalOptions="Center"
                    FontAttributes="Bold"
                    TextColor="White"
                    Text="실행하기" />
            </HorizontalStackLayout>
        </Border>
    </simpleCore:ContentButton>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:simpleCore="clr-namespace:SimpleToolkit.Core;assembly=SimpleToolkit.Core">

<simpleCore:ContentButton

HorizontalOptions="Center"

VerticalOptions="Center">

<Border.StrokeShape>

</Border.StrokeShape>

<HorizontalStackLayout

Padding="30,10"

Spacing="10">

<simpleCore:Icon

VerticalOptions="Center"

WidthRequest="20"

HeightRequest="20"

TintColor="White"

Source="bird.png" />

<Label

VerticalOptions="Center"

FontAttributes="Bold"

TextColor="White"

Text="실행하기" />

</HorizontalStackLayout>

</Border>

</simpleCore:ContentButton>

</ContentPage>

▶ MauiProgram.cs


using SimpleToolkit.Core;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseSimpleToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using SimpleToolkit.Core;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseSimpleToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/SIMPLE TOOLKIT/.NET6] Icon 엘리먼트 : TintColor 속성을 사용해 아이콘 색상 설정하기

■ Icon 엘리먼트의 TintColor 속성을 사용해 아이콘 색상을 설정하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:simpleCore="clr-namespace:SimpleToolkit.Core;assembly=SimpleToolkit.Core">
    <HorizontalStackLayout
        HorizontalOptions="Center"
        VerticalOptions="Center"
        Spacing="10">
        <simpleCore:Icon
            WidthRequest="40"
            HeightRequest="40"
            Source="bird.png"/>
        <simpleCore:Icon
            WidthRequest="40"
            HeightRequest="40"
            TintColor="Gray"
            Source="bird.png" />
        <simpleCore:Icon
            WidthRequest="40"
            HeightRequest="40"
            TintColor="Orange"
            Source="bird.png" />
    </HorizontalStackLayout>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:simpleCore="clr-namespace:SimpleToolkit.Core;assembly=SimpleToolkit.Core">

<HorizontalStackLayout

HorizontalOptions="Center"

VerticalOptions="Center"

Spacing="10">

<simpleCore:Icon

WidthRequest="40"

HeightRequest="40"

Source="bird.png"/>

<simpleCore:Icon

WidthRequest="40"

HeightRequest="40"

TintColor="Gray"

Source="bird.png" />

<simpleCore:Icon

WidthRequest="40"

HeightRequest="40"

TintColor="Orange"

Source="bird.png" />

</HorizontalStackLayout>

</ContentPage>

▶ MauiProgram.cs


using SimpleToolkit.Core;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseSimpleToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using SimpleToolkit.Core;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseSimpleToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/SIMPLE TOOLKIT/.NET6] SimpleToolkit.Core 누겟 설치하기

■ SimpleToolkit.Core 누겟을 설치하는 방법을 보여준다. 1. Visual Studio를 실행한다. 2. [도구] / [NuGet 패키지 관리자] / [패키지 관리자 콘솔] 메뉴를 실행한다.

[C#/MAUI/.NET6] Plugin.Maui.Audio 누겟 설치하기

■ Plugin.Maui.Audio 누겟을 설치하는 방법을 보여준다. 1. Visual Studio를 실행한다. 2. [도구] / [NuGet 패키지 관리자] / [패키지 관리자 콘솔] 메뉴를 실행한다.

[C#/MAUI/.NET6] MP3 음악 파일 재생하기

■ MP3 음악 파일을 재생하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
    <VerticalStackLayout
        HorizontalOptions="Center"
        VerticalOptions="Center"
        Spacing="30">
        <HorizontalStackLayout
            HorizontalOptions="Center"
            Spacing="30">
            <Image>
                <Image.Source>
                    <FontImageSource x:Name="playFontImageSource"
                        FontFamily="ionicons"
                        Size="48"
                        Color="Black"
                        Glyph="&#xf488;" />
                </Image.Source>
                <Image.GestureRecognizers>
                    <TapGestureRecognizer x:Name="playTapGestureRecognizer"
                        NumberOfTapsRequired="1" />
                </Image.GestureRecognizers>
            </Image>
            <Image>
                <Image.Source>
                    <FontImageSource x:Name="pauseFontImageSource"
                        FontFamily="ionicons"
                        Size="48"
                        Color="Gray"
                        Glyph="&#xf478;" />
                </Image.Source>
                <Image.GestureRecognizers>
                    <TapGestureRecognizer x:Name="pauseTapGestureRecognizer"
                        NumberOfTapsRequired="1" />
                </Image.GestureRecognizers>
            </Image>
            <Image>
                <Image.Source>
                    <FontImageSource x:Name="stopFontImageSource"
                        FontFamily="ionicons"
                        Size="48"
                        Color="Gray"
                        Glyph="&#xf21a;" />
                </Image.Source>
                <Image.GestureRecognizers>
                    <TapGestureRecognizer x:Name="stopTapGestureRecognizer"
                        NumberOfTapsRequired="1" />
                </Image.GestureRecognizers>
            </Image>
        </HorizontalStackLayout>
            <Slider x:Name="volumeSlider"
                WidthRequest="300"
                Minimum="0"
                Maximum="1"
                Value="0.3"/>
    </VerticalStackLayout>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

<VerticalStackLayout

HorizontalOptions="Center"

VerticalOptions="Center"

Spacing="30">

<HorizontalStackLayout

HorizontalOptions="Center"

Spacing="30">

<Image>

<Image.Source>

<FontImageSource x:Name="playFontImageSource"

FontFamily="ionicons"

Size="48"

Color="Black"

Glyph="" />

</Image.Source>

<Image.GestureRecognizers>

<TapGestureRecognizer x:Name="playTapGestureRecognizer"

NumberOfTapsRequired="1" />

</Image.GestureRecognizers>

</Image>

<Image>

<Image.Source>

<FontImageSource x:Name="pauseFontImageSource"

FontFamily="ionicons"

Size="48"

Color="Gray"

Glyph="" />

</Image.Source>

<Image.GestureRecognizers>

<TapGestureRecognizer x:Name="pauseTapGestureRecognizer"

NumberOfTapsRequired="1" />

</Image.GestureRecognizers>

</Image>

<Image>

<Image.Source>

<FontImageSource x:Name="stopFontImageSource"

FontFamily="ionicons"

Size="48"

Color="Gray"

Glyph="" />

</Image.Source>

<Image.GestureRecognizers>

<TapGestureRecognizer x:Name="stopTapGestureRecognizer"

NumberOfTapsRequired="1" />

</Image.GestureRecognizers>

</Image>

</HorizontalStackLayout>

<Slider x:Name="volumeSlider"

WidthRequest="300"

Minimum="0"

Maximum="1"

Value="0.3"/>

</VerticalStackLayout>

</ContentPage>

▶ MainPage.xaml.cs


using Plugin.Maui.Audio;

namespace TestProject;

/// <summary>
/// 메인 페이지
/// </summary>
public partial class MainPage : ContentPage
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Field
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region Field

    /// <summary>
    /// 오디오 관리자
    /// </summary>
    private IAudioManager audioManager;

    /// <summary>
    /// 오디오 재생자
    /// </summary>
    private IAudioPlayer audioPlayer;

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainPage()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainPage()
    {
        InitializeComponent();

        this.audioManager = new AudioManager();

        Loaded                                += ContentPage_Loaded;
        this.playTapGestureRecognizer.Tapped  += playTapGestureRecognizer_Tapped;
        this.volumeSlider.ValueChanged        += volumeSlider_ValueChanged;
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region 컨텐트 페이지 로드시 처리하기 - ContentPage_Loaded(sender, e)

    /// <summary>
    /// 컨텐트 페이지 로드시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private async void ContentPage_Loaded(object sender, EventArgs e)
    {
        this.audioPlayer = this.audioManager.CreatePlayer(await FileSystem.OpenAppPackageFileAsync("sample.mp3"));

        this.audioPlayer.Volume = this.volumeSlider.Value;

        this.audioPlayer.PlaybackEnded += audioPlayer_PlaybackEnded;
    }

    #endregion
    #region 오디오 재생자 재생 종료시 처리하기 - audioPlayer_PlaybackEnded(sender, e)

    /// <summary>
    /// 오디오 재생자 재생 종료시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void audioPlayer_PlaybackEnded(object sender, EventArgs e)
    {
        this.playTapGestureRecognizer.Tapped  -= playTapGestureRecognizer_Tapped;
        this.pauseTapGestureRecognizer.Tapped -= pauseTapGestureRecognizer_Tapped;
        this.stopTapGestureRecognizer.Tapped  -= stopTapGestureRecognizer_Tapped;

        this.playTapGestureRecognizer.Tapped  += playTapGestureRecognizer_Tapped;

        this.playFontImageSource.Color  = Colors.Black;
        this.pauseFontImageSource.Color = Colors.Gray;
        this.stopFontImageSource.Color  = Colors.Gray;
    }

    #endregion
    #region 재생 탭 제스처 인식기 탭 처리하기 - playTapGestureRecognizer_Tapped(sender, e)

    /// <summary>
    /// 재생 탭 제스처 인식기 탭 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void playTapGestureRecognizer_Tapped(object sender, EventArgs e)
    {
        this.playTapGestureRecognizer.Tapped  -= playTapGestureRecognizer_Tapped;
        this.pauseTapGestureRecognizer.Tapped -= pauseTapGestureRecognizer_Tapped;
        this.stopTapGestureRecognizer.Tapped  -= stopTapGestureRecognizer_Tapped;

        this.pauseTapGestureRecognizer.Tapped += pauseTapGestureRecognizer_Tapped;
        this.stopTapGestureRecognizer.Tapped  += stopTapGestureRecognizer_Tapped;

        this.playFontImageSource.Color  = Colors.Gray;
        this.pauseFontImageSource.Color = Colors.Black;
        this.stopFontImageSource.Color  = Colors.Black;

        this.audioPlayer.Play();
    }

    #endregion
    #region 중지 탭 제스처 인식기 탭 처리하기 - pauseTapGestureRecognizer_Tapped(sender, e)

    /// <summary>
    /// 중지 탭 제스처 인식기 탭 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void pauseTapGestureRecognizer_Tapped(object sender, EventArgs e)
    {
        this.playTapGestureRecognizer.Tapped  -= playTapGestureRecognizer_Tapped;
        this.pauseTapGestureRecognizer.Tapped -= pauseTapGestureRecognizer_Tapped;
        this.stopTapGestureRecognizer.Tapped  -= stopTapGestureRecognizer_Tapped;

        this.playTapGestureRecognizer.Tapped  += playTapGestureRecognizer_Tapped;
        this.stopTapGestureRecognizer.Tapped  += stopTapGestureRecognizer_Tapped;

        this.playFontImageSource.Color  = Colors.Black;
        this.pauseFontImageSource.Color = Colors.Gray;
        this.stopFontImageSource.Color  = Colors.Black;

        this.audioPlayer.Pause();
    }

    #endregion
    #region 중단 탭 제스처 인식기 탭 처리하기 - stopTapGestureRecognizer_Tapped(sender, e)

    /// <summary>
    /// 중단 탭 제스처 인식기 탭 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void stopTapGestureRecognizer_Tapped(object sender, EventArgs e)
    {
        this.playTapGestureRecognizer.Tapped  -= playTapGestureRecognizer_Tapped;
        this.pauseTapGestureRecognizer.Tapped -= pauseTapGestureRecognizer_Tapped;
        this.stopTapGestureRecognizer.Tapped  -= stopTapGestureRecognizer_Tapped;

        this.playTapGestureRecognizer.Tapped  += playTapGestureRecognizer_Tapped;

        this.playFontImageSource.Color  = Colors.Black;
        this.pauseFontImageSource.Color = Colors.Gray;
        this.stopFontImageSource.Color  = Colors.Gray;

        this.audioPlayer.Stop();
    }

    #endregion
    #region 볼륨 슬라이더 값 변경시 처리하기 - volumeSlider_ValueChanged(sender, e)

    /// <summary>
    /// 볼륨 슬라이더 값 변경시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void volumeSlider_ValueChanged(object sender, ValueChangedEventArgs e)
    {
        this.audioPlayer.Volume = this.volumeSlider.Value;
    }

    #endregion
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

using Plugin.Maui.Audio;

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public partial class MainPage : ContentPage

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 오디오 관리자

/// </summary>

private IAudioManager audioManager;

/// <summary>

/// 오디오 재생자

/// </summary>

private IAudioPlayer audioPlayer;

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

this.audioManager = new AudioManager();

Loaded += ContentPage_Loaded;

this.playTapGestureRecognizer.Tapped += playTapGestureRecognizer_Tapped;

this.volumeSlider.ValueChanged += volumeSlider_ValueChanged;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 컨텐트 페이지 로드시 처리하기 - ContentPage_Loaded(sender, e)

/// <summary>

/// 컨텐트 페이지 로드시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private async void ContentPage_Loaded(object sender, EventArgs e)

{

this.audioPlayer = this.audioManager.CreatePlayer(await FileSystem.OpenAppPackageFileAsync("sample.mp3"));

this.audioPlayer.Volume = this.volumeSlider.Value;

this.audioPlayer.PlaybackEnded += audioPlayer_PlaybackEnded;

}

#endregion

#region 오디오 재생자 재생 종료시 처리하기 - audioPlayer_PlaybackEnded(sender, e)

/// <summary>

/// 오디오 재생자 재생 종료시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void audioPlayer_PlaybackEnded(object sender, EventArgs e)

{

this.playTapGestureRecognizer.Tapped -= playTapGestureRecognizer_Tapped;

this.pauseTapGestureRecognizer.Tapped -= pauseTapGestureRecognizer_Tapped;

this.stopTapGestureRecognizer.Tapped -= stopTapGestureRecognizer_Tapped;

this.playTapGestureRecognizer.Tapped += playTapGestureRecognizer_Tapped;

this.playFontImageSource.Color = Colors.Black;

this.pauseFontImageSource.Color = Colors.Gray;

this.stopFontImageSource.Color = Colors.Gray;

}

#endregion

#region 재생 탭 제스처 인식기 탭 처리하기 - playTapGestureRecognizer_Tapped(sender, e)

/// <summary>

/// 재생 탭 제스처 인식기 탭 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void playTapGestureRecognizer_Tapped(object sender, EventArgs e)

{

this.playTapGestureRecognizer.Tapped -= playTapGestureRecognizer_Tapped;

this.pauseTapGestureRecognizer.Tapped -= pauseTapGestureRecognizer_Tapped;

this.stopTapGestureRecognizer.Tapped -= stopTapGestureRecognizer_Tapped;

this.pauseTapGestureRecognizer.Tapped += pauseTapGestureRecognizer_Tapped;

this.stopTapGestureRecognizer.Tapped += stopTapGestureRecognizer_Tapped;

this.playFontImageSource.Color = Colors.Gray;

this.pauseFontImageSource.Color = Colors.Black;

this.stopFontImageSource.Color = Colors.Black;

this.audioPlayer.Play();

}

#endregion

#region 중지 탭 제스처 인식기 탭 처리하기 - pauseTapGestureRecognizer_Tapped(sender, e)

/// <summary>

/// 중지 탭 제스처 인식기 탭 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void pauseTapGestureRecognizer_Tapped(object sender, EventArgs e)

{

this.playTapGestureRecognizer.Tapped -= playTapGestureRecognizer_Tapped;

this.pauseTapGestureRecognizer.Tapped -= pauseTapGestureRecognizer_Tapped;

this.stopTapGestureRecognizer.Tapped -= stopTapGestureRecognizer_Tapped;

this.playTapGestureRecognizer.Tapped += playTapGestureRecognizer_Tapped;

this.stopTapGestureRecognizer.Tapped += stopTapGestureRecognizer_Tapped;

this.playFontImageSource.Color = Colors.Black;

this.pauseFontImageSource.Color = Colors.Gray;

this.stopFontImageSource.Color = Colors.Black;

this.audioPlayer.Pause();

}

#endregion

#region 중단 탭 제스처 인식기 탭 처리하기 - stopTapGestureRecognizer_Tapped(sender, e)

/// <summary>

/// 중단 탭 제스처 인식기 탭 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void stopTapGestureRecognizer_Tapped(object sender, EventArgs e)

{

this.playTapGestureRecognizer.Tapped -= playTapGestureRecognizer_Tapped;

this.pauseTapGestureRecognizer.Tapped -= pauseTapGestureRecognizer_Tapped;

this.stopTapGestureRecognizer.Tapped -= stopTapGestureRecognizer_Tapped;

this.playTapGestureRecognizer.Tapped += playTapGestureRecognizer_Tapped;

this.playFontImageSource.Color = Colors.Black;

this.pauseFontImageSource.Color = Colors.Gray;

this.stopFontImageSource.Color = Colors.Gray;

this.audioPlayer.Stop();

}

#endregion

#region 볼륨 슬라이더 값 변경시 처리하기 - volumeSlider_ValueChanged(sender, e)

/// <summary>

/// 볼륨 슬라이더 값 변경시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void volumeSlider_ValueChanged(object sender, ValueChangedEventArgs e)

{

this.audioPlayer.Volume = this.volumeSlider.Value;

}

#endregion

}

TestProject.zip

[C#/MAUI/.NET6] IMTAdmob 인터페이스 : 애드몹(AdMob) 전면 광고 사용하기

■ IMTAdmob 인터페이스를 사용해 애드몹(AdMob) 전면 광고를 사용하는 방법을 보여준다. ▶ TestProject.csproj


<Project Sdk="Microsoft.NET.Sdk">
    <PropertyGroup>
        <TargetFrameworks>net6.0-android;net6.0-ios;net6.0-maccatalyst</TargetFrameworks>
        <TargetFrameworks Condition="$([MSBuild]::IsOSPlatform('windows'))">$(TargetFrameworks);net6.0-windows10.0.19041.0</TargetFrameworks>
        <OutputType>Exe</OutputType>
        <RootNamespace>TestProject</RootNamespace>
        <UseMaui>true</UseMaui>
        <SingleProject>true</SingleProject>
        <ImplicitUsings>enable</ImplicitUsings>
        <ApplicationTitle>TestProject</ApplicationTitle>
        <ApplicationId>com.companyname.testproject</ApplicationId>
        <ApplicationIdGuid>307F785A-6EDE-4AEB-8813-DC0FFA886398</ApplicationIdGuid>
        <ApplicationDisplayVersion>1.0</ApplicationDisplayVersion>
        <ApplicationVersion>1</ApplicationVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'ios'">14.2</SupportedOSPlatformVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'maccatalyst'">14.0</SupportedOSPlatformVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'android'">21.0</SupportedOSPlatformVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'windows'">10.0.17763.0</SupportedOSPlatformVersion>
        <TargetPlatformMinVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'windows'">10.0.17763.0</TargetPlatformMinVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'tizen'">6.5</SupportedOSPlatformVersion>
        <EmbedAssembliesIntoApk>true</EmbedAssembliesIntoApk>
    </PropertyGroup>
    <ItemGroup>
        <MauiIcon Include="Resources\appicon.svg" ForegroundFile="Resources\appiconfg.svg" Color="#512bd4" />
        <MauiSplashScreen Include="Resources\appiconfg.svg" Color="#512bd4" BaseSize="128,128" />
        <MauiImage Include="Resources\Images\*" />
        <MauiImage Update="Resources\Images\dotnet_bot.svg" BaseSize="168,208" />
        <MauiFont Include="Resources\Fonts\*" />
        <MauiAsset Include="Resources\Raw\**" LogicalName="%(RecursiveDir)%(Filename)%(Extension)" />
    </ItemGroup>
    <ItemGroup Condition="'$(TargetFramework)' == 'net6.0-android'">
        <AndroidLibrary Include="Dependencies\user-messaging-platform-2.0.0.aar" Bind="false" />
    </ItemGroup>
    <ItemGroup>
        <PackageReference Include="Plugin.MauiMTAdmob" Version="1.0.1" />
    </ItemGroup>
</Project>

<TargetFrameworks>net6.0-android;net6.0-ios;net6.0-maccatalyst</TargetFrameworks>

<TargetFrameworks Condition="$([MSBuild]::IsOSPlatform('windows'))">$(TargetFrameworks);net6.0-windows10.0.19041.0</TargetFrameworks>

<RootNamespace>TestProject</RootNamespace>

<ImplicitUsings>enable</ImplicitUsings>

<ApplicationTitle>TestProject</ApplicationTitle>

<ApplicationId>com.companyname.testproject</ApplicationId>

</PropertyGroup>

</ItemGroup>

</ItemGroup>

</ItemGroup>

</Project>

▶ Platforms/Android/AndroidManifest.xml


<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
    <application
        android:allowBackup="true"
        android:icon="@android:mipmap/sym_def_app_icon"
        android:roundIcon="@mipmap/appicon_round"
        android:supportsRtl="true">
        <meta-data android:name="com.google.android.gms.ads.APPLICATION_ID" android:value="ca-app-pub-3940256099942544~3347511713" />
    </application>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.INTERNET"             />
</manifest>

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

<application

android:allowBackup="true"

android:icon="@android:mipmap/sym_def_app_icon"

android:roundIcon="@mipmap/appicon_round"

android:supportsRtl="true">

</application>

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

<uses-permission android:name="android.permission.INTERNET" />

</manifest>

▶ Platforms/Android/MainActivity.cs


using Android.App;
using Android.Content.PM;
using Android.Gms.Ads;
using Android.OS;

namespace TestProject;

/// <summary>
/// 메인 액티비티
/// </summary>
[
    Activity
    (
        Theme                = "@style/Maui.SplashTheme",
        MainLauncher         = true,
        ConfigurationChanges = ConfigChanges.ScreenSize         |
                               ConfigChanges.Orientation        |
                               ConfigChanges.UiMode             |
                               ConfigChanges.ScreenLayout       |
                               ConfigChanges.SmallestScreenSize |
                               ConfigChanges.Density
    )
]
public class MainActivity : MauiAppCompatActivity
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Protected

    #region 생성시 처리하기 - OnCreate(savedInstanceState)

    /// <summary>
    /// 생성시 처리하기
    /// </summary>
    /// <param name="savedInstanceState">저장 인스턴스 상태</param>
    protected override void OnCreate(Bundle savedInstanceState)
    {
        base.OnCreate(savedInstanceState);

        MobileAds.Initialize(this);
    }

    #endregion
}

using Android.App;

using Android.Content.PM;

using Android.Gms.Ads;

using Android.OS;

namespace TestProject;

/// <summary>

/// 메인 액티비티

/// </summary>

[

Activity

(

Theme = "@style/Maui.SplashTheme",

MainLauncher = true,

ConfigurationChanges = ConfigChanges.ScreenSize |

ConfigChanges.Orientation |

ConfigChanges.UiMode |

ConfigChanges.ScreenLayout |

ConfigChanges.SmallestScreenSize |

ConfigChanges.Density

)

]

public class MainActivity : MauiAppCompatActivity

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Protected

#region 생성시 처리하기 - OnCreate(savedInstanceState)

/// <summary>

/// 생성시 처리하기

/// </summary>

/// <param name="savedInstanceState">저장 인스턴스 상태</param>

protected override void OnCreate(Bundle savedInstanceState)

{

base.OnCreate(savedInstanceState);

MobileAds.Initialize(this);

}

#endregion

}

▶ Platforms/iOS/AppDelegate.cs


using Foundation;
using Google.MobileAds;
using UIKit;

namespace TestProject;

/// <summary>
/// 앱 대리자
/// </summary>
[Register("AppDelegate")]
public class AppDelegate : MauiUIApplicationDelegate
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 런칭 완료시 처리하기 - FinishedLaunching(application, launchOptions)

    /// <summary>
    /// 런칭 완료시 처리하기
    /// </summary>
    /// <param name="application">애플리케이션</param>
    /// <param name="launchOptions">런치 옵션</param>
    /// <returns>처리 결과</returns>
    public override bool FinishedLaunching(UIApplication application, NSDictionary launchOptions)
    {
        MobileAds.SharedInstance.Start(CompletionHandler);

        return base.FinishedLaunching(application, launchOptions);
    }

    #endregion

    ////////////////////////////////////////////////////////////////////////////////////////// Protected

    #region MUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MUI 앱 생성하기
    /// </summary>
    /// <returns>MUI 앱</returns>
    protected override MauiApp CreateMauiApp() => MauiProgram.CreateMauiApp();

    #endregion

    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region 완료 처리기 - CompletionHandler(status)

    /// <summary>
    /// 완료 처리기
    /// </summary>
    /// <param name="status">상태</param>
    private void CompletionHandler(InitializationStatus status)
    {
    }

    #endregion
}

using Foundation;

using Google.MobileAds;

using UIKit;

namespace TestProject;

/// <summary>

/// 앱 대리자

/// </summary>

[Register("AppDelegate")]

public class AppDelegate : MauiUIApplicationDelegate

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 런칭 완료시 처리하기 - FinishedLaunching(application, launchOptions)

/// <summary>

/// 런칭 완료시 처리하기

/// </summary>

/// <param name="application">애플리케이션</param>

/// <param name="launchOptions">런치 옵션</param>

/// <returns>처리 결과</returns>

public override bool FinishedLaunching(UIApplication application, NSDictionary launchOptions)

{

MobileAds.SharedInstance.Start(CompletionHandler);

return base.FinishedLaunching(application, launchOptions);

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Protected

#region MUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MUI 앱 생성하기

/// </summary>

/// <returns>MUI 앱</returns>

protected override MauiApp CreateMauiApp() => MauiProgram.CreateMauiApp();

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 완료 처리기 - CompletionHandler(status)

/// <summary>

/// 완료 처리기

/// </summary>

/// <param name="status">상태</param>

private void CompletionHandler(InitializationStatus status)

{

}

#endregion

}

[C#/MAUI/.NET6] Plugin.MauiMTAdmob 누겟 설치하기

■ Plugin.MauiMTAdmob 누겟을 설치하는 방법을 보여준다. 1. Visual Studio를 실행한다. 2. [도구] / [NuGet 패키지 관리자] / [패키지 관리자 콘솔] 메뉴를 실행한다.

[C#/MAUI/.NET6] MTAdView 엘리먼트 : 애드몹(AdMob) 배너 광고 사용하기

■ MTAdView 엘리먼트를 사용해 애드몹(AdMob) 배너 광고를 표시는 방법을 보여준다. ▶ TestProject.csproj


<Project Sdk="Microsoft.NET.Sdk">
    <PropertyGroup>
        <TargetFrameworks>net6.0-android;net6.0-ios;net6.0-maccatalyst</TargetFrameworks>
        <TargetFrameworks Condition="$([MSBuild]::IsOSPlatform('windows'))">$(TargetFrameworks);net6.0-windows10.0.19041.0</TargetFrameworks>
        <OutputType>Exe</OutputType>
        <RootNamespace>TestProject</RootNamespace>
        <UseMaui>true</UseMaui>
        <SingleProject>true</SingleProject>
        <ImplicitUsings>enable</ImplicitUsings>
        <ApplicationTitle>TestProject</ApplicationTitle>
        <ApplicationId>com.companyname.testproject</ApplicationId>
        <ApplicationIdGuid>307F785A-6EDE-4AEB-8813-DC0FFA886398</ApplicationIdGuid>
        <ApplicationDisplayVersion>1.0</ApplicationDisplayVersion>
        <ApplicationVersion>1</ApplicationVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'ios'">14.2</SupportedOSPlatformVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'maccatalyst'">14.0</SupportedOSPlatformVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'android'">21.0</SupportedOSPlatformVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'windows'">10.0.17763.0</SupportedOSPlatformVersion>
        <TargetPlatformMinVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'windows'">10.0.17763.0</TargetPlatformMinVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'tizen'">6.5</SupportedOSPlatformVersion>
        <EmbedAssembliesIntoApk>true</EmbedAssembliesIntoApk>
    </PropertyGroup>
    <ItemGroup>
        <MauiIcon Include="Resources\appicon.svg" ForegroundFile="Resources\appiconfg.svg" Color="#512bd4" />
        <MauiSplashScreen Include="Resources\appiconfg.svg" Color="#512bd4" BaseSize="128,128" />
        <MauiImage Include="Resources\Images\*" />
        <MauiImage Update="Resources\Images\dotnet_bot.svg" BaseSize="168,208" />
        <MauiFont Include="Resources\Fonts\*" />
        <MauiAsset Include="Resources\Raw\**" LogicalName="%(RecursiveDir)%(Filename)%(Extension)" />
    </ItemGroup>
    <ItemGroup Condition="'$(TargetFramework)' == 'net6.0-android'">
        <AndroidLibrary Include="Dependencies\user-messaging-platform-2.0.0.aar" Bind="false" />
    </ItemGroup>
    <ItemGroup>
        <PackageReference Include="Plugin.MauiMTAdmob" Version="1.0.1" />
    </ItemGroup>
</Project>

<TargetFrameworks>net6.0-android;net6.0-ios;net6.0-maccatalyst</TargetFrameworks>

<TargetFrameworks Condition="$([MSBuild]::IsOSPlatform('windows'))">$(TargetFrameworks);net6.0-windows10.0.19041.0</TargetFrameworks>

<RootNamespace>TestProject</RootNamespace>

<ImplicitUsings>enable</ImplicitUsings>

<ApplicationTitle>TestProject</ApplicationTitle>

<ApplicationId>com.companyname.testproject</ApplicationId>

</PropertyGroup>

</ItemGroup>

</ItemGroup>

</ItemGroup>

</Project>

▶ Platforms/Android/AndroidManifest.xml


<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
    <application
        android:allowBackup="true"
        android:icon="@android:mipmap/sym_def_app_icon"
        android:roundIcon="@mipmap/appicon_round"
        android:supportsRtl="true">
        <meta-data android:name="com.google.android.gms.ads.APPLICATION_ID" android:value="ca-app-pub-3940256099942544~3347511713" />
    </application>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.INTERNET"             />
</manifest>

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

<application

android:allowBackup="true"

android:icon="@android:mipmap/sym_def_app_icon"

android:roundIcon="@mipmap/appicon_round"

android:supportsRtl="true">

</application>

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

<uses-permission android:name="android.permission.INTERNET" />

</manifest>

▶ Platforms/Android/MainActivity.cs


using Android.App;
using Android.Content.PM;
using Android.Gms.Ads;
using Android.OS;

namespace TestProject;

/// <summary>
/// 메인 액티비티
/// </summary>
[
    Activity
    (
        Theme                = "@style/Maui.SplashTheme",
        MainLauncher         = true,
        ConfigurationChanges = ConfigChanges.ScreenSize         |
                               ConfigChanges.Orientation        |
                               ConfigChanges.UiMode             |
                               ConfigChanges.ScreenLayout       |
                               ConfigChanges.SmallestScreenSize |
                               ConfigChanges.Density
    )
]
public class MainActivity : MauiAppCompatActivity
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Protected

    #region 생성시 처리하기 - OnCreate(savedInstanceState)

    /// <summary>
    /// 생성시 처리하기
    /// </summary>
    /// <param name="savedInstanceState">저장 인스턴스 상태</param>
    protected override void OnCreate(Bundle savedInstanceState)
    {
        base.OnCreate(savedInstanceState);

        MobileAds.Initialize(this);
    }

    #endregion
}

using Android.App;

using Android.Content.PM;

using Android.Gms.Ads;

using Android.OS;

namespace TestProject;

/// <summary>

/// 메인 액티비티

/// </summary>

[

Activity

(

Theme = "@style/Maui.SplashTheme",

MainLauncher = true,

ConfigurationChanges = ConfigChanges.ScreenSize |

ConfigChanges.Orientation |

ConfigChanges.UiMode |

ConfigChanges.ScreenLayout |

ConfigChanges.SmallestScreenSize |

ConfigChanges.Density

)

]

public class MainActivity : MauiAppCompatActivity

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Protected

#region 생성시 처리하기 - OnCreate(savedInstanceState)

/// <summary>

/// 생성시 처리하기

/// </summary>

/// <param name="savedInstanceState">저장 인스턴스 상태</param>

protected override void OnCreate(Bundle savedInstanceState)

{

base.OnCreate(savedInstanceState);

MobileAds.Initialize(this);

}

#endregion

}

▶ Platforms/iOS/AppDelegate.cs


using Foundation;
using Google.MobileAds;
using UIKit;

namespace TestProject;

/// <summary>
/// 앱 대리자
/// </summary>
[Register("AppDelegate")]
public class AppDelegate : MauiUIApplicationDelegate
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 런칭 완료시 처리하기 - FinishedLaunching(application, launchOptions)

    /// <summary>
    /// 런칭 완료시 처리하기
    /// </summary>
    /// <param name="application">애플리케이션</param>
    /// <param name="launchOptions">런치 옵션</param>
    /// <returns>처리 결과</returns>
    public override bool FinishedLaunching(UIApplication application, NSDictionary launchOptions)
    {
        MobileAds.SharedInstance.Start(CompletionHandler);

        return base.FinishedLaunching(application, launchOptions);
    }

    #endregion

    ////////////////////////////////////////////////////////////////////////////////////////// Protected

    #region MUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MUI 앱 생성하기
    /// </summary>
    /// <returns>MUI 앱</returns>
    protected override MauiApp CreateMauiApp() => MauiProgram.CreateMauiApp();

    #endregion

    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region 완료 처리기 - CompletionHandler(status)

    /// <summary>
    /// 완료 처리기
    /// </summary>
    /// <param name="status">상태</param>
    private void CompletionHandler(InitializationStatus status)
    {
    }

    #endregion
}

using Foundation;

using Google.MobileAds;

using UIKit;

namespace TestProject;

/// <summary>

/// 앱 대리자

/// </summary>

[Register("AppDelegate")]

public class AppDelegate : MauiUIApplicationDelegate

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 런칭 완료시 처리하기 - FinishedLaunching(application, launchOptions)

/// <summary>

/// 런칭 완료시 처리하기

/// </summary>

/// <param name="application">애플리케이션</param>

/// <param name="launchOptions">런치 옵션</param>

/// <returns>처리 결과</returns>

public override bool FinishedLaunching(UIApplication application, NSDictionary launchOptions)

{

MobileAds.SharedInstance.Start(CompletionHandler);

return base.FinishedLaunching(application, launchOptions);

}

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Protected

#region MUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MUI 앱 생성하기

/// </summary>

/// <returns>MUI 앱</returns>

protected override MauiApp CreateMauiApp() => MauiProgram.CreateMauiApp();

#endregion

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 완료 처리기 - CompletionHandler(status)

/// <summary>

/// 완료 처리기

/// </summary>

/// <param name="status">상태</param>

private void CompletionHandler(InitializationStatus status)

{

}

#endregion

}

[C#/MAUI/.NET6] CameraBarcodeReaderView 엘리먼트 : 바코드/QR 코드 캡처하기

■ CameraBarcodeReaderView 엘리먼트를 사용해 바코드/QR 코드를 캡처하는 방법을 보여준다. ▶ TestProject.cs


<Project Sdk="Microsoft.NET.Sdk">
    <PropertyGroup>
        <TargetFrameworks>net6.0-android;net6.0-ios;net6.0-maccatalyst</TargetFrameworks>
        <TargetFrameworks Condition="$([MSBuild]::IsOSPlatform('windows'))">$(TargetFrameworks);net6.0-windows10.0.19041.0</TargetFrameworks>
        <OutputType>Exe</OutputType>
        <RootNamespace>TestProject</RootNamespace>
        <UseMaui>true</UseMaui>
        <SingleProject>true</SingleProject>
        <ImplicitUsings>enable</ImplicitUsings>
        <ApplicationTitle>TestProject</ApplicationTitle>
        <ApplicationId>com.companyname.testproject</ApplicationId>
        <ApplicationIdGuid>307F785A-6EDE-4AEB-8813-DC0FFA886398</ApplicationIdGuid>
        <ApplicationDisplayVersion>1.0</ApplicationDisplayVersion>
        <ApplicationVersion>1</ApplicationVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'ios'">14.2</SupportedOSPlatformVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'maccatalyst'">14.0</SupportedOSPlatformVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'android'">31.0</SupportedOSPlatformVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'windows'">10.0.17763.0</SupportedOSPlatformVersion>
        <TargetPlatformMinVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'windows'">10.0.17763.0</TargetPlatformMinVersion>
        <SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'tizen'">6.5</SupportedOSPlatformVersion>
        <EmbedAssembliesIntoApk>true</EmbedAssembliesIntoApk>
    </PropertyGroup>
    <ItemGroup>
        <MauiIcon
            Include="Resources\appicon.svg"
            ForegroundFile="Resources\appiconfg.svg"
            Color="#512bd4" />
        <MauiSplashScreen
            Include="Resources\appiconfg.svg"
            Color="#512bd4"
            BaseSize="128,128" />
        <MauiImage Include="Resources\Images\*" />
        <MauiImage
            Update="Resources\Images\dotnet_bot.svg"
            BaseSize="168,208" />
        <MauiFont Include="Resources\Fonts\*" />
        <MauiAsset
            Include="Resources\Raw\**"
            LogicalName="%(RecursiveDir)%(Filename)%(Extension)" />
    </ItemGroup>
    <ItemGroup>
        <PackageReference Include="ZXing.Net.Maui" Version="0.1.0-preview.5" />
    </ItemGroup>
</Project>

<TargetFrameworks>net6.0-android;net6.0-ios;net6.0-maccatalyst</TargetFrameworks>

<TargetFrameworks Condition="$([MSBuild]::IsOSPlatform('windows'))">$(TargetFrameworks);net6.0-windows10.0.19041.0</TargetFrameworks>

<RootNamespace>TestProject</RootNamespace>

<ImplicitUsings>enable</ImplicitUsings>

<ApplicationTitle>TestProject</ApplicationTitle>

<ApplicationId>com.companyname.testproject</ApplicationId>

</PropertyGroup>

<MauiIcon

Include="Resources\appicon.svg"

ForegroundFile="Resources\appiconfg.svg"

Color="#512bd4" />

<MauiSplashScreen

Include="Resources\appiconfg.svg"

Color="#512bd4"

BaseSize="128,128" />

<MauiImage

Update="Resources\Images\dotnet_bot.svg"

BaseSize="168,208" />

<MauiAsset

Include="Resources\Raw\**"

LogicalName="%(RecursiveDir)%(Filename)%(Extension)" />

</ItemGroup>

</ItemGroup>

</Project>

▶ Platforms\Android\AndroidManifest.xml


<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
    <application
        android:allowBackup="true"
        android:icon="@android:mipmap/sym_def_app_icon"
        android:roundIcon="@mipmap/appicon_round"
        android:supportsRtl="true" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.INTERNET"             />
    <uses-permission android:name="android.permission.CAMERA"               />
</manifest>

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

<application

android:allowBackup="true"

android:icon="@android:mipmap/sym_def_app_icon"

android:roundIcon="@mipmap/appicon_round"

android:supportsRtl="true" />

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

<uses-permission android:name="android.permission.INTERNET" />

<uses-permission android:name="android.permission.CAMERA" />

</manifest>

▶ MauiProgram.cs


using ZXing.Net.Maui;
using ZXing.Net.Maui.Controls;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseBarcodeReader()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            )
            .ConfigureMauiHandlers
            (
                handlerCollection =>
                {
                    handlerCollection.AddHandler(typeof(CameraBarcodeReaderView), typeof(CameraBarcodeReaderViewHandler));
                    handlerCollection.AddHandler(typeof(CameraView             ), typeof(CameraViewHandler             ));
                    handlerCollection.AddHandler(typeof(BarcodeGeneratorView   ), typeof(BarcodeGeneratorViewHandler   ));
                }
            );

        return builder.Build();
    }

    #endregion
}

using ZXing.Net.Maui;

using ZXing.Net.Maui.Controls;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseBarcodeReader()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

)

.ConfigureMauiHandlers

(

handlerCollection =>

{

handlerCollection.AddHandler(typeof(CameraBarcodeReaderView), typeof(CameraBarcodeReaderViewHandler));

handlerCollection.AddHandler(typeof(CameraView ), typeof(CameraViewHandler ));

handlerCollection.AddHandler(typeof(BarcodeGeneratorView ), typeof(BarcodeGeneratorViewHandler ));

}

);

return builder.Build();

}

#endregion

}

▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:zxing="clr-namespace:ZXing.Net.Maui.Controls;assembly=ZXing.Net.MAUI">
    <Grid RowDefinitions="*,*,30">
        <zxing:CameraBarcodeReaderView x:Name="cameraBarcodeReaderView" Grid.Row="0"
            IsDetecting="True"
            IsTorchOn="False" />
        <HorizontalStackLayout Grid.Row="0"
            HorizontalOptions="Start"
            VerticalOptions="Start">
            <Label
                VerticalOptions="Center"
                Margin="10,0,0,0"
                TextColor="White"
                Text="후면" />
            <Switch x:Name="cameraLocationSwitch"
                VerticalOptions="Center"
                IsToggled="False" />
            <Label
                VerticalOptions="Center"
                Margin="0"
                TextColor="White"
                Text="전면" />
        </HorizontalStackLayout>
        <HorizontalStackLayout Grid.Row="0"
            HorizontalOptions="End"
            VerticalOptions="Start">
            <Switch x:Name="cameraLightSwitch"
                VerticalOptions="Center"
                IsToggled="False" />
            <Label
                VerticalOptions="Center"
                Margin="0,0,10,0"
                TextColor="White"
                Text="조명" />
        </HorizontalStackLayout>
        <zxing:BarcodeGeneratorView x:Name="barcodeGeneratorView" Grid.Row="1"
            Margin="20"
            ForegroundColor="Black"
            Format="QrCode" />
        <Label x:Name="barcodeResultLabel" Grid.Row="2"
            VerticalOptions="End"
            Margin="10,0,0,0"
            FontSize="18" />
    </Grid>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:zxing="clr-namespace:ZXing.Net.Maui.Controls;assembly=ZXing.Net.MAUI">

<zxing:CameraBarcodeReaderView x:Name="cameraBarcodeReaderView" Grid.Row="0"

IsDetecting="True"

IsTorchOn="False" />

<HorizontalStackLayout Grid.Row="0"

HorizontalOptions="Start"

VerticalOptions="Start">

<Label

VerticalOptions="Center"

Margin="10,0,0,0"

TextColor="White"

Text="후면" />

<Switch x:Name="cameraLocationSwitch"

VerticalOptions="Center"

IsToggled="False" />

<Label

VerticalOptions="Center"

Margin="0"

TextColor="White"

Text="전면" />

</HorizontalStackLayout>

<HorizontalStackLayout Grid.Row="0"

HorizontalOptions="End"

VerticalOptions="Start">

<Switch x:Name="cameraLightSwitch"

VerticalOptions="Center"

IsToggled="False" />

<Label

VerticalOptions="Center"

Margin="0,0,10,0"

TextColor="White"

Text="조명" />

</HorizontalStackLayout>

<zxing:BarcodeGeneratorView x:Name="barcodeGeneratorView" Grid.Row="1"

Margin="20"

ForegroundColor="Black"

Format="QrCode" />

<Label x:Name="barcodeResultLabel" Grid.Row="2"

VerticalOptions="End"

Margin="10,0,0,0"

FontSize="18" />

</Grid>

</ContentPage>

▶

[C#/MAUI/.NET6] ZXing.Net.Maui 누겟 설치하기

■ ZXing.Net.Maui 누겟을 설치하는 방법을 보여준다. 1. Visual Studio를 실행한다. 2. [도구] / [NuGet 패키지 관리자] / [패키지 관리자 콘솔] 메뉴를 실행한다.

[C#/MAUI/.NET6] Border 엘리먼트 : 제목 장식하기

■ Border 엘리먼트를 사용해 제목을 장식하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
    <ContentPage.Resources>
        <LinearGradientBrush x:Key="BorderBackgroundLinearGradientBrushKey"
            EndPoint="0,1">
            <GradientStop Offset="0.1" Color="DarkGreen"  />
            <GradientStop Offset="1.0" Color="LightGreen" />
        </LinearGradientBrush>
        <Shadow x:Key="BorderShadowKey"
            Offset="10,10"
            Radius="20"
            Opacity="1">
            <Shadow.Brush>
                <LinearGradientBrush>
                    <GradientStop Offset="0.1" Color="LightGray" />
                    <GradientStop Offset="1.0" Color="Gray"      />
                </LinearGradientBrush>
            </Shadow.Brush>
        </Shadow>
        <Shadow x:Key="LabelShadowKey"
            Offset="10,10"
            Radius="10"
            Opacity="1">
            <Shadow.Brush>
                <LinearGradientBrush>
                    <GradientStop Offset="0.1" Color="Black" />
                    <GradientStop Offset="1.0" Color="Gray"  />
                </LinearGradientBrush>
            </Shadow.Brush>
        </Shadow>
    </ContentPage.Resources>
    <StackLayout
        HorizontalOptions="Center"
        VerticalOptions="Center"
        Spacing="10">
        <Grid Margin="10">
            <Border
                StrokeThickness="0"
                Background="{StaticResource BorderBackgroundLinearGradientBrushKey}"
                Shadow="{StaticResource BorderShadowKey}">
                <Border.StrokeShape>
                    <RoundRectangle CornerRadius="0,50,0,50" />
                </Border.StrokeShape>
            </Border>
            <Label
                HorizontalOptions="Center"
                VerticalOptions="Center"
                Padding="10"
                Shadow="{StaticResource LabelShadowKey}"
                FontSize="30"
                FontAttributes="Bold"
                TextColor="White"
                Text="MAUI" />
        </Grid>
        <Grid Margin="10">
            <Border
                StrokeThickness="0"
                Background="{StaticResource BorderBackgroundLinearGradientBrushKey}"
                Shadow="{StaticResource BorderShadowKey}">
                <Border.StrokeShape>
                    <RoundRectangle CornerRadius="0,0,50,50" />
                </Border.StrokeShape>
            </Border>
            <Label
                HorizontalOptions="Center"
                VerticalOptions="Center"
                Padding="10"
                Shadow="{StaticResource LabelShadowKey}"
                FontSize="30"
                FontAttributes="Bold"
                TextColor="White"
                Text="MAUI" />
        </Grid>
        <Grid Margin="10">
            <Border
                StrokeThickness="0"
                Background="{StaticResource BorderBackgroundLinearGradientBrushKey}"
                Shadow="{StaticResource BorderShadowKey}">
                <Border.StrokeShape>
                    <RoundRectangle CornerRadius="50,50,50,50" />
                </Border.StrokeShape>
            </Border>
            <Label
                HorizontalOptions="Center"
                VerticalOptions="Center"
                Padding="10"
                Shadow="{StaticResource LabelShadowKey}"
                FontSize="30"
                FontAttributes="Bold"
                TextColor="White"
                Text="MAUI" />
        </Grid>
    </StackLayout>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

<ContentPage.Resources>

<LinearGradientBrush x:Key="BorderBackgroundLinearGradientBrushKey"

EndPoint="0,1">

</LinearGradientBrush>

<Shadow x:Key="BorderShadowKey"

Offset="10,10"

Radius="20"

Opacity="1">

<Shadow.Brush>

</LinearGradientBrush>

</Shadow.Brush>

</Shadow>

<Shadow x:Key="LabelShadowKey"

Offset="10,10"

Radius="10"

Opacity="1">

<Shadow.Brush>

</LinearGradientBrush>

</Shadow.Brush>

</Shadow>

</ContentPage.Resources>

<StackLayout

HorizontalOptions="Center"

VerticalOptions="Center"

Spacing="10">

<Border

StrokeThickness="0"

Background="{StaticResource BorderBackgroundLinearGradientBrushKey}"

Shadow="{StaticResource BorderShadowKey}">

<Border.StrokeShape>

</Border.StrokeShape>

</Border>

<Label

HorizontalOptions="Center"

VerticalOptions="Center"

Padding="10"

Shadow="{StaticResource LabelShadowKey}"

FontSize="30"

FontAttributes="Bold"

TextColor="White"

Text="MAUI" />

</Grid>

<Border

StrokeThickness="0"

Background="{StaticResource BorderBackgroundLinearGradientBrushKey}"

Shadow="{StaticResource BorderShadowKey}">

<Border.StrokeShape>

</Border.StrokeShape>

</Border>

<Label

HorizontalOptions="Center"

VerticalOptions="Center"

Padding="10"

Shadow="{StaticResource LabelShadowKey}"

FontSize="30"

FontAttributes="Bold"

TextColor="White"

Text="MAUI" />

</Grid>

<Border

StrokeThickness="0"

Background="{StaticResource BorderBackgroundLinearGradientBrushKey}"

Shadow="{StaticResource BorderShadowKey}">

<Border.StrokeShape>

</Border.StrokeShape>

</Border>

<Label

HorizontalOptions="Center"

VerticalOptions="Center"

Padding="10"

Shadow="{StaticResource LabelShadowKey}"

FontSize="30"

FontAttributes="Bold"

TextColor="White"

Text="MAUI" />

</Grid>

</StackLayout>

</ContentPage>

TestProject.zip

[C#/MAUI/.NET6] Label 엘리먼트 : Shadow 속성 사용하기

■ Label 엘리먼트의 Shadow 속성을 사용하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    BackgroundColor="Gold">
    <Label
        HorizontalOptions="Center"
        VerticalOptions="Center"
        FontSize="72"
        FontAttributes="Bold"
        TextColor="White"
        Text="MAUI">
        <Label.Shadow>
            <Shadow
                Offset="10,10"
                Radius="20"
                Opacity="1">
                <Shadow.Brush>
                    <LinearGradientBrush>
                        <GradientStop Offset="0.1" Color="Black"    />
                        <GradientStop Offset="1.0" Color="DarkGray" />
                    </LinearGradientBrush>
                </Shadow.Brush>
            </Shadow>
        </Label.Shadow>
    </Label>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

BackgroundColor="Gold">

<Label

HorizontalOptions="Center"

VerticalOptions="Center"

FontSize="72"

FontAttributes="Bold"

TextColor="White"

Text="MAUI">

<Label.Shadow>

<Shadow

Offset="10,10"

Radius="20"

Opacity="1">

<Shadow.Brush>

</LinearGradientBrush>

</Shadow.Brush>

</Shadow>

</Label.Shadow>

</Label>

</ContentPage>

TestProject.zip

[C#/MAUI/COMMUNITY TOOLKIT/.NET6] Popup 엘리먼트 : 팝업 표시하기

■ Popup 엘리먼트를 사용해 팝업을 표시하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<toolkit:Popup x:Class="TestProject.CustomPopup"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
    HorizontalOptions="Center"
    VerticalOptions="Center"
    Color="White"
    CanBeDismissedByTappingOutsideOfPopup="True">
    <Grid
        WidthRequest="300"
        HeightRequest="400">
        <VerticalStackLayout
            HorizontalOptions="Center"
            VerticalOptions="Center"
            Spacing="10">
            <Label
                HorizontalOptions="Center"
                FontSize="24"
                Text="샘플 팝업 입니다." />
            <HorizontalStackLayout
                HorizontalOptions="Center"
                Margin="10">
                <Button x:Name="okButton"
                    HorizontalOptions="Center"
                    Text="확인" />
                <Button x:Name="cancelButton"
                    Margin="10,0,0,0"
                    HorizontalOptions="Center"
                    Text="취소" />
            </HorizontalStackLayout>
        </VerticalStackLayout>
    </Grid>
</toolkit:Popup>

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

<toolkit:Popup x:Class="TestProject.CustomPopup"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"

HorizontalOptions="Center"

VerticalOptions="Center"

Color="White"

CanBeDismissedByTappingOutsideOfPopup="True">

<Grid

WidthRequest="300"

HeightRequest="400">

<VerticalStackLayout

HorizontalOptions="Center"

VerticalOptions="Center"

Spacing="10">

<Label

HorizontalOptions="Center"

FontSize="24"

Text="샘플 팝업 입니다." />

<HorizontalStackLayout

HorizontalOptions="Center"

Margin="10">

<Button x:Name="okButton"

HorizontalOptions="Center"

Text="확인" />

<Button x:Name="cancelButton"

Margin="10,0,0,0"

HorizontalOptions="Center"

Text="취소" />

</HorizontalStackLayout>

</VerticalStackLayout>

</Grid>

</toolkit:Popup>

▶ MainPage.xaml.cs


using CommunityToolkit.Maui.Views;

namespace TestProject;

/// <summary>
/// 커스텀 팝업
/// </summary>
public partial class CustomPopup : Popup
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - CustomPopup()

    /// <summary>
    /// 생성자
    /// </summary>
    public CustomPopup()
    {
        InitializeComponent();

        ResultWhenUserTapsOutsideOfPopup = "외부";

        this.okButton.Clicked     += okButton_Clicked;
        this.cancelButton.Clicked += cancelButton_Clicked;
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region 확인 버튼 클릭시 처리하기 - okButton_Clicked(sender, e)

    /// <summary>
    /// 확인 버튼 클릭시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void okButton_Clicked(object sender, EventArgs e)
    {
        Close("확인");
    }

    #endregion
    #region 취소 버튼 클릭시 처리하기 - cancelButton_Clicked(sender, e)

    /// <summary>
    /// 취소 버튼 클릭시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void cancelButton_Clicked(object sender, EventArgs e)
    {
        Close("취소");
    }

    #endregion
}

using CommunityToolkit.Maui.Views;

namespace TestProject;

/// <summary>

/// 커스텀 팝업

/// </summary>

public partial class CustomPopup : Popup

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - CustomPopup()

/// <summary>

/// 생성자

/// </summary>

public CustomPopup()

{

InitializeComponent();

ResultWhenUserTapsOutsideOfPopup = "외부";

this.okButton.Clicked += okButton_Clicked;

this.cancelButton.Clicked += cancelButton_Clicked;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 확인 버튼 클릭시 처리하기 - okButton_Clicked(sender, e)

/// <summary>

/// 확인 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void okButton_Clicked(object sender, EventArgs e)

{

Close("확인");

}

#endregion

#region 취소 버튼 클릭시 처리하기 - cancelButton_Clicked(sender, e)

/// <summary>

/// 취소 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void cancelButton_Clicked(object sender, EventArgs e)

{

Close("취소");

}

#endregion

}

▶ MauiProgram.cs


using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseMauiCommunityToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/COMMUNITY TOOLKIT/.NET6] DrawingView 클래스 : DrawingLine 객체를 생성해 선 추가하기

■ DrawingView 클래스를 사용해 DrawingLine 객체를 생성해 선을 추가하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    <Grid
        Margin="10"
        RowDefinitions="*,10,Auto">
        <toolkit:DrawingView x:Name="drawingView" Grid.Row="0"
            Margin="10"
            Background="Beige"
            IsMultiLineModeEnabled="true"
            ShouldClearOnFinish="false"
            LineWidth="5"
            LineColor="Blue" />
        <Button x:Name="addButton" Grid.Row="2"
            Margin="10"
            Text="선 추가하기" />
    </Grid>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">

<Grid

Margin="10"

RowDefinitions="*,10,Auto">

<toolkit:DrawingView x:Name="drawingView" Grid.Row="0"

Margin="10"

Background="Beige"

IsMultiLineModeEnabled="true"

ShouldClearOnFinish="false"

LineWidth="5"

LineColor="Blue" />

<Button x:Name="addButton" Grid.Row="2"

Margin="10"

Text="선 추가하기" />

</Grid>

</ContentPage>

▶ MainPage.xaml.cs


using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;
using CommunityToolkit.Maui.Core.Views;

namespace TestProject;

/// <summary>
/// 메인 페이지
/// </summary>
public partial class MainPage : ContentPage
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Field
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region Field

    /// <summary>
    /// 선 컬렉션
    /// </summary>
    private ObservableCollection<IDrawingLine> lineCollection = new ObservableCollection<IDrawingLine>();

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainPage()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainPage()
    {
        InitializeComponent();

        this.drawingView.Lines = this.lineCollection;

        this.addButton.Clicked += addButton_Clicked;
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private
    //////////////////////////////////////////////////////////////////////////////// Event

    #region 선 추가하기 버튼 클릭시 처리하기 - addButton_Clicked(sender, e)

    /// <summary>
    /// 선 추가하기 버튼 클릭시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private void addButton_Clicked(object sender, EventArgs e)
    {
        double viewWidth  = double.IsNaN(this.drawingView.Width ) || this.drawingView.Width  <= 1 ? 200 : this.drawingView.Width;
        double viewHeight = double.IsNaN(this.drawingView.Height) || this.drawingView.Height <= 1 ? 200 : this.drawingView.Height;

        this.lineCollection.Add
        (
            new DrawingLine()
            {
                Granularity               = 5,
                ShouldSmoothPathWhenDrawn = true,
                LineWidth                 = 10,
                LineColor                 = Color.FromRgb(Random.Shared.Next(255), Random.Shared.Next(255), Random.Shared.Next(255)),
                Points                    = new(GetPointEnumerable(10, viewWidth, viewHeight))
            }
        );
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////// Function

    #region 포인트 열거 가능형 구하기 - GetPointEnumerable(pointCount, viewWidth, viewHeight)

    /// <summary>
    /// 포인트 열거 가능형 구하기
    /// </summary>
    /// <param name="pointCount">포인트 수</param>
    /// <param name="viewWidth">뷰 너비</param>
    /// <param name="viewHeight">뷰 높이</param>
    /// <returns>포인트 열거 가능형</returns>
    private IEnumerable<PointF> GetPointEnumerable(int pointCount, double viewWidth, double viewHeight)
    {
        double paddedViewWidth  = Math.Clamp(viewWidth  - 10, 1, viewWidth );
        double paddedViewHeight = Math.Clamp(viewHeight - 10, 1, viewHeight);

        int maximumWidth  = (int)Math.Round(paddedViewWidth , MidpointRounding.AwayFromZero);
        int maximumHeight = (int)Math.Round(paddedViewHeight, MidpointRounding.AwayFromZero);

        for(int i = 0; i < pointCount; i++)
        {
            yield return new PointF(Random.Shared.Next(1, maximumWidth), Random.Shared.Next(1, maximumHeight));
        }
    }

    #endregion
}

100

101

102

103

using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;

using CommunityToolkit.Maui.Core.Views;

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public partial class MainPage : ContentPage

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Field

////////////////////////////////////////////////////////////////////////////////////////// Private

#region Field

/// <summary>

/// 선 컬렉션

/// </summary>

private ObservableCollection<IDrawingLine> lineCollection = new ObservableCollection<IDrawingLine>();

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

this.drawingView.Lines = this.lineCollection;

this.addButton.Clicked += addButton_Clicked;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

//////////////////////////////////////////////////////////////////////////////// Event

#region 선 추가하기 버튼 클릭시 처리하기 - addButton_Clicked(sender, e)

/// <summary>

/// 선 추가하기 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private void addButton_Clicked(object sender, EventArgs e)

{

double viewWidth = double.IsNaN(this.drawingView.Width ) || this.drawingView.Width <= 1 ? 200 : this.drawingView.Width;

double viewHeight = double.IsNaN(this.drawingView.Height) || this.drawingView.Height <= 1 ? 200 : this.drawingView.Height;

this.lineCollection.Add

(

new DrawingLine()

{

Granularity = 5,

ShouldSmoothPathWhenDrawn = true,

LineWidth = 10,

LineColor = Color.FromRgb(Random.Shared.Next(255), Random.Shared.Next(255), Random.Shared.Next(255)),

Points = new(GetPointEnumerable(10, viewWidth, viewHeight))

}

);

}

#endregion

//////////////////////////////////////////////////////////////////////////////// Function

#region 포인트 열거 가능형 구하기 - GetPointEnumerable(pointCount, viewWidth, viewHeight)

/// <summary>

/// 포인트 열거 가능형 구하기

/// </summary>

/// <param name="pointCount">포인트 수</param>

/// <param name="viewWidth">뷰 너비</param>

/// <param name="viewHeight">뷰 높이</param>

/// <returns>포인트 열거 가능형</returns>

private IEnumerable<PointF> GetPointEnumerable(int pointCount, double viewWidth, double viewHeight)

{

double paddedViewWidth = Math.Clamp(viewWidth - 10, 1, viewWidth );

double paddedViewHeight = Math.Clamp(viewHeight - 10, 1, viewHeight);

int maximumWidth = (int)Math.Round(paddedViewWidth , MidpointRounding.AwayFromZero);

int maximumHeight = (int)Math.Round(paddedViewHeight, MidpointRounding.AwayFromZero);

for(int i = 0; i < pointCount; i++)

{

yield return new PointF(Random.Shared.Next(1, maximumWidth), Random.Shared.Next(1, maximumHeight));

}

#endregion

}

▶ MauiProgram.cs


using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseMauiCommunityToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/COMMUNITY TOOLKIT/.NET6] DrawingView 클래스 : GetImageStream 메소드를 사용해 이미지 구하기

■ DrawingView 클래스의 GetImageStream 메소드를 사용해 이미지를 구하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    <Grid
        Margin="10"
        RowDefinitions="*,Auto,*">
        <toolkit:DrawingView x:Name="drawingView" Grid.Row="0"
            Margin="10"
            Background="Beige"
            IsMultiLineModeEnabled="true"
            ShouldClearOnFinish="false"
            LineWidth="5"
            LineColor="Blue" />
        <Button x:Name="captureButton" Grid.Row="1"
            Margin="10"
            Text="이미지 캡처" />
        <Image x:Name="image" Grid.Row="2" />
    </Grid>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">

<Grid

Margin="10"

RowDefinitions="*,Auto,*">

<toolkit:DrawingView x:Name="drawingView" Grid.Row="0"

Margin="10"

Background="Beige"

IsMultiLineModeEnabled="true"

ShouldClearOnFinish="false"

LineWidth="5"

LineColor="Blue" />

<Button x:Name="captureButton" Grid.Row="1"

Margin="10"

Text="이미지 캡처" />

</Grid>

</ContentPage>

▶ MainPage.xaml.cs


using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;

namespace TestProject;

/// <summary>
/// 메인 페이지
/// </summary>
public partial class MainPage : ContentPage
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainPage()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainPage()
    {
        InitializeComponent();

        this.drawingView.Lines = new ObservableCollection<IDrawingLine>();

        this.captureButton.Clicked += captureButton_Clicked;
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region 이미지 캡처 버튼 클릭시 처리하기 - captureButton_Clicked(sender, e)

    /// <summary>
    /// 이미지 캡처 버튼 클릭시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private async void captureButton_Clicked(object sender, EventArgs e)
    {
        Stream stream = await drawingView.GetImageStream(this.image.Width, this.image.Height);

        this.image.Source = ImageSource.FromStream(() => stream);
    }

    #endregion
}

using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public partial class MainPage : ContentPage

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

this.drawingView.Lines = new ObservableCollection<IDrawingLine>();

this.captureButton.Clicked += captureButton_Clicked;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 이미지 캡처 버튼 클릭시 처리하기 - captureButton_Clicked(sender, e)

/// <summary>

/// 이미지 캡처 버튼 클릭시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private async void captureButton_Clicked(object sender, EventArgs e)

{

Stream stream = await drawingView.GetImageStream(this.image.Width, this.image.Height);

this.image.Source = ImageSource.FromStream(() => stream);

}

#endregion

}

▶ MauiProgram.cs


using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseMauiCommunityToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/COMMUNITY TOOLKIT/.NET6] DrawingView 클래스 : DrawingLineCompleted 이벤트를 사용해 선 그리기 완료시 처리하기

■ DrawingView 클래스의 DrawingLineCompleted 이벤트를 사용해 선 그리기 완료시 처리하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
    <Grid
        Margin="10"
        RowDefinitions="*,10,*">
        <toolkit:DrawingView x:Name="drawingView" Grid.Row="0"
            Margin="10"
            Background="Beige"
            IsMultiLineModeEnabled="true"
            ShouldClearOnFinish="false"
            LineWidth="5"
            LineColor="Blue" />
        <Image x:Name="image" Grid.Row="2" />
    </Grid>
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">

<Grid

Margin="10"

RowDefinitions="*,10,*">

<toolkit:DrawingView x:Name="drawingView" Grid.Row="0"

Margin="10"

Background="Beige"

IsMultiLineModeEnabled="true"

ShouldClearOnFinish="false"

LineWidth="5"

LineColor="Blue" />

</Grid>

</ContentPage>

▶ MainPage.xaml.cs


using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;

namespace TestProject;

/// <summary>
/// 메인 페이지
/// </summary>
public partial class MainPage : ContentPage
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainPage()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainPage()
    {
        InitializeComponent();

        this.drawingView.Lines = new ObservableCollection<IDrawingLine>();

        this.drawingView.DrawingLineCompleted += drawingView_DrawingLineCompleted;
    }

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region 드로잉 뷰 선 그리기 완료시 처리하기 - drawingView_DrawingLineCompleted(sender, e)

    /// <summary>
    /// 드로잉 뷰 선 그리기 완료시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private async void drawingView_DrawingLineCompleted(object sender, DrawingLineCompletedEventArgs e)
    {
        Stream stream = await e.LastDrawingLine.GetImageStream(this.image.Width, this.image.Height, Colors.Gray.AsPaint());

        this.image.Source = ImageSource.FromStream(() => stream);
    }

    #endregion
}

using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public partial class MainPage : ContentPage

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

this.drawingView.Lines = new ObservableCollection<IDrawingLine>();

this.drawingView.DrawingLineCompleted += drawingView_DrawingLineCompleted;

}

#endregion

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Private

#region 드로잉 뷰 선 그리기 완료시 처리하기 - drawingView_DrawingLineCompleted(sender, e)

/// <summary>

/// 드로잉 뷰 선 그리기 완료시 처리하기

/// </summary>

/// <param name="sender">이벤트 발생자</param>

/// <param name="e">이벤트 인자</param>

private async void drawingView_DrawingLineCompleted(object sender, DrawingLineCompletedEventArgs e)

{

Stream stream = await e.LastDrawingLine.GetImageStream(this.image.Width, this.image.Height, Colors.Gray.AsPaint());

this.image.Source = ImageSource.FromStream(() => stream);

}

#endregion

}

▶ MauiProgram.cs


using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseMauiCommunityToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/COMMUNITY TOOLKIT/.NET6] DrawingView 클래스 : IsMultiLineModeEnabled/ShouldClearOnFinish 속성을 사용해 2개 이상의 선 그리기

■ DrawingView 클래스의 IsMultiLineModeEnabled/ShouldClearOnFinish 속성을 사용해 2개 이상의 선을 그리는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

</ContentPage>

▶ MainPage.xaml.cs


using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;
using CommunityToolkit.Maui.Views;

namespace TestProject;

/// <summary>
/// 메인 페이지
/// </summary>
public partial class MainPage : ContentPage
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainPage()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainPage()
    {
        InitializeComponent();

        DrawingView drawingView = new DrawingView();

        drawingView.Margin                 = new Thickness(10);
        drawingView.BackgroundColor        = Colors.Beige;
        drawingView.IsMultiLineModeEnabled = true;
        drawingView.ShouldClearOnFinish    = false;
        drawingView.LineWidth              = 5;
        drawingView.LineColor              = Colors.Blue;
        drawingView.Lines                  = new ObservableCollection<IDrawingLine>();

        Content = drawingView;
    }

    #endregion
}

using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;

using CommunityToolkit.Maui.Views;

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public partial class MainPage : ContentPage

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

DrawingView drawingView = new DrawingView();

drawingView.Margin = new Thickness(10);

drawingView.BackgroundColor = Colors.Beige;

drawingView.IsMultiLineModeEnabled = true;

drawingView.ShouldClearOnFinish = false;

drawingView.LineWidth = 5;

drawingView.LineColor = Colors.Blue;

drawingView.Lines = new ObservableCollection<IDrawingLine>();

Content = drawingView;

}

#endregion

}

▶ MauiProgram.cs


using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseMauiCommunityToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/COMMUNITY TOOLKIT/.NET6] DrawingView 엘리먼트 : IsMultiLineModeEnabled/ShouldClearOnFinish 속성을 사용해 2개 이상의 선 그리기

■ DrawingView 엘리먼트의 IsMultiLineModeEnabled/ShouldClearOnFinish 속성을 사용해 2개 이상의 선을 그리는 방법을 보여준다. ▶ LineCollection.cs


using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;

namespace TestProject;

/// <summary>
/// 라인 컬렉션
/// </summary>
public class LineCollection : ObservableCollection<IDrawingLine>
{
}

using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;

namespace TestProject;

/// <summary>

/// 라인 컬렉션

/// </summary>

public class LineCollection : ObservableCollection<IDrawingLine>

{

}

▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
    xmlns:local="clr-namespace:TestProject">
    <ContentPage.Resources>
        <local:LineCollection x:Key="LineCollectionKey" />
    </ContentPage.Resources>
    <toolkit:DrawingView
        Margin="10"
        Background="Beige"
        IsMultiLineModeEnabled="true"
        ShouldClearOnFinish="false"
        LineWidth="5"
        LineColor="Blue"
        Lines="{StaticResource LineCollectionKey}" />
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"

xmlns:local="clr-namespace:TestProject">

<ContentPage.Resources>

<local:LineCollection x:Key="LineCollectionKey" />

</ContentPage.Resources>

<toolkit:DrawingView

Margin="10"

Background="Beige"

IsMultiLineModeEnabled="true"

ShouldClearOnFinish="false"

LineWidth="5"

LineColor="Blue"

Lines="{StaticResource LineCollectionKey}" />

</ContentPage>

▶ MauiProgram.cs


using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseMauiCommunityToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip

[C#/MAUI/COMMUNITY TOOLKIT/.NET6] DrawingView 클래스 : LineWidth/LineColor/Lines 속성 사용하기

■ DrawingView 클래스의 LineWidth/LineColor/Lines 속성을 사용하는 방법을 보여준다. ▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
</ContentPage>

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

<ContentPage x:Class="TestProject.MainPage"

xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

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

</ContentPage>

▶ MainPage.xaml.cs


using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;
using CommunityToolkit.Maui.Views;

namespace TestProject;

/// <summary>
/// 메인 페이지
/// </summary>
public partial class MainPage : ContentPage
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - MainPage()

    /// <summary>
    /// 생성자
    /// </summary>
    public MainPage()
    {
        InitializeComponent();

        DrawingView drawingView = new DrawingView();

        drawingView.Margin          = new Thickness(10);
        drawingView.BackgroundColor = Colors.Beige;
        drawingView.LineWidth       = 5;
        drawingView.LineColor       = Colors.Blue;
        drawingView.Lines           = new ObservableCollection<IDrawingLine>();

        Content = drawingView;
    }

    #endregion
}

using System.Collections.ObjectModel;

using CommunityToolkit.Maui.Core;

using CommunityToolkit.Maui.Views;

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public partial class MainPage : ContentPage

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

DrawingView drawingView = new DrawingView();

drawingView.Margin = new Thickness(10);

drawingView.BackgroundColor = Colors.Beige;

drawingView.LineWidth = 5;

drawingView.LineColor = Colors.Blue;

drawingView.Lines = new ObservableCollection<IDrawingLine>();

Content = drawingView;

}

#endregion

}

▶ MauiProgram.cs


using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>
/// MAUI 프로그램
/// </summary>
public static class MauiProgram
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Static
    //////////////////////////////////////////////////////////////////////////////// Public

    #region MAUI 앱 생성하기 - CreateMauiApp()

    /// <summary>
    /// MAUI 앱 생성하기
    /// </summary>
    /// <returns>MAUI 앱</returns>
    public static MauiApp CreateMauiApp()
    {
        MauiAppBuilder builder = MauiApp.CreateBuilder();

        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts
            (
                fontCollection =>
                {
                    fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );
                    fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                }
            );

        return builder.Build();
    }

    #endregion
}

using CommunityToolkit.Maui;

namespace TestProject;

/// <summary>

/// MAUI 프로그램

/// </summary>

public static class MauiProgram

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Method

////////////////////////////////////////////////////////////////////////////////////////// Static

//////////////////////////////////////////////////////////////////////////////// Public

#region MAUI 앱 생성하기 - CreateMauiApp()

/// <summary>

/// MAUI 앱 생성하기

/// </summary>

/// <returns>MAUI 앱</returns>

public static MauiApp CreateMauiApp()

{

MauiAppBuilder builder = MauiApp.CreateBuilder();

builder

.UseMauiApp<App>()

.UseMauiCommunityToolkit()

.ConfigureFonts

(

fontCollection =>

{

fontCollection.AddFont("OpenSans-Regular.ttf" , "OpenSansRegular" );

fontCollection.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");

}

);

return builder.Build();

}

#endregion

}

TestProject.zip