[C#/MAUI/.NET6] Shell 엘리먼트 : NavBarHasShadow 첨부 속성을 사용해 탐색바 그림자 설정하기 (프리뷰 버전 오류)

■ Shell 엘리먼트의 NavBarHasShadow 첨부 속성을 사용해 탐색바 그림자를 설정하는 방법을 보여준다.

▶ 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"
    Title="Cat Page"
    BackgroundColor="White"
    Shell.NavBarHasShadow="False">
    <StackLayout>
        <Label
            HorizontalOptions="CenterAndExpand"
            VerticalOptions="CenterAndExpand"
            Text="CAT PAGE" />
    </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"

Title="Cat Page"

BackgroundColor="White"

Shell.NavBarHasShadow="False">

<Label

HorizontalOptions="CenterAndExpand"

VerticalOptions="CenterAndExpand"

Text="CAT PAGE" />

</StackLayout>

</ContentPage>

▶ DogPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.DogPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    Title="Dog Page"
    BackgroundColor="White"
    Shell.NavBarHasShadow="False">
    <StackLayout>
        <Label
            HorizontalOptions="CenterAndExpand"
            VerticalOptions="CenterAndExpand"
            Text="DOG PAGE" />
    </StackLayout>
</ContentPage>

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

<ContentPage x:Class="TestProject.DogPage"

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

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

Title="Dog Page"

BackgroundColor="White"

Shell.NavBarHasShadow="False">

<Label

HorizontalOptions="CenterAndExpand"

VerticalOptions="CenterAndExpand"

Text="DOG PAGE" />

</StackLayout>

</ContentPage>

▶ MonkeyPage.xaml


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="TestProject.MonkeyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    Title="Monkey Page"
    BackgroundColor="White"
    Shell.NavBarHasShadow="False">
    <StackLayout>
        <Label
            HorizontalOptions="CenterAndExpand"
            VerticalOptions="CenterAndExpand"
            Text="MONKEY PAGE" />
    </StackLayout>
</ContentPage>

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

<ContentPage x:Class="TestProject.MonkeyPage"

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

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

Title="Monkey Page"

BackgroundColor="White"

Shell.NavBarHasShadow="False">

<Label

HorizontalOptions="CenterAndExpand"

VerticalOptions="CenterAndExpand"

Text="MONKEY PAGE" />

</StackLayout>

</ContentPage>

▶ 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">
    <FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
        <ShellContent
            Icon="sample1.png"
            Title="고양이"
            ContentTemplate="{DataTemplate local:CatPage}" />
        <ShellContent
            Icon="sample2.png"
            Title="개"
            ContentTemplate="{DataTemplate local:DogPage}" />
        <ShellContent
            Icon="sample3.png"
            Title="원숭이"
            ContentTemplate="{DataTemplate local:MonkeyPage}" />
    </FlyoutItem>
</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">

<ShellContent

Icon="sample1.png"

Title="고양이"

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

<ShellContent

Icon="sample2.png"

Title="개"

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

<ShellContent

Icon="sample3.png"

Title="원숭이"

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

</FlyoutItem>

</Shell>

※ 프리뷰 버전 테스트시, 해당 속성시 변경 사항을 확인할 수 없었다.

TestProject.zip