Question

我正在使用Xamarin.Forms Shell布局，并使用一个名为CustomFlyoutItem的Custom子类FlyoutItem的Flyout菜单，该菜单的显示由数据项模板控制。该模板使用一个网格并包含两行。第二行只是粉红色的底部边框（BoxView高度为1），并且仅当我的customFlyoutItem的bool属性HasBottomDivider设置为true时，才应显示该行。（使用IsVisible绑定可实现此目的。）

有两个问题：1）弹出项目中的最后一个项目应该是屏幕截图中的“帮助”项目。但是，列表似乎包含一个额外的幻影CustomFlyoutItem，没有图标或文本。在调试时，我看到这是“ ShellGroupItem”类型的项目 2）该产品在其下方也出现了粉红色边框，这确实是主要问题。

我有一种变通方法，可以在页面显示之前使用linq删除该项目，但是我想知道为什么它首先存在的根本原因。

    <Shell.ItemTemplate>
    <DataTemplate>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="0.05*"></ColumnDefinition>
                <ColumnDefinition Width="0.1*"></ColumnDefinition>
                <ColumnDefinition Width="0.85*"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="45" />
                <RowDefinition Height="1" />
            </Grid.RowDefinitions>

            <Label Text="{Binding Ligature}"
                   Grid.Column="1"
                   Grid.Row="0"
                   TextColor="White"
                   FontFamily="{Binding FontFamily }"
                   VerticalTextAlignment="Center"
                   HorizontalTextAlignment="Start"
                   FontSize="20"
                   HeightRequest="45">

            </Label>
            <Label Grid.Column="2"
                   Grid.Row="0"
                   FontSize="16"
                   Margin="0"
                   Text="{Binding Title}"
                   TextColor="White"
                   HorizontalTextAlignment="Start"

                   VerticalTextAlignment="Center" />
            <BoxView IsVisible="{Binding HasBottomDivider}" 
                     BackgroundColor="{StaticResource BrilliantRose}" 
                     Grid.Column="0" Grid.ColumnSpan="3" 
                     Grid.Row="1" >
            </BoxView>
        </Grid>
    </DataTemplate>
</Shell.ItemTemplate>

<Shell.FlyoutHeader>
    <menu:FlyoutHeader />
</Shell.FlyoutHeader>
<menu:CustomFlyoutItem Title="Home" FontFamily="{StaticResource FontAwesomeSolid}" Ligature="{x:Static fontawesome:FontAwesomeIcons.Home}">
    <Tab>
        <ShellContent>
            <views:LoginPage />
        </ShellContent>
    </Tab>
</menu:CustomFlyoutItem>
<menu:CustomFlyoutItem HasBottomDivider="true" Title="Measurements" FontFamily="{StaticResource FontAwesomeRegular}" Ligature="{x:Static fontawesome:FontAwesomeIcons.ChartBar}">
    <Tab>
        <ShellContent>
            <views:LoginPage />
        </ShellContent>
    </Tab>
</menu:CustomFlyoutItem>
<menu:CustomFlyoutItem Title="Jobs" FontFamily="{StaticResource FontAwesomeSolid}" Ligature="{x:Static fontawesome:FontAwesomeIcons.User}">
    <Tab>
        <ShellContent>
            <views:LoginPage />
        </ShellContent>
    </Tab>
</menu:CustomFlyoutItem>
<menu:CustomFlyoutItem HasBottomDivider="true" Title="Instruments" FontFamily="{StaticResource FontAwesomeBrands}" Ligature="{x:Static fontawesome:FontAwesomeIcons.BluetoothB}">
    <Tab>
        <ShellContent>
            <views:LoginPage />
        </ShellContent>
    </Tab>
</menu:CustomFlyoutItem>
<menu:CustomFlyoutItem Title="Settings" FontFamily="{StaticResource FontAwesomeSolid}" Ligature="{x:Static fontawesome:FontAwesomeIcons.Cog}">
    <Tab>
        <ShellContent>
            <views:LoginPage />
        </ShellContent>
    </Tab>
</menu:CustomFlyoutItem>
<menu:CustomFlyoutItem Title="Help" FontFamily="{StaticResource FontAwesomeSolid}" Ligature="{x:Static fontawesome:FontAwesomeIcons.QuestionCircle}">
    <Tab>
        <ShellContent>
            <views:LoginPage />
        </ShellContent>
    </Tab>
</menu:CustomFlyoutItem>

    public class CustomFlyoutItem : FlyoutItem
{
    public string FontFamily { get; set; }
    public string Ligature { get; set; }  = "";

    public bool HasBottomDivider { get; set; } = false;


}

Phantom ShellGroupItem被添加到MainPage.InternalChildren列表

0 个答案: