Оболочка Xamarin.Forms объединяет и заказывает FlyoutItem с MenuItem в меню гамбургера - PullRequest
Новая
       14

Оболочка Xamarin.Forms объединяет и заказывает FlyoutItem с MenuItem в меню гамбургера

0 голосов
/ 04 ноября 2019

В настоящее время у меня есть FlyoutItem со свойством FlyoutDisplayOptions в AsMultipleItems, что делает то, что меню гамбургера содержит в качестве элементов те же дополнительные элементы, что и страница с вкладками. У меня также есть несколько MenuItems в моем дизайне, в данный момент он не позволяет мне разместить MenuItem внутри FlyoutItem, это мой текущий дизайн:

  • FlyoutItem 1
  • FlyoutItem 2
  • FlyoutItem 3
  • FlyoutItem 4
  • FlyoutItem 5
  • MenuItem 1
  • MenuItem 2
  • MenuItem 3
  • MenuItem 4
  • MenuItem 5

Например, я хочу, чтобы MenuItem 1 находился под FlyoutItem 1и я никак не могу это сделать, кто-нибудь знает, как я могу отсортировать элемент, который не находится внутри FlyoutItem внутри этой структуры? Например, я хотел бы этот дизайн:

  • FlyoutItem 1
  • MenuItem 1
  • FlyoutItem 2
  • MenuItem 2
  • FlyoutItem 3
  • MenuItem 3
  • FlyoutItem 4
  • MenuItem 4
  • FlyoutItem 5
  • MenuItem 5

В настоящее время я могу упорядочить только одну структуру поверх другой, но не могу комбинировать и упорядочивать разные структуры друг от друга.

Это мой код: 

  <FlyoutItem Route="home" x:Name="flyoutItem"
        FlyoutDisplayOptions="AsSingleItem">
    <ShellContent Route="bottomtab1" Title="FlyoutItem 1"
                  Style="{StaticResource TabBackground}"
                  Icon="home_icon"
                  ContentTemplate="{DataTemplate views:x}" />
    <ShellContent Route="bottomtab2" Title="FlyoutItem 2"
                  Style="{StaticResource TabBackground}"
                  Icon="home_icon"
                  ContentTemplate="{DataTemplate DataTemplate views:x}" />
    <ShellContent Route="bottomtab3" Title="FlyoutItem 3"
                  Style="{StaticResource TabBackground}"
                  Icon="home_icon"
                  ContentTemplate="{DataTemplate DataTemplate views:x}" />
    <ShellContent Route="bottomtab4" Title="FlyoutItem 4"
                  Style="{StaticResource TabBackground}"
                  Icon="home_icon"
                  ContentTemplate="{DataTemplate DataTemplate views:x}" />
    <ShellContent Route="bottomtab5" Title="FlyoutItem 5"
                  Style="{StaticResource TabBackground}"
                  Icon="home_icon"
                  ContentTemplate="{DataTemplate DataTemplate views:x}" />
</FlyoutItem>

<MenuItem Text="MenuItem 1"
          IconImageSource="home_icon" />

<MenuItem Text="MenuItem 2"
          IconImageSource="home_icon" />

<MenuItem Text="MenuItem 3"
          IconImageSource="home_icon"/>

<MenuItem Text="MenuItem 4"
          IconImageSource="home_icon"/>

<MenuItem Text="MenuItem 5"
          IconImageSource="home_icon"/>

1 Ответ

0 голосов
/ 04 ноября 2019

Вы можете мульти FlyoutItem, как следующий код. 

<FlyoutItem Route="home" x:Name="flyoutItem"
        FlyoutDisplayOptions="AsSingleItem">
    <ShellContent Route="bottomtab1" Title="FlyoutItem 1"
                  Style="{StaticResource TabBackground}"
                  Icon="home_icon"
                  ContentTemplate="{DataTemplate views:x}" />
</FlyoutItem>

<MenuItem Text="MenuItem 1"
          IconImageSource="home_icon" />

<FlyoutItem Route="home" 
        FlyoutDisplayOptions="AsSingleItem">
    <ShellContent Route="bottomtab2" Title="FlyoutItem 2"
                  Style="{StaticResource TabBackground}"
                  Icon="home_icon"
                  ContentTemplate="{DataTemplate DataTemplate views:x}" />
</FlyoutItem>

<MenuItem Text="MenuItem 2"
          IconImageSource="home_icon" />

<FlyoutItem Route="home" 
        FlyoutDisplayOptions="AsSingleItem">
    <ShellContent Route="bottomtab3" Title="FlyoutItem 3"
                  Style="{StaticResource TabBackground}"
                  Icon="home_icon"
                  ContentTemplate="{DataTemplate DataTemplate views:x}" />
</FlyoutItem>

<MenuItem Text="MenuItem 3"
          IconImageSource="home_icon"/>
...