Mostrar menú lateral usando BottomAppBar

Question

Estoy intentando mostrar un menú desplegable simple (con contenido informativo) cuando se presiona un AppBarToggleButton dentro de BottomAppBar, pero mi solución no funciona.:(

Este es mi código:

<Page.BottomAppBar>
        <CommandBar>
            <AppBarToggleButton x:Uid="MapPageAppBarLegend" Label="" Icon="List">
                <FlyoutBase.AttachedFlyout>
                    <Flyout>
                        <TextBlock Text="Informations here..."/>
                    </Flyout>
                </FlyoutBase.AttachedFlyout>
            </AppBarToggleButton>
        </CommandBar>
</Page.BottomAppBar>

No aparece nada..¿Alguien puede ayudarme a mostrar este diseño?Muchas gracias y perdón por mi idioma inglés.:)

pame

Answer 1

Todo está muy claramente descrito. en MSDN (también hay un muy buen ejemplo allí):

No aparece nada porque Menús desplegables se abre automáticamente sólo para los botones (y Botón de alternancia de la barra de aplicaciones no deriva de Button clase):

Un menú lateral adjunto a un botón se abre automáticamente cuando el usuario hace clic en el botón.No es necesario gestionar ningún evento para abrir el menú lateral.(Esto incluye controles derivados de Button, como AppBarButton

Por supuesto que puedes agregar un Flyout a cualquier FrameworkElement pero tendrás que abrirlo manualmente:

Puede adjuntar un control Flyout a cualquier objeto FrameworkElement utilizando la propiedad adjunta FlyoutBase.AttachedFlyout.Si lo hace, debe responder a una interacción en FrameworkElement, como el evento Tapped, y abrir el menú desplegable en su código.

En XAML: define tu Flyout en Recursos y adjúntelo al botón:

<Page.Resources>
    <Flyout x:Key="myFlyout" Placement="Top">
        <TextBlock Text="Informations here..."/>
    </Flyout>
</Page.Resources>
<Page.BottomAppBar>
    <CommandBar>
        <AppBarToggleButton x:Uid="MapPageAppBarLegend" Label="First" Icon="List"
                            FlyoutBase.AttachedFlyout="{StaticResource myFlyout}"
                            Click="AppBarToggleButton_Click"/>                
    </CommandBar>
</Page.BottomAppBar>

Y evento en el código detrás:

private void AppBarToggleButton_Click(object sender, RoutedEventArgs e)
{
    FlyoutBase.ShowAttachedFlyout((FrameworkElement)sender);  
}