NAVIGATION Archives - icodebroker

[C#/WINUI3/.NET8] Hyperlink 엘리먼트 : NavigateUri 속성을 사용해 웹 사이트 호출하기

■ Hyperlink 엘리먼트의 NavigateUri 속성을 사용해 웹 사이트를 호출하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType

[C#/WINUI3/.NET8] KeyboardAccelerator 클래스 : Invoked 이벤트를 사용해 단축키를 누르는 경우 페이지 뒤로 가기/앞으로 가기

■ KeyboardAccelerator 클래스의 Invoked 이벤트를 사용해 단축키를 누르는 경우 페이지 뒤로 가거나 앞으로 가는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다.

[C#/WINUI3/.NET8] Button 엘리먼트 : Click 이벤트를 사용해 BACK 버튼 클릭시 뒤로 가기

■ Button 엘리먼트의 Click 이벤트를 사용해 BACK 버튼 클릭시 뒤로 가는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트

[C#/WINUI3/.NET8] Button 엘리먼트 : Style/IsEnabled 속성을 사용해 페이지에서 BACK 버튼 만들기

■ Button 엘리먼트의 Style/IsEnabled 속성을 사용해 페이지에서 BACK 버튼을 만드는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서

[C#/WINUI3/.NET8] SlideNavigationTransitionInfo 클래스 : Effect 속성을 사용해 페이지 전환시 슬라이드 애니메이션 만들기

■ SlideNavigationTransitionInfo 클래스의 Effect 속성을 사용해 페이지 전환시 슬라이드 애니메이션을 만드는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트

[C#/WINUI3/.NET8] Page 엘리먼트 : NavigationCacheMode 속성을 사용해 페이지 캐시 설정하기

■ Page 엘리먼트의 NavigationCacheMode 속성을 사용해 페이지 캐시를 설정하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType

[C#/WINUI3/.NET8] Frame 클래스 : Navigate 메소드 사용시 인자 전달하기

■ Frame 클래스의 Navigate 메소드 사용시 인자를 전달하는 방법을 보여준다. ※ 비주얼 스튜디오에서 TestProject(Unpackaged) 모드로 빌드한다. ※ TestProject.csproj 프로젝트 파일에서 WindowsPackageType 태그를

[C#/WPF] Frame 클래스 : Navigated 이벤트를 사용해 스크립트 오류 억제하기

■ Frame 클래스의 Navigated 이벤트를 사용해 웹 사이트 조회시 발생하는 스크립트 오류를 억제하는 방법을 보여준다. ▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="TestProject"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Frame Name="frame"
        Margin="10"
        BorderThickness="1"
        BorderBrush="Black"
        NavigationUIVisibility="Hidden" />
</Window>

<Window x:Class="TestProject.MainWindow"

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

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

Width="800"

Height="600"

Title="TestProject"

FontFamily="나눔고딕코딩"

FontSize="16">

<Frame Name="frame"

Margin="10"

BorderThickness="1"

BorderBrush="Black"

NavigationUIVisibility="Hidden" />

</Window>

▶ MainWindow.xaml.cs


using System;
using System.Net;
using System.Reflection;
using System.Windows;
using System.Windows.Navigation;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

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

            ServicePointManager.Expect100Continue = true;
            ServicePointManager.SecurityProtocol  = SecurityProtocolType.Ssl3 | SecurityProtocolType.Tls | SecurityProtocolType.Tls11 | SecurityProtocolType.Tls12;

            ServicePointManager.ServerCertificateValidationCallback = delegate { return true; };

            Loaded               += Window_Loaded;
            this.frame.Navigated += frame_Navigated;
        }

        #endregion

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

        #region 윈도우 로드시 처리하기 - Window_Loaded(sender, e)

        /// <summary>
        /// 윈도우 로드시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            this.frame.Source = new Uri("https://www.daum.net");
        }

        #endregion
        #region 프레임 이동 완료시 처리하기 - frame_Navigated(sender, e)

        /// <summary>
        /// 프레임 이동 완료시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void frame_Navigated(object sender, NavigationEventArgs e)
        {
            NavigationService navigationService = this.frame.NavigationService;

            dynamic browser = navigationService.GetType().GetField("_webBrowser", BindingFlags.NonPublic | BindingFlags.Instance).GetValue(navigationService);

            dynamic iWebBrowser2 = browser.GetType().GetField("_axIWebBrowser2", BindingFlags.NonPublic | BindingFlags.Instance).GetValue(browser);

            iWebBrowser2.Silent = true;
        }

        #endregion
    }
}

using System;

using System.Net;

using System.Reflection;

using System.Windows;

using System.Windows.Navigation;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

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

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

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

ServicePointManager.Expect100Continue = true;

ServicePointManager.SecurityProtocol = SecurityProtocolType.Ssl3 | SecurityProtocolType.Tls | SecurityProtocolType.Tls11 | SecurityProtocolType.Tls12;

ServicePointManager.ServerCertificateValidationCallback = delegate { return true; };

Loaded += Window_Loaded;

this.frame.Navigated += frame_Navigated;

}

#endregion

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

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

#region 윈도우 로드시 처리하기 - Window_Loaded(sender, e)

/// <summary>

/// 윈도우 로드시 처리하기

/// </summary>

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

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

private void Window_Loaded(object sender, RoutedEventArgs e)

{

this.frame.Source = new Uri("https://www.daum.net");

}

#endregion

#region 프레임 이동 완료시 처리하기 - frame_Navigated(sender, e)

/// <summary>

/// 프레임 이동 완료시 처리하기

/// </summary>

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

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

private void frame_Navigated(object sender, NavigationEventArgs e)

{

NavigationService navigationService = this.frame.NavigationService;

dynamic browser = navigationService.GetType().GetField("_webBrowser", BindingFlags.NonPublic | BindingFlags.Instance).GetValue(navigationService);

dynamic iWebBrowser2 = browser.GetType().GetField("_axIWebBrowser2", BindingFlags.NonPublic | BindingFlags.Instance).GetValue(browser);

iWebBrowser2.Silent = true;

}

#endregion

}

TestProject.zip

[C#/WPF] Hyperlink 클래스 : MouseEnter/MouseLeave 이벤트를 사용해 마우스 진입시 밑줄 표시하기

■ Hyperlink 클래스의 MouseEnter/MouseLeave 이벤트를 사용해 마우스 진입시 밑줄를 표시하는 방법을 보여준다. ▶ MainWindow.xaml


<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="TestProject"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <TextBlock
        HorizontalAlignment="Center"
        VerticalAlignment="Center">
        <Hyperlink NavigateUri="https://icodebroker.tistory.com">
            icodebroker
        </Hyperlink>
        <Run Text=" | " />
        <Hyperlink Name="hyperlink"
            TextDecorations="None"
            NavigateUri="https://icodebroker.tistory.com">
            icodebroker
        </Hyperlink>
    </TextBlock>
</Window>

<Window x:Class="TestProject.MainWindow"

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

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

Width="800"

Height="600"

Title="TestProject"

FontFamily="나눔고딕코딩"

FontSize="16">

<TextBlock

HorizontalAlignment="Center"

VerticalAlignment="Center">

icodebroker

</Hyperlink>

<Hyperlink Name="hyperlink"

TextDecorations="None"

NavigateUri="https://icodebroker.tistory.com">

icodebroker

</Hyperlink>

</TextBlock>

</Window>

▶ MainWindow.xaml.cs


using System;
using System.Windows;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

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

            this.hyperlink.MouseEnter += hyperlink_MouseEnter;
            this.hyperlink.MouseLeave += hyperlink_MouseLeave;
        }

        #endregion

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

        #region 하이퍼링크 마우스 진입시 처리하기 - hyperlink_MouseEnter(sender, e)

        /// <summary>
        /// 하이퍼링크 마우스 진입시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void hyperlink_MouseEnter(object sender, EventArgs e)
        {
            this.hyperlink.TextDecorations = TextDecorations.Underline;
        }

        #endregion
        #region 하이퍼링크 마우스 이탈시 처리하기 - hyperlink_MouseLeave(sender, e)

        /// <summary>
        /// 하이퍼링크 마우스 이탈시 처리하기
        /// </summary>
        /// <param name="sender">이벤트 발생자</param>
        /// <param name="e">이벤트 인자</param>
        private void hyperlink_MouseLeave(object sender, EventArgs e)
        {
            this.hyperlink.TextDecorations = null;
        }

        #endregion
    }
}

using System;

using System.Windows;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

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

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

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

this.hyperlink.MouseEnter += hyperlink_MouseEnter;

this.hyperlink.MouseLeave += hyperlink_MouseLeave;

}

#endregion

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

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

#region 하이퍼링크 마우스 진입시 처리하기 - hyperlink_MouseEnter(sender, e)

/// <summary>

/// 하이퍼링크 마우스 진입시 처리하기

/// </summary>

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

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

private void hyperlink_MouseEnter(object sender, EventArgs e)

{

this.hyperlink.TextDecorations = TextDecorations.Underline;

}

#endregion

#region 하이퍼링크 마우스 이탈시 처리하기 - hyperlink_MouseLeave(sender, e)

/// <summary>

/// 하이퍼링크 마우스 이탈시 처리하기

/// </summary>

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

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

private void hyperlink_MouseLeave(object sender, EventArgs e)

{

this.hyperlink.TextDecorations = null;

}

#endregion

}

TestProject.zip

[C#/MAUI/.NET6] Shell 엘리먼트 : 태양 일출/일몰 및 달 위상 정보 조회하기

■ Shell 엘리먼트를 사용해 태양 일출/일몰 및 달 위상 정보를 조회하는 방법을 보여준다. ▶ 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.ACCESS_COARSE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"   />
</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.ACCESS_COARSE_LOCATION" />

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

</manifest>

▶ Platforms/iOS/info.plist


<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
    <dict>
        <key>LSRequiresIPhoneOS</key>
        <true/>
        <key>UIDeviceFamily</key>
        <array>
            <integer>1</integer>
            <integer>2</integer>
        </array>
        <key>UIRequiredDeviceCapabilities</key>
        <array>
            <string>arm64</string>
        </array>
        <key>UISupportedInterfaceOrientations</key>
        <array>
            <string>UIInterfaceOrientationPortrait</string>
            <string>UIInterfaceOrientationLandscapeLeft</string>
            <string>UIInterfaceOrientationLandscapeRight</string>
        </array>
        <key>UISupportedInterfaceOrientations~ipad</key>
        <array>
            <string>UIInterfaceOrientationPortrait</string>
            <string>UIInterfaceOrientationPortraitUpsideDown</string>
            <string>UIInterfaceOrientationLandscapeLeft</string>
            <string>UIInterfaceOrientationLandscapeRight</string>
        </array>
        <key>XSAppIconAssets</key>
        <string>Assets.xcassets/appicon.appiconset</string>
        <key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
        <string>Need the location to display sunrise and sunset times</string>
    </dict>
</plist>

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

<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">

<dict>

<key>LSRequiresIPhoneOS</key>

<true/>

<key>UIDeviceFamily</key>

<array>

</array>

<key>UIRequiredDeviceCapabilities</key>

<array>

</array>

<key>UISupportedInterfaceOrientations</key>

<array>

<string>UIInterfaceOrientationPortrait</string>

<string>UIInterfaceOrientationLandscapeLeft</string>

<string>UIInterfaceOrientationLandscapeRight</string>

</array>

<key>UISupportedInterfaceOrientations~ipad</key>

<array>

<string>UIInterfaceOrientationPortrait</string>

<string>UIInterfaceOrientationPortraitUpsideDown</string>

<string>UIInterfaceOrientationLandscapeLeft</string>

<string>UIInterfaceOrientationLandscapeRight</string>

</array>

<key>XSAppIconAssets</key>

<string>Assets.xcassets/appicon.appiconset</string>

<key>NSLocationAlwaysAndWhenInUseUsageDescription</key>

<string>Need the location to display sunrise and sunset times</string>

</dict>

</plist>

▶ Platforms/MacCatalyst/info.plist


<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
    <dict>
        <key>UIDeviceFamily</key>
        <array>
            <integer>1</integer>
            <integer>2</integer>
        </array>
        <key>UIRequiredDeviceCapabilities</key>
        <array>
            <string>arm64</string>
        </array>
        <key>UISupportedInterfaceOrientations</key>
        <array>
            <string>UIInterfaceOrientationPortrait</string>
            <string>UIInterfaceOrientationLandscapeLeft</string>
            <string>UIInterfaceOrientationLandscapeRight</string>
        </array>
        <key>UISupportedInterfaceOrientations~ipad</key>
        <array>
            <string>UIInterfaceOrientationPortrait</string>
            <string>UIInterfaceOrientationPortraitUpsideDown</string>
            <string>UIInterfaceOrientationLandscapeLeft</string>
            <string>UIInterfaceOrientationLandscapeRight</string>
        </array>
        <key>XSAppIconAssets</key>
        <string>Assets.xcassets/appicon.appiconset</string>
        <key>NSLocationUsageDescription</key>
        <string>Need location to display sunrise and sunset info</string>
    </dict>
</plist>

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

<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">

<dict>

<key>UIDeviceFamily</key>

<array>

</array>

<key>UIRequiredDeviceCapabilities</key>

<array>

</array>

<key>UISupportedInterfaceOrientations</key>

<array>

<string>UIInterfaceOrientationPortrait</string>

<string>UIInterfaceOrientationLandscapeLeft</string>

<string>UIInterfaceOrientationLandscapeRight</string>

</array>

<key>UISupportedInterfaceOrientations~ipad</key>

<array>

<string>UIInterfaceOrientationPortrait</string>

<string>UIInterfaceOrientationPortraitUpsideDown</string>

<string>UIInterfaceOrientationLandscapeLeft</string>

<string>UIInterfaceOrientationLandscapeRight</string>

</array>

<key>XSAppIconAssets</key>

<string>Assets.xcassets/appicon.appiconset</string>

<key>NSLocationUsageDescription</key>

<string>Need location to display sunrise and sunset info</string>

</dict>

</plist>

[C#/MAUI/.NET6] ContentPage 클래스 : Navigation 속성을 사용해 모달 페이지 이동하기

■ ContentPage 클래스의 Navigation 속성을 사용해 모달 페이지로 이동하는 방법을 보여준다. ▶ 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"
    Title="메인 페이지"
    BackgroundColor="White">
    <Button x:Name="navigateButton"
        HorizontalOptions="Center"
        VerticalOptions="Center"
        Text="모달 페이지 이동" />
</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"

Title="메인 페이지"

BackgroundColor="White">

<Button x:Name="navigateButton"

HorizontalOptions="Center"

VerticalOptions="Center"

Text="모달 페이지 이동" />

</ContentPage>

▶ MainPage.xaml.cs


namespace TestProject;

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

    #region 생성자 - MainPage()

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

        this.navigateButton.Clicked += navigateButton_Clicked;
	}

    #endregion

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

    #region 두번째 페이지 이동 버튼 클릭시 처리하기 - navigateButton_Clicked(sender, e)

    /// <summary>
    /// 두번째 페이지 이동 버튼 클릭시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private async void navigateButton_Clicked(object sender, EventArgs e)
    {
        await Navigation.PushModalAsync(new ModalPage());
    }

    #endregion
}

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public partial class MainPage : ContentPage

{

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

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

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

this.navigateButton.Clicked += navigateButton_Clicked;

}

#endregion

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

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

#region 두번째 페이지 이동 버튼 클릭시 처리하기 - navigateButton_Clicked(sender, e)

/// <summary>

/// 두번째 페이지 이동 버튼 클릭시 처리하기

/// </summary>

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

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

private async void navigateButton_Clicked(object sender, EventArgs e)

{

await Navigation.PushModalAsync(new ModalPage());

}

#endregion

}

▶ ModalPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.ModalPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    Title="모달 페이지"
    BackgroundColor="White">
    <Button x:Name="navigateButton"
        HorizontalOptions="Center"
        VerticalOptions="Center"
        Text="메인 페이지 이동" />
</ContentPage>

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

<ContentPage x:Class="TestProject.ModalPage"

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

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

Title="모달 페이지"

BackgroundColor="White">

<Button x:Name="navigateButton"

HorizontalOptions="Center"

VerticalOptions="Center"

Text="메인 페이지 이동" />

</ContentPage>

▶ ModalPage.xaml.cs

[C#/MAUI/.NET6] Shell 엘리먼트 : FlyoutFooterTemplate 속성을 사용해 플라이아웃 바닥글 설정하기

■ Shell 엘리먼트의 FlyoutFooterTemplate 속성을 사용해 플라이아웃 바닥글을 설정하는 방법을 보여준다. ▶ AppShell.xaml


<?xml version="1.0" encoding="utf-8" ?>
<Shell x:Class="TestProject.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:sys="clr-namespace:System;assembly=netstandard"
    xmlns:local="clr-namespace:TestProject">
    <Shell.FlyoutFooterTemplate>
        <DataTemplate>
            <Grid BackgroundColor="Black">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Label Grid.Row="0"
                    HorizontalOptions="Center"
                    FontAttributes="Bold"
                    TextColor="White"
                    Text="TestProject" />
                <Label Grid.Row="1"
                    HorizontalOptions="Center"
                    TextColor="White"
                    Text="{Binding Source={x:Static sys:DateTime.Now}, StringFormat='{0:yyyy-MM-dd HH:mm:ss}'}" />
            </Grid>
        </DataTemplate>
    </Shell.FlyoutFooterTemplate>
    <FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
        <Tab
            Icon="sample1.png"
            Title="고양이/개">
            <ShellContent
                Icon="sample2.png"
                Title="고양이"
                ContentTemplate="{DataTemplate local:CatPage}" />
            <ShellContent
                Icon="sample3.png"
                Title="개"
                ContentTemplate="{DataTemplate local:DogPage}" />
        </Tab>
        <ShellContent
            Icon="sample1.png"
            Title="원숭이"
            ContentTemplate="{DataTemplate local:MonkeyPage}" />
        <ShellContent
            Icon="sample2.png"
            Title="코끼리"
            ContentTemplate="{DataTemplate local:ElephantPage}" />
        <ShellContent
            Icon="sample3.png"
            Title="곰"
            ContentTemplate="{DataTemplate local:BearPage}" />
    </FlyoutItem>
    <ShellContent
        Icon="sample1.png"
        Title="정보"
        ContentTemplate="{DataTemplate local:AboutPage}" />
    <MenuItem x:Name="helpMenuItem"
        Text="도움말"
        IconImageSource="sample2.png" />
</Shell>

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

<Shell x:Class="TestProject.AppShell"

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

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

xmlns:sys="clr-namespace:System;assembly=netstandard"

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

<Shell.FlyoutFooterTemplate>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Label Grid.Row="0"

HorizontalOptions="Center"

FontAttributes="Bold"

TextColor="White"

Text="TestProject" />

<Label Grid.Row="1"

HorizontalOptions="Center"

TextColor="White"

Text="{Binding Source={x:Static sys:DateTime.Now}, StringFormat='{0:yyyy-MM-dd HH:mm:ss}'}" />

</Grid>

</DataTemplate>

</Shell.FlyoutFooterTemplate>

<Tab

Icon="sample1.png"

Title="고양이/개">

<ShellContent

Icon="sample2.png"

Title="고양이"

ContentTemplate="{DataTemplate local:CatPage}" />

<ShellContent

Icon="sample3.png"

Title="개"

ContentTemplate="{DataTemplate local:DogPage}" />

</Tab>

<ShellContent

Icon="sample1.png"

Title="원숭이"

ContentTemplate="{DataTemplate local:MonkeyPage}" />

<ShellContent

Icon="sample2.png"

Title="코끼리"

ContentTemplate="{DataTemplate local:ElephantPage}" />

<ShellContent

Icon="sample3.png"

Title="곰"

ContentTemplate="{DataTemplate local:BearPage}" />

</FlyoutItem>

<ShellContent

Icon="sample1.png"

Title="정보"

ContentTemplate="{DataTemplate local:AboutPage}" />

<MenuItem x:Name="helpMenuItem"

Text="도움말"

IconImageSource="sample2.png" />

</Shell>

TestProject.zip

[C#/MAUI/.NET6] Shell 엘리먼트 : FlyoutHeaderTemplate 속성을 사용해 플라이아웃 헤더 설정하기

■ Shell 엘리먼트의 FlyoutHeaderTemplate 속성을 사용해 플라이아웃 헤더를 설정하는 방법을 보여준다. ▶ AppShell.xaml


<?xml version="1.0" encoding="utf-8" ?>
<Shell x:Class="TestProject.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject">
    <Shell.FlyoutHeaderTemplate>
        <DataTemplate>
            <Grid BackgroundColor="Black">
                <Image
                    Aspect="AspectFill"
                    Opacity="0.6"
                    Source="sample1.png" />
                <Label
                    Margin="10"
                    HorizontalTextAlignment="Center"
                    VerticalTextAlignment="Center"
                    FontAttributes="Bold"
                    TextColor="White"
                    Text="Animals" />
            </Grid>
        </DataTemplate>
    </Shell.FlyoutHeaderTemplate>
    <FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
        <Tab
            Icon="sample1.png"
            Title="고양이/개">
            <ShellContent
                Icon="sample2.png"
                Title="고양이"
                ContentTemplate="{DataTemplate local:CatPage}" />
            <ShellContent
                Icon="sample3.png"
                Title="개"
                ContentTemplate="{DataTemplate local:DogPage}" />
        </Tab>
        <ShellContent
            Icon="sample1.png"
            Title="원숭이"
            ContentTemplate="{DataTemplate local:MonkeyPage}" />
        <ShellContent
            Icon="sample2.png"
            Title="코끼리"
            ContentTemplate="{DataTemplate local:ElephantPage}" />
        <ShellContent
            Icon="sample3.png"
            Title="곰"
            ContentTemplate="{DataTemplate local:BearPage}" />
    </FlyoutItem>
    <ShellContent
        Icon="sample1.png"
        Title="정보"
        ContentTemplate="{DataTemplate local:AboutPage}" />
    <MenuItem x:Name="helpMenuItem"
        Text="도움말"
        IconImageSource="sample2.png" />
</Shell>

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

<Shell x:Class="TestProject.AppShell"

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

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

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

<Shell.FlyoutHeaderTemplate>

<Image

Aspect="AspectFill"

Opacity="0.6"

Source="sample1.png" />

<Label

Margin="10"

HorizontalTextAlignment="Center"

VerticalTextAlignment="Center"

FontAttributes="Bold"

TextColor="White"

Text="Animals" />

</Grid>

</DataTemplate>

</Shell.FlyoutHeaderTemplate>

<Tab

Icon="sample1.png"

Title="고양이/개">

<ShellContent

Icon="sample2.png"

Title="고양이"

ContentTemplate="{DataTemplate local:CatPage}" />

<ShellContent

Icon="sample3.png"

Title="개"

ContentTemplate="{DataTemplate local:DogPage}" />

</Tab>

<ShellContent

Icon="sample1.png"

Title="원숭이"

ContentTemplate="{DataTemplate local:MonkeyPage}" />

<ShellContent

Icon="sample2.png"

Title="코끼리"

ContentTemplate="{DataTemplate local:ElephantPage}" />

<ShellContent

Icon="sample3.png"

Title="곰"

ContentTemplate="{DataTemplate local:BearPage}" />

</FlyoutItem>

<ShellContent

Icon="sample1.png"

Title="정보"

ContentTemplate="{DataTemplate local:AboutPage}" />

<MenuItem x:Name="helpMenuItem"

Text="도움말"

IconImageSource="sample2.png" />

</Shell>

TestProject.zip

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

■ Shell 엘리먼트의 FlyoutContentTemplate 속성을 사용하는 방법을 보여준다. ▶ AppShell.xaml


<?xml version="1.0" encoding="utf-8" ?>
<Shell x:Class="TestProject.AppShell" x:Name="shell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject">
    <Shell.FlyoutContentTemplate>
        <DataTemplate>
            <CollectionView
                BindingContext="{x:Reference shell}"
                IsGrouped="True"
                ItemsSource="{Binding FlyoutItems}">
                <CollectionView.ItemTemplate>
                    <DataTemplate>
                        <Label
                            FontSize="18"
                            TextColor="Black"
                            Text="{Binding Title}" />
                    </DataTemplate>
                </CollectionView.ItemTemplate>
            </CollectionView>
        </DataTemplate>
    </Shell.FlyoutContentTemplate>
    <FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
        <Tab
            Icon="sample1.png"
            Title="고양이/개">
            <ShellContent
                Icon="sample2.png"
                Title="고양이"
                ContentTemplate="{DataTemplate local:CatPage}" />
            <ShellContent
                Icon="sample3.png"
                Title="개"
                ContentTemplate="{DataTemplate local:DogPage}" />
        </Tab>
        <ShellContent
            Icon="sample1.png"
            Title="원숭이"
            ContentTemplate="{DataTemplate local:MonkeyPage}" />
        <ShellContent
            Icon="sample2.png"
            Title="코끼리"
            ContentTemplate="{DataTemplate local:ElephantPage}" />
        <ShellContent
            Icon="sample3.png"
            Title="곰"
            ContentTemplate="{DataTemplate local:BearPage}" />
    </FlyoutItem>
    <ShellContent
        Icon="sample1.png"
        Title="정보"
        ContentTemplate="{DataTemplate local:AboutPage}" />
    <MenuItem x:Name="helpMenuItem"
        Text="도움말"
        IconImageSource="sample2.png" />
</Shell>

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

<Shell x:Class="TestProject.AppShell" x:Name="shell"

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

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

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

<Shell.FlyoutContentTemplate>

<CollectionView

BindingContext="{x:Reference shell}"

IsGrouped="True"

ItemsSource="{Binding FlyoutItems}">

<CollectionView.ItemTemplate>

<Label

FontSize="18"

TextColor="Black"

Text="{Binding Title}" />

</DataTemplate>

</CollectionView.ItemTemplate>

</CollectionView>

</DataTemplate>

</Shell.FlyoutContentTemplate>

<Tab

Icon="sample1.png"

Title="고양이/개">

<ShellContent

Icon="sample2.png"

Title="고양이"

ContentTemplate="{DataTemplate local:CatPage}" />

<ShellContent

Icon="sample3.png"

Title="개"

ContentTemplate="{DataTemplate local:DogPage}" />

</Tab>

<ShellContent

Icon="sample1.png"

Title="원숭이"

ContentTemplate="{DataTemplate local:MonkeyPage}" />

<ShellContent

Icon="sample2.png"

Title="코끼리"

ContentTemplate="{DataTemplate local:ElephantPage}" />

<ShellContent

Icon="sample3.png"

Title="곰"

ContentTemplate="{DataTemplate local:BearPage}" />

</FlyoutItem>

<ShellContent

Icon="sample1.png"

Title="정보"

ContentTemplate="{DataTemplate local:AboutPage}" />

<MenuItem x:Name="helpMenuItem"

Text="도움말"

IconImageSource="sample2.png" />

</Shell>

TestProject.zip

[C#/MAUI/.NET6] VisualStateManager 엘리먼트 : VisualStateGroups 첨부 속성을 Shell.ItemTemplate 속성에서 사용하기

■ VisualStateManager 엘리먼트의 VisualStateGroups 첨부 속성을 Shell.ItemTemplate 속성에서 사용하는 방법을 보여준다. ▶ AppShell.xaml


<?xml version="1.0" encoding="utf-8" ?>
<Shell x:Class="TestProject.AppShell" x:Name="shell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject">
    <Shell.ItemTemplate>
        <DataTemplate>
            <Grid HeightRequest="50">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="50" />
                    <ColumnDefinition Width="*"  />
                </Grid.ColumnDefinitions>
                <VisualStateManager.VisualStateGroups>
                    <VisualStateGroupList>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal">
                                <VisualState.Setters>
                                    <Setter Property="BackgroundColor" Value="Transparent" />
                                    <Setter
                                        TargetName="label"
                                        Property="Label.TextColor"
                                        Value="Black" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="Selected">
                                <VisualState.Setters>
                                    <Setter Property="BackgroundColor" Value="RoyalBlue" />
                                    <Setter
                                        TargetName="label"
                                        Property="Label.TextColor"
                                        Value="White" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateGroupList>
                </VisualStateManager.VisualStateGroups>
                <Image Grid.Column="0"
                    HorizontalOptions="Center"
                    VerticalOptions="Center"
                    WidthRequest="32"
                    HeightRequest="32"
                    Source="{Binding FlyoutIcon}" />
                <Label x:Name="label" Grid.Column="1"
                    VerticalTextAlignment="Center"
                    FontSize="14"
                    Text="{Binding Title}" />
            </Grid>
        </DataTemplate>
    </Shell.ItemTemplate>
    <FlyoutItem
        Icon="sample1.png"
        Title="고양이"
        FlyoutDisplayOptions="AsSingleItem">
        <ShellContent ContentTemplate="{DataTemplate local:CatPage}" />
    </FlyoutItem>
    <FlyoutItem
        Icon="sample2.png"
        Title="개"
        FlyoutDisplayOptions="AsSingleItem">
        <ShellContent ContentTemplate="{DataTemplate local:DogPage}" />
    </FlyoutItem>
    <FlyoutItem
        Icon="sample3.png"
        Title="원숭이"
        FlyoutDisplayOptions="AsSingleItem">
        <ShellContent ContentTemplate="{DataTemplate local:MonkeyPage}" />
    </FlyoutItem>
</Shell>

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

<Shell x:Class="TestProject.AppShell" x:Name="shell"

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

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

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

<Shell.ItemTemplate>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<VisualStateManager.VisualStateGroups>

<VisualState.Setters>

<Setter

TargetName="label"

Property="Label.TextColor"

Value="Black" />

</VisualState.Setters>

</VisualState>

<VisualState.Setters>

<Setter

TargetName="label"

Property="Label.TextColor"

Value="White" />

</VisualState.Setters>

</VisualState>

</VisualStateGroup>

</VisualStateGroupList>

</VisualStateManager.VisualStateGroups>

<Image Grid.Column="0"

HorizontalOptions="Center"

VerticalOptions="Center"

WidthRequest="32"

HeightRequest="32"

Source="{Binding FlyoutIcon}" />

<Label x:Name="label" Grid.Column="1"

VerticalTextAlignment="Center"

FontSize="14"

Text="{Binding Title}" />

</Grid>

</DataTemplate>

</Shell.ItemTemplate>

<FlyoutItem

Icon="sample1.png"

Title="고양이"

FlyoutDisplayOptions="AsSingleItem">

</FlyoutItem>

<FlyoutItem

Icon="sample2.png"

Title="개"

FlyoutDisplayOptions="AsSingleItem">

</FlyoutItem>

<FlyoutItem

Icon="sample3.png"

Title="원숭이"

FlyoutDisplayOptions="AsSingleItem">

</FlyoutItem>

</Shell>

TestProject.zip

[C#/MAUI/.NET6] FlyoutItem 엘리먼트 : FlyoutDisplayOptions 속성을 AsSingleItem으로 설정하기

■ FlyoutItem 엘리먼트의 FlyoutDisplayOptions 속성을 AsSingleItem으로 설정하는 방법을 보여준다. ▶ AppShell.xaml


<?xml version="1.0" encoding="utf-8" ?>
<Shell x:Class="TestProject.AppShell" x:Name="shell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject">
    <FlyoutItem
        Icon="sample1.png"
        Title="고양이"
        FlyoutDisplayOptions="AsSingleItem">
        <ShellContent ContentTemplate="{DataTemplate local:CatPage}" />
    </FlyoutItem>
    <FlyoutItem
        Icon="sample2.png"
        Title="개"
        FlyoutDisplayOptions="AsSingleItem">
        <ShellContent ContentTemplate="{DataTemplate local:DogPage}" />
    </FlyoutItem>
    <FlyoutItem
        Icon="sample3.png"
        Title="원숭이"
        FlyoutDisplayOptions="AsSingleItem">
        <ShellContent ContentTemplate="{DataTemplate local:MonkeyPage}" />
    </FlyoutItem>
</Shell>

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

<Shell x:Class="TestProject.AppShell" x:Name="shell"

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

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

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

<FlyoutItem

Icon="sample1.png"

Title="고양이"

FlyoutDisplayOptions="AsSingleItem">

</FlyoutItem>

<FlyoutItem

Icon="sample2.png"

Title="개"

FlyoutDisplayOptions="AsSingleItem">

</FlyoutItem>

<FlyoutItem

Icon="sample3.png"

Title="원숭이"

FlyoutDisplayOptions="AsSingleItem">

</FlyoutItem>

</Shell>

TestProject.zip

[C#/MAUI/.NET6] FlyoutItem 엘리먼트 : FlyoutDisplayOptions 속성을 AsMultipleItems으로 설정하기

■ FlyoutItem 엘리먼트의 FlyoutDisplayOptions 속성을 AsMultipleItems으로 설정하는 방법을 보여준다. ▶ AppShell.xaml


<?xml version="1.0" encoding="utf-8" ?>
<Shell x:Class="TestProject.AppShell" x:Name="shell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject">
    <FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
        <ShellContent
            Icon="sample1.png"
            Title="고양이"
            ContentTemplate="{DataTemplate local:CatPage}" />
    </FlyoutItem>
    <FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
        <ShellContent
            Icon="sample2.png"
            Title="개"
            ContentTemplate="{DataTemplate local:DogPage}" />
    </FlyoutItem>
    <FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
        <ShellContent
            Icon="sample3.png"
            Title="원숭이"
            ContentTemplate="{DataTemplate local:MonkeyPage}" />
    </FlyoutItem>
</Shell>

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

<Shell x:Class="TestProject.AppShell" x:Name="shell"

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

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

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

<ShellContent

Icon="sample1.png"

Title="고양이"

ContentTemplate="{DataTemplate local:CatPage}" />

</FlyoutItem>

<ShellContent

Icon="sample2.png"

Title="개"

ContentTemplate="{DataTemplate local:DogPage}" />

</FlyoutItem>

<ShellContent

Icon="sample3.png"

Title="원숭이"

ContentTemplate="{DataTemplate local:MonkeyPage}" />

</FlyoutItem>

</Shell>

TestProject.zip

[C#/MAUI/.NET6] ContentPage 클래스 : Navigation 속성을 사용해 페이지 이동하기

■ ContentPage 클래스의 Navigation 속성을 사용해 페이지를 이동하는 방법을 보여준다. ▶ 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"
    Title="메인 페이지">
    <Button x:Name="moveButton"
        HorizontalOptions="Center"
        VerticalOptions="Center"
        Text="두번째 페이지 이동하기" />
</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"

Title="메인 페이지">

<Button x:Name="moveButton"

HorizontalOptions="Center"

VerticalOptions="Center"

Text="두번째 페이지 이동하기" />

</ContentPage>

▶ MainPage.xaml.cs


namespace TestProject;

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

    #region 생성자 - MainPage()

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

        this.moveButton.Clicked += moveButton_Clicked;
    }

    #endregion

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

    #region 두번째 페이지 이동하기 - moveButton_Clicked(sender, e)

    /// <summary>
    /// 두번째 페이지 이동하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    private async void moveButton_Clicked(object sender, EventArgs e)
    {
        await Navigation.PushAsync(new SecondPage());
    }

    #endregion
}

namespace TestProject;

/// <summary>

/// 메인 페이지

/// </summary>

public partial class MainPage : ContentPage

{

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

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

#region 생성자 - MainPage()

/// <summary>

/// 생성자

/// </summary>

public MainPage()

{

InitializeComponent();

this.moveButton.Clicked += moveButton_Clicked;

}

#endregion

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

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

#region 두번째 페이지 이동하기 - moveButton_Clicked(sender, e)

/// <summary>

/// 두번째 페이지 이동하기

/// </summary>

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

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

private async void moveButton_Clicked(object sender, EventArgs e)

{

await Navigation.PushAsync(new SecondPage());

}

#endregion

}

▶ SecondPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.SecondPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    Title="두번째 페이지">
    <Label
        HorizontalOptions="Center"
        VerticalOptions="Center"
        Text="두번쨰 페이지" />
</ContentPage>

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

<ContentPage x:Class="TestProject.SecondPage"

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

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

Title="두번째 페이지">

<Label

HorizontalOptions="Center"

VerticalOptions="Center"

Text="두번쨰 페이지" />

</ContentPage>

▶ SecondPage.xaml.cs


namespace TestProject;

/// <summary>
/// 두번째 페이지
/// </summary>
public partial class SecondPage : ContentPage
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 생성자 - SecondPage()

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

    #endregion
}

namespace TestProject;

/// <summary>

/// 두번째 페이지

/// </summary>

public partial class SecondPage : ContentPage

{

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

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

#region 생성자 - SecondPage()

/// <summary>

/// 생성자

/// </summary>

public SecondPage()

{

InitializeComponent();

}

#endregion

}

[C#/MAUI/.NET6] NavigationPage 엘리먼트 : TitleView 첨부 속성 사용하기

■ NavigationPage 엘리먼트의 TitleView 첨부 속성을 사용하는 방법을 보여준다. ▶ SecondPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.SecondPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    Title="두번째 페이지"
    BackgroundColor="White">
    <NavigationPage.TitleView>
        <Slider
            WidthRequest="300"
            HeightRequest="44" />
    </NavigationPage.TitleView>
    <Button x:Name="navigateButton"
        HorizontalOptions="Center"
        VerticalOptions="Center"
        Text="메인 페이지 이동" />
</ContentPage>

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

<ContentPage x:Class="TestProject.SecondPage"

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

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

Title="두번째 페이지"

BackgroundColor="White">

<NavigationPage.TitleView>

<Slider

WidthRequest="300"

HeightRequest="44" />

</NavigationPage.TitleView>

<Button x:Name="navigateButton"

HorizontalOptions="Center"

VerticalOptions="Center"

Text="메인 페이지 이동" />

</ContentPage>

TestProject.zip

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

■ FlyoutPage 엘리먼트를 사용하는 방법을 보여준다. ▶ PageItem.cs


namespace TestProject;

/// <summary>
/// 페이지 항목
/// </summary>
public class PageItem
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Property
    ////////////////////////////////////////////////////////////////////////////////////////// Public

    #region 제목 - Title

    /// <summary>
    /// 제목
    /// </summary>
    public string Title { get; set; }

    #endregion
    #region 아이콘 소스 - IconSource

    /// <summary>
    /// 아이콘 소스
    /// </summary>
    public string IconSource { get; set; }

    #endregion
    #region 타겟 타입 - TargetType

    /// <summary>
    /// 타겟 타입
    /// </summary>
    public Type TargetType { get; set; }

    #endregion
}

namespace TestProject;

/// <summary>

/// 페이지 항목

/// </summary>

public class PageItem

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Property

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

#region 제목 - Title

/// <summary>

/// 제목

/// </summary>

public string Title { get; set; }

#endregion

#region 아이콘 소스 - IconSource

/// <summary>

/// 아이콘 소스

/// </summary>

public string IconSource { get; set; }

#endregion

#region 타겟 타입 - TargetType

/// <summary>

/// 타겟 타입

/// </summary>

public Type TargetType { get; set; }

#endregion

}

▶ MenuPage.xaml


<ContentPage x:Class="TestProject.MenuPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject"
    Title="메뉴 페이지"
    Padding="0,40,0,0">
    <CollectionView x:Name="collectionView"
        SelectionMode="Single">
        <CollectionView.ItemsSource>
            <x:Array Type="{x:Type local:PageItem}">
                <local:PageItem
                    IconSource="sample1.png"
                    Title="연락처"
                    TargetType="{x:Type local:ContactPage}" />
                <local:PageItem
                    IconSource="sample2.png"
                    Title="할일"
                    TargetType="{x:Type local:TodoListPage}" />
                <local:PageItem
                    IconSource="sample3.png"
                    Title="리마인더"
                    TargetType="{x:Type local:ReminderPage}" />
            </x:Array>
        </CollectionView.ItemsSource>
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <Grid Padding="5,10">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="30"/>
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <Image Source="{Binding IconSource}" />
                    <Label Grid.Column="1"
                        VerticalOptions="Center"
                        Margin="20,0"
                        FontAttributes="Bold"
                        FontSize="20"
                        Text="{Binding Title}" />
                </Grid>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentPage>

<ContentPage x:Class="TestProject.MenuPage"

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

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

xmlns:local="clr-namespace:TestProject"

Title="메뉴 페이지"

Padding="0,40,0,0">

<CollectionView x:Name="collectionView"

SelectionMode="Single">

<CollectionView.ItemsSource>

<x:Array Type="{x:Type local:PageItem}">

<local:PageItem

IconSource="sample1.png"

Title="연락처"

TargetType="{x:Type local:ContactPage}" />

<local:PageItem

IconSource="sample2.png"

Title="할일"

TargetType="{x:Type local:TodoListPage}" />

<local:PageItem

IconSource="sample3.png"

Title="리마인더"

TargetType="{x:Type local:ReminderPage}" />

</x:Array>

</CollectionView.ItemsSource>

<CollectionView.ItemTemplate>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Label Grid.Column="1"

VerticalOptions="Center"

Margin="20,0"

FontAttributes="Bold"

FontSize="20"

Text="{Binding Title}" />

</Grid>

</DataTemplate>

</CollectionView.ItemTemplate>

</CollectionView>

</ContentPage>

▶ MenuPage.xaml.cs


namespace TestProject;

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

    #region 생성자 - MenuPage()

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

        this.collectionView.SelectionChanged += collectionView_SelectionChanged;
    }

    #endregion

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

    #region 컬렉션 뷰 선택 변경시 처리하기 - collectionView_SelectionChanged(sender, e)

    /// <summary>
    /// 컬렉션 뷰 선택 변경시 처리하기
    /// </summary>
    /// <param name="sender">이벤트 발생자</param>
    /// <param name="e">이벤트 인자</param>
    /// <exception cref="NotImplementedException"></exception>
    private void collectionView_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        var item = e.CurrentSelection.FirstOrDefault() as PageItem;

        if(item != null)
        {
            MainPage mainPage = App.Current.MainPage as MainPage;

            mainPage.Detail = new NavigationPage((Page)Activator.CreateInstance(item.TargetType));

            mainPage.IsPresented = false;
        }
    }

    #endregion
}

namespace TestProject;

/// <summary>

/// 메뉴 페이지

/// </summary>

public partial class MenuPage : ContentPage

{

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

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

#region 생성자 - MenuPage()

/// <summary>

/// 생성자

/// </summary>

public MenuPage()

{

InitializeComponent();

this.collectionView.SelectionChanged += collectionView_SelectionChanged;

}

#endregion

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

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

#region 컬렉션 뷰 선택 변경시 처리하기 - collectionView_SelectionChanged(sender, e)

/// <summary>

/// 컬렉션 뷰 선택 변경시 처리하기

/// </summary>

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

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

/// <exception cref="NotImplementedException"></exception>

private void collectionView_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

var item = e.CurrentSelection.FirstOrDefault() as PageItem;

if(item != null)

{

MainPage mainPage = App.Current.MainPage as MainPage;

mainPage.Detail = new NavigationPage((Page)Activator.CreateInstance(item.TargetType));

mainPage.IsPresented = false;

}

#endregion

}

▶ MainPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<FlyoutPage x:Class="TestProject.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject">
    <FlyoutPage.Flyout>
        <local:MenuPage x:Name="menuPage" />
    </FlyoutPage.Flyout>
    <FlyoutPage.Detail>
        <NavigationPage>
            <x:Arguments>
                <local:ContactPage />
            </x:Arguments>
        </NavigationPage>
    </FlyoutPage.Detail>
</FlyoutPage>

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

<FlyoutPage x:Class="TestProject.MainPage"

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

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

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

<FlyoutPage.Flyout>

<local:MenuPage x:Name="menuPage" />

</FlyoutPage.Flyout>

<FlyoutPage.Detail>

<x:Arguments>

<local:ContactPage />

</x:Arguments>

</NavigationPage>

</FlyoutPage.Detail>

</FlyoutPage>

TestProject.zip

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

■ SearchHandler 엘리먼트의 Keyboard 속성을 사용하는 방법을 보여준다. ▶ CatPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.CatPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject"
    Title="Cat Page"
    BackgroundColor="White">
    <Shell.SearchHandler>
        <local:AnimalSearchHandler
            Keyboard="Text"
            DisplayMemberName="Name"
            Placeholder="동물명을 입력해 주시기 바랍니다." />
    </Shell.SearchHandler>
    <StackLayout>
        <Label Text="CAT PAGE"
            VerticalOptions="CenterAndExpand"
            HorizontalOptions="CenterAndExpand" />
    </StackLayout>
</ContentPage>

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

<ContentPage x:Class="TestProject.CatPage"

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

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

xmlns:local="clr-namespace:TestProject"

Title="Cat Page"

BackgroundColor="White">

<Shell.SearchHandler>

<local:AnimalSearchHandler

Keyboard="Text"

DisplayMemberName="Name"

Placeholder="동물명을 입력해 주시기 바랍니다." />

</Shell.SearchHandler>

<Label Text="CAT PAGE"

VerticalOptions="CenterAndExpand"

HorizontalOptions="CenterAndExpand" />

</StackLayout>

</ContentPage>

TestProject.zip

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

■ SearchHandler 엘리먼트의 SearchBoxVisibility 속성을 사용하는 방법을 보여준다. ▶ CatPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.CatPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject"
    Title="Cat Page"
    BackgroundColor="White">
    <Shell.SearchHandler>
        <local:AnimalSearchHandler
            DisplayMemberName="Name"
            Placeholder="동물명을 입력해 주시기 바랍니다."
            SearchBoxVisibility="Collapsible" />
    </Shell.SearchHandler>
    <StackLayout>
        <Label Text="CAT PAGE"
            VerticalOptions="CenterAndExpand"
            HorizontalOptions="CenterAndExpand" />
    </StackLayout>
</ContentPage>

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

<ContentPage x:Class="TestProject.CatPage"

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

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

xmlns:local="clr-namespace:TestProject"

Title="Cat Page"

BackgroundColor="White">

<Shell.SearchHandler>

<local:AnimalSearchHandler

DisplayMemberName="Name"

Placeholder="동물명을 입력해 주시기 바랍니다."

SearchBoxVisibility="Collapsible" />

</Shell.SearchHandler>

<Label Text="CAT PAGE"

VerticalOptions="CenterAndExpand"

HorizontalOptions="CenterAndExpand" />

</StackLayout>

</ContentPage>

TestProject.zip

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

■ SearchHandler 엘리먼트의 ItemTemplate 속성을 사용하는 방법을 보여준다. ▶ CatPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.CatPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject"
    Title="Cat Page"
    BackgroundColor="White">
    <Shell.SearchHandler>
        <local:AnimalSearchHandler
            Placeholder="동물명을 입력해 주시기 바랍니다.">
            <local:AnimalSearchHandler.ItemTemplate>
                <DataTemplate>
                    <Grid
                        Padding="10"
                        ColumnDefinitions="Auto,10,Auto">
                        <Label Grid.Column="0"
                            VerticalOptions="Center"
                            FontAttributes="Bold"
                            Text="{Binding ID}" />
                        <Label Grid.Column="2"
                            VerticalOptions="Center"
                            FontAttributes="Bold"
                            Text="{Binding Name}" />
                    </Grid>
                </DataTemplate>
            </local:AnimalSearchHandler.ItemTemplate>
        </local:AnimalSearchHandler>
    </Shell.SearchHandler>
    <StackLayout>
        <Label Text="CAT PAGE"
            VerticalOptions="CenterAndExpand"
            HorizontalOptions="CenterAndExpand" />
    </StackLayout>
</ContentPage>

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

<ContentPage x:Class="TestProject.CatPage"

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

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

xmlns:local="clr-namespace:TestProject"

Title="Cat Page"

BackgroundColor="White">

<Shell.SearchHandler>

<local:AnimalSearchHandler

Placeholder="동물명을 입력해 주시기 바랍니다.">

<local:AnimalSearchHandler.ItemTemplate>

<Grid

Padding="10"

ColumnDefinitions="Auto,10,Auto">

<Label Grid.Column="0"

VerticalOptions="Center"

FontAttributes="Bold"

Text="{Binding ID}" />

<Label Grid.Column="2"

VerticalOptions="Center"

FontAttributes="Bold"

Text="{Binding Name}" />

</Grid>

</DataTemplate>

</local:AnimalSearchHandler.ItemTemplate>

</local:AnimalSearchHandler>

</Shell.SearchHandler>

<Label Text="CAT PAGE"

VerticalOptions="CenterAndExpand"

HorizontalOptions="CenterAndExpand" />

</StackLayout>

</ContentPage>

TestProject.zip

[C#/MAUI/.NET6] Shell 엘리먼트 : SearchHandler 첨부 속성을 사용해 셸 검색 사용하기

■ Shell 엘리먼트의 SearchHandler 첨부 속성을 사용해 셸 검색을 사용하는 방법을 보여준다. ▶ AnimalSearchHandler.cs


using TestProject.Models;

namespace TestProject;

/// <summary>
/// 동물 검색 핸들러
/// </summary>
public class AnimalSearchHandler : SearchHandler
{
    //////////////////////////////////////////////////////////////////////////////////////////////////// Field
    ////////////////////////////////////////////////////////////////////////////////////////// Private

    #region Field

    /// <summary>
    /// 리스트
    /// </summary>
    private List<AnimalModel> list = new List<AnimalModel>
    {
        new AnimalModel { ID = 1, Name = "고양이", Route = "//고양이" },
        new AnimalModel { ID = 2, Name = "개"    , Route = "//개"     },
        new AnimalModel { ID = 3, Name = "원숭이", Route = "//원숭이" },
        new AnimalModel { ID = 4, Name = "코끼리", Route = "//코끼리" },
        new AnimalModel { ID = 5, Name = "곰"    , Route = "//곰"     }
    };

    #endregion

    //////////////////////////////////////////////////////////////////////////////////////////////////// Method
    ////////////////////////////////////////////////////////////////////////////////////////// Protected

    #region 쿼리 변경시 처리하기 - OnQueryChanged(oldValue, newValue)

    /// <summary>
    /// 쿼리 변경시 처리하기
    /// </summary>
    /// <param name="oldValue">이전 값</param>
    /// <param name="newValue">신규 값</param>
    protected override void OnQueryChanged(string oldValue, string newValue)
    {
        base.OnQueryChanged(oldValue, newValue);

        if(string.IsNullOrWhiteSpace(newValue))
        {
            ItemsSource = null;
        }
        else
        {
            ItemsSource = this.list;
        }
    }

    #endregion
    #region 항목 선택시 처리하기 - OnItemSelected(item)

    /// <summary>
    /// 항목 선택시 처리하기
    /// </summary>
    /// <param name="item">항목</param>
    protected override async void OnItemSelected(object item)
    {
        base.OnItemSelected(item);

        AnimalModel animal = item as AnimalModel;

        await Shell.Current.GoToAsync($"{animal.Route}");
    }

    #endregion
}

using TestProject.Models;

namespace TestProject;

/// <summary>

/// 동물 검색 핸들러

/// </summary>

public class AnimalSearchHandler : SearchHandler

{

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

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

#region Field

/// <summary>

/// 리스트

/// </summary>

private List<AnimalModel> list = new List<AnimalModel>

{

new AnimalModel { ID = 1, Name = "고양이", Route = "//고양이" },

new AnimalModel { ID = 2, Name = "개" , Route = "//개" },

new AnimalModel { ID = 3, Name = "원숭이", Route = "//원숭이" },

new AnimalModel { ID = 4, Name = "코끼리", Route = "//코끼리" },

new AnimalModel { ID = 5, Name = "곰" , Route = "//곰" }

};

#endregion

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

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

#region 쿼리 변경시 처리하기 - OnQueryChanged(oldValue, newValue)

/// <summary>

/// 쿼리 변경시 처리하기

/// </summary>

/// <param name="oldValue">이전 값</param>

/// <param name="newValue">신규 값</param>

protected override void OnQueryChanged(string oldValue, string newValue)

{

base.OnQueryChanged(oldValue, newValue);

if(string.IsNullOrWhiteSpace(newValue))

{

ItemsSource = null;

}

else

{

ItemsSource = this.list;

}

#endregion

#region 항목 선택시 처리하기 - OnItemSelected(item)

/// <summary>

/// 항목 선택시 처리하기

/// </summary>

/// <param name="item">항목</param>

protected override async void OnItemSelected(object item)

{

base.OnItemSelected(item);

AnimalModel animal = item as AnimalModel;

await Shell.Current.GoToAsync($"{animal.Route}");

}

#endregion

}

▶ CatPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.CatPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:TestProject"
    Title="Cat Page"
    BackgroundColor="White">
    <Shell.SearchHandler>
        <local:AnimalSearchHandler
            DisplayMemberName="Name"
            Placeholder="동물명을 입력해 주시기 바랍니다." />
    </Shell.SearchHandler>
    <StackLayout>
        <Label Text="CAT PAGE"
            VerticalOptions="CenterAndExpand"
            HorizontalOptions="CenterAndExpand" />
    </StackLayout>
</ContentPage>

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

<ContentPage x:Class="TestProject.CatPage"

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

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

xmlns:local="clr-namespace:TestProject"

Title="Cat Page"

BackgroundColor="White">

<Shell.SearchHandler>

<local:AnimalSearchHandler

DisplayMemberName="Name"

Placeholder="동물명을 입력해 주시기 바랍니다." />

</Shell.SearchHandler>

<Label Text="CAT PAGE"

VerticalOptions="CenterAndExpand"

HorizontalOptions="CenterAndExpand" />

</StackLayout>

</ContentPage>

TestProject.zip

[태그:] NAVIGATION

[C#/WINUI3/.NET8] Hyperlink 엘리먼트 : NavigateUri 속성을 사용해 웹 사이트 호출하기

[C#/WINUI3/.NET8] KeyboardAccelerator 클래스 : Invoked 이벤트를 사용해 단축키를 누르는 경우 페이지 뒤로 가기/앞으로 가기

[C#/WINUI3/.NET8] Button 엘리먼트 : Click 이벤트를 사용해 BACK 버튼 클릭시 뒤로 가기

[C#/WINUI3/.NET8] Button 엘리먼트 : Style/IsEnabled 속성을 사용해 페이지에서 BACK 버튼 만들기

[C#/WINUI3/.NET8] SlideNavigationTransitionInfo 클래스 : Effect 속성을 사용해 페이지 전환시 슬라이드 애니메이션 만들기

[C#/WINUI3/.NET8] Page 엘리먼트 : NavigationCacheMode 속성을 사용해 페이지 캐시 설정하기

[C#/WINUI3/.NET8] Frame 클래스 : Navigate 메소드 사용시 인자 전달하기

[C#/WINUI3/.NET8] Frame 클래스 : BackStack 속성 사용하기

[C#/WPF] Frame 클래스 : Navigated 이벤트를 사용해 스크립트 오류 억제하기

[C#/WPF] Hyperlink 클래스 : MouseEnter/MouseLeave 이벤트를 사용해 마우스 진입시 밑줄 표시하기

[C#/MAUI/.NET6] Shell 엘리먼트 : 태양 일출/일몰 및 달 위상 정보 조회하기

[C#/MAUI/.NET6] ContentPage 클래스 : Navigation 속성을 사용해 모달 페이지 이동하기

[C#/MAUI/.NET6] Shell 엘리먼트 : FlyoutFooterTemplate 속성을 사용해 플라이아웃 바닥글 설정하기

[C#/MAUI/.NET6] Shell 엘리먼트 : FlyoutHeaderTemplate 속성을 사용해 플라이아웃 헤더 설정하기

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

[C#/MAUI/.NET6] VisualStateManager 엘리먼트 : VisualStateGroups 첨부 속성을 Shell.ItemTemplate 속성에서 사용하기

[C#/MAUI/.NET6] FlyoutItem 엘리먼트 : FlyoutDisplayOptions 속성을 AsSingleItem으로 설정하기

[C#/MAUI/.NET6] FlyoutItem 엘리먼트 : FlyoutDisplayOptions 속성을 AsMultipleItems으로 설정하기

[C#/MAUI/.NET6] ContentPage 클래스 : Navigation 속성을 사용해 페이지 이동하기

[C#/MAUI/.NET6] NavigationPage 엘리먼트 : TitleView 첨부 속성 사용하기

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

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

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

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

[C#/MAUI/.NET6] Shell 엘리먼트 : SearchHandler 첨부 속성을 사용해 셸 검색 사용하기