Xamarin.forms: [Melhoria] Adicionar FlyoutItem.IsVisible, Tab.IsVisible, BaseShellItem.IsVisible

Criado em 13 fev. 2019  ·  26Comentários  ·  Fonte: xamarin/Xamarin.Forms

Resumo

Forneça propriedades anexadas para que os usuários possam definir mais diretamente se algo está visível no Flyout ou na TabBar.

Sugestões de API futuras

Devemos adicionar opções para que os usuários usem FlyoutDisplayOptions="AsMultipleItems" para que possam optar por exibir o pai como um cabeçalho. Com o controle de expansão, também podemos adicionar isso como uma configuração.

API

```C#
FlyoutItem.IsVisible //Propriedade anexada à BP
Tab.IsVisible //Propriedade BP anexada
BaseShellItem.IsVisible // BP (propriedade não anexada)

## Examples BaseShellItem.IsVisible 

If you set BaseShellIitem IsVisible to false it won't show up in the Flyout or on any of the tabs

## Examples Tab.IsVisible

```xaml
<TabBar>
    <Tab Title="Tab 1">
          <ShellContent Title="Top Tab 1" />
          <ShellContent Title="Top Tab 2"  Tab.IsVisible="false"/>
          <ShellContent Title="Top Tab 3" />
    </Tab>
    <Tab Title="Tab 2" Tab.IsVisible="false">
    </Tab>
</TabBar>

Exemplos FlyoutItem.IsVisible

Os usuários desejam um Flyout que não reflita nenhuma das guias na tela.

<MenuItem title="item 1 "/>
<MenuItem title="item 2" />
<MenuItem title="item 3" />
<TabBar Shell.FlyoutBehavior="Flyout" FlyoutItem.IsVisible="False">
    <Tab>
    </Tab>
</TabBar>

Renderiza 3 itens desdobráveis

  • Item 1
  • Item 2

- Item 3

<FlyoutItem title="item 1 " />
<FlyoutItem title="item 2" />
<ShellContent title="Content" FlyoutItem.IsVisible="False" />

Renderiza 2 itens de flyout mesmo se você estiver no elemento ShellContent

  • Item 1
  • Item 2

Caso de uso pretendido

O caso de uso que tenho em mente é ter um item no menu Hambúrguer para o usuário atualizar o app para Premium. Depois que o usuário tiver atualizado, o item não deverá mais estar visível.
Pai: #2415

shell in-progress high impact proposal-accepted enhancement ➕

Comentários muito úteis

Por favor, poderíamos obter uma atualização sobre isso? (realmente, realmente quero isso!)

Todos 26 comentários

alguma atualização disso?

@PureWeen Eu vi você usando isso no Xam Dev Summit, isso está em um Pre ou algo assim?

Outro caso de uso pretendido é quando um conjunto de recursos (usado com frequência) deve estar visível na barra de guias inferior e outro conjunto de recursos (configurações, restaurar compras, ajuda, sobre, etc.) deve estar acessível no menu de hambúrguer. Se isso já for possível, por favor me avise.

Por favor, poderíamos obter uma atualização sobre isso? (realmente, realmente quero isso!)

ressalto

Realmente preciso disso

alguma atualização disso?

Qualquer atualização? Nós realmente precisamos disso.

alguma atualização disso?

Shell é praticamente inútil, a menos que você esteja criando um aplicativo muito pequeno. Sem isso, não podemos definir permissões ou ocultar páginas que não queremos no submenu. Como isso não é uma prioridade agora?

Tem razão @brepetti
Estou me perguntando se estou faltando alguma coisa aqui...

@rodrigojuarez @brepetti

A parte engraçada é que no XDS do ano passado foi discutido como um item que estaria em breve... Até um ponto em que eles mostraram.

Acho que isso provavelmente acabou sendo um bloqueador por causa de como está lidando com a pilha de navegação. Porque eu sei que o exemplo mostrado no XDS estava usando uma pilha de navegação principalmente personalizada/reconstruída.

Consegui fazê-lo funcionar para TabBar Top Tabs com uma solução manual criando os itens ShellContent manualmente (adicionando, removendo). No Xamarin.Forms 4.6 agora também está funcionando para iOS (apenas corrigido 1 dia atrás no 4.6).

Deve funcionar para o Menu de Hambúrguer também?

@malte1989 Sim, estamos falando de um item de shell, também conhecido como algo que está na árvore visual do shell.

@malte1989 você poderia fornecer algum código de exemplo?

@malte1989 você poderia fornecer algum código de exemplo?

Claro, vou postar o código para minha solução de tabbar amanhã.

@Jakar510

AppShell.xaml

<TabBar Route="tabBar">
        <Tab 
            x:Name="myTab" 
            Route="tab1"
            Icon="tab_icon1.png">
            <ShellContent 
                x:Name="shellStart"
                Route="route1A" 
                Title="title" 
                ContentTemplate="{DataTemplate view:Page1A}" />
        </Tab>
        <Tab 
            Route="tab2"
            Icon="tab_icon2.png">
            <ShellContent 
                Route="route2" 
                Title="title2" 
                ContentTemplate="{DataTemplate view:Page2}" />
        </Tab>
        </Tab>
        <Tab 
            Route="tab3"
            Icon="tab_icon3.png">
            <ShellContent 
                Route="route3" 
                Title="title3" 
                ContentTemplate="{DataTemplate view:Page3}" />
        </Tab>
    </TabBar>

AppShell.xaml.cs

public ShellContent shell0;
public ShellContent shell1;
public ShellContent shell2;
public ShellContent shell3;
public static Tab tabLocal;

construtor

            tabLocal = myTab;
            shell0 = shellStart;
            shell1 = new ShellContent()
            {
                Content = new Page1B(),
                Title = "",
                Route = ""
            };
            shell2 = .... Page1C() ...
            shell3 = .... Page1D() ...
            ...

Mudando a página 0 para 1

AppShell.tabLocal.Items.Add(shell1);
AppShell.tabLocal.Items.Remove(shell0);

Talvez você precise desses dois métodos para lidar com sua navegação

protected async override void OnNavigating(ShellNavigatingEventArgs args)
protected override void OnNavigated(ShellNavigatedEventArgs args)

Espero que isso ajude você. Por favor, deixe-me uma nota se isso funciona para você.

Eu estarei trabalhando nisso para 4.7/4.8

Atualizei a especificação se alguém quiser comentar

@PureWeen Não, mas espero que, quando você começar a trabalhar nisso, publique a transmissão do twitch para que possamos nos certificar de sintonizar 👍

Eu estarei trabalhando nisso para 4.7/4.8
Atualizei a especificação se alguém quiser comentar

Desculpe a pergunta idiota: onde posso encontrar e ler as especificações?

@ncarandini Acabei de atualizar a descrição deste problema com a especificação

Sim, obrigado!

Eu acredito que encontrei uma solução para isso (por enquanto).
Fazem isto:

  • dê um nome ao seu flyoutitem ou itens, por exemplo
    <FlyoutItem Title="Self Review" x:Name="fiSelf"> <FlyoutItem.Icon> <FontImageSource FontFamily="{StaticResource sapcIconFont}" Glyph="{StaticResource IconUser}" Color="{StaticResource IconColor}"/> </FlyoutItem.Icon> <ShellContent> <viewsAssess:StartSelfPage /> </ShellContent> </FlyoutItem>

  • substituir o OnBindingContextChanged em AppShell.cs e adicionar código para verificar a condição de ocultar e mostrar e chamar o método Clear na propriedade Items do flyitem
    protected override void OnBindingContextChanged() { base.OnBindingContextChanged(); if(App.IsIntern) { fiAssess.Items.Clear(); fiPeer.Items.Clear(); fiSelf.Items.Clear(); fiVerifications.Items.Clear(); } }

funciona para mim

fechado por #10980

Isso ainda está se comportando de forma estranha, sempre que alteramos dinamicamente a propriedade IsVisible em um BaseShellItem, de vez em quando o estilo de um ShellContent se perde. Empurrar uma página em cima do conteúdo do shell e, em seguida, exibi-la parece corrigi-lo.

Um exemplo seria ter 2 páginas, o conteúdo do shell X tem um botão que altera uma propriedade booleana que está vinculada à propriedade IsVisible no conteúdo do shell Y

@GeorgeVelikov você pode registrar um problema?

Esta página foi útil?
0 / 5 - 0 avaliações