Xamarin Shell Floyout 选项卡隐藏部分内容页面

Question

我正在使用 Xamarin Shell 弹出页面，按钮上有一个选项卡菜单。当我从 floutpage 加载内容页面时，内容页面的下部隐藏在选项卡后面

这是我的appshell.xaml.cs

    <?xml version="1.0" encoding="utf-8" ?>
<Shell xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:EY365OCMobileApp" xmlns:local1="clr-namespace:EY365OCMobileApp.Pages"
             x:Class="EY365OCMobileApp.AppShell"
             Shell.TabBarBackgroundColor="White"
             Shell.TabBarUnselectedColor="Black"
             Shell.TabBarTitleColor="Gray"
             Shell.TitleColor="Black"
             Shell.BackgroundColor="White"
             Shell.ForegroundColor="Black"
             >
    <FlyoutItem FlyoutDisplayOptions="AsMultipleItems">
        <ShellContent Title="Offerings" Icon="{local:ImageResource EY365OCMobileApp.Images.offeringsicon.png}" ContentTemplate="{DataTemplate local:OffersPage}" />
        <ShellContent Title="Products" Icon="{local:ImageResource EY365OCMobileApp.Images.assortmenticon.png}" ContentTemplate="{DataTemplate local:AssortmentPage}"/>
        <ShellContent Title="Cart" Icon="{local:ImageResource EY365OCMobileApp.Images.carticon.png}" ContentTemplate="{DataTemplate local:CartPage}"/>
        <ShellContent Title="Orders" Icon="{local:ImageResource EY365OCMobileApp.Images.yourordericon.png}" ContentTemplate="{DataTemplate local:OrdersPage}"/>
        <ShellContent Title="Sets" Icon="{local:ImageResource EY365OCMobileApp.Images.combinations.png}" ContentTemplate="{DataTemplate local1:ProductCombinations_Header}"/>
        <ShellContent Title="Questions" Icon="{local:ImageResource EY365OCMobileApp.Images.questionsproblemsicon.png}" ContentTemplate="{DataTemplate local:CasesPage}"/>
        <ShellContent Title="Notifications" Icon="{local:ImageResource EY365OCMobileApp.Images.notification.png}" ContentTemplate="{DataTemplate local1:ProductCombinations_Header}"/>
        <ShellContent Title="Sustainability" Icon="{local:ImageResource EY365OCMobileApp.Images.sustainability.png}" ContentTemplate="{DataTemplate local:SustainabilityPage}"/>
        <ShellContent Title="Our Stores" Icon="{local:ImageResource EY365OCMobileApp.Images.store.png}" ContentTemplate="{DataTemplate local1:StoreLocationPage}"/>
        <ShellContent Title="Settings" Icon="{local:ImageResource EY365OCMobileApp.Images.yourprofileicon.png}" ContentTemplate="{DataTemplate local:UserProfilePage}"/>
        <ShellContent Title="App News" Icon="{local:ImageResource EY365OCMobileApp.Images.appoverview.png}" ContentTemplate="{DataTemplate local1:AppOverviewPage}"/>
    </FlyoutItem>
    <MenuItem Text="Login" IconImageSource="{local:ImageResource EY365OCMobileApp.Images.login.png}" Clicked="OnSignIn"/>
</Shell>

这是我加载的内容页面（顺便说一句：我将 TitleColor 设置为黑色，但它仍然是白色？！？！？）

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:EY365OCMobileApp"
             x:Class="EY365OCMobileApp.OffersPage"
             ControlTemplate="{StaticResource SpeechBotIconTemplate}"
             Title="Offerings"
             BackgroundColor="white"
             Shell.TitleColor="white">
    
    <ContentPage.ToolbarItems>
        <ToolbarItem Text="Create Bug" Clicked="ToolbarItem_Clicked" Order="Default" Priority="0" IconImageSource="{local:ImageResource EY365OCMobileApp.Images.bugicon.png}"/>
    </ContentPage.ToolbarItems>
    <ContentPage.Content>

        <StackLayout>

            <CarouselView x:Name="CarouselView" IndicatorView="indicatorView">
                <CarouselView.ItemTemplate>
                    <DataTemplate>
                        <StackLayout>
                            <Frame HasShadow="True"
                                       BorderColor="DarkGray"
                                       CornerRadius="5"
                                       Margin="20,20,20,80"
                                       
                                       HorizontalOptions="CenterAndExpand"
                                       VerticalOptions="FillAndExpand">
                                <AbsoluteLayout >

                                    <Image Source="{Binding ImageURL}" Aspect="AspectFill" AbsoluteLayout.LayoutBounds="1,1,1,1" AbsoluteLayout.LayoutFlags="All" />
                                    <StackLayout Margin="20,20,20,20" BackgroundColor="Transparent" AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="1,1,1,1">
                                        <Label Text="{Binding Name}"
                                                   FontAttributes="Bold"
                                                   FontSize="Large"
                                                   HorizontalOptions="CenterAndExpand"
                                                   VerticalOptions="Start"
                                                   TextColor="#FFE600" HorizontalTextAlignment="Center"/>
                                    </StackLayout>
                                    <AbsoluteLayout AbsoluteLayout.LayoutBounds="1,1,1,.70" AbsoluteLayout.LayoutFlags="All" BackgroundColor="#66000000" Margin="10,10,10,10">
                                        <StackLayout Orientation="Vertical" Margin="20,20,20,20" BackgroundColor="Transparent" AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="1,1,1,1">
                                            <Label Text="{Binding Offer}"
                                                       TextColor="White" 
                                                       VerticalOptions="StartAndExpand"
                                                       FontSize="Medium"/>
                                        </StackLayout>
                                    </AbsoluteLayout>
                                </AbsoluteLayout>
                            </Frame>
                            
                        </StackLayout>
                        
                    </DataTemplate>
                </CarouselView.ItemTemplate>
            </CarouselView>
            <Label Text="Swipe for more!" TextColor="Black" FontSize="Small" HorizontalTextAlignment="Center" HorizontalOptions="CenterAndExpand"/>
            <IndicatorView x:Name="indicatorView"
                       IndicatorsShape="Square"
                       IndicatorColor="LightGray"
                       SelectedIndicatorColor="DarkGray"
                       HorizontalOptions="Center"
                       Margin="0,0,0,40" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

我尝试过使用边距，但这在这里没有帮助。填充产生相同的结果。我想将其作为固定页面而不是滚动视图。所以它应该适合标签上方的设备屏幕

Answer 1

我已经在我的 side.To 上测试了你的代码，请清楚，改变框架的边距（边距的第四个值）将有助于改变 CarouselView 的位置。

Xamarin Shell Floyout 选项卡隐藏部分内容页面

Xamarin Shell Floyout Tabs hiding parts of the content page

xamarin.android

xamarin

xamarin.forms

xamarin.shell