• App button alignment in BottomAppBar


    Expected BottomeAppBar Style:

    For a long time, I have problem with the button alignment in bottomAppBar. If we have more than one buttons, I knew we need to add them to a stackpanel, and there only could be one stackpanel be added directly under <AppBar></AppBar>. Therefore if I want to let some buttons be aligned to the left corner and some be aligned to the right corner, I just cannot let the buttons display as I wished.

    My mind is limited to StackPanel that I forgot we can add Grid to the AppBar, then in the grid, we can add more than one StackPanels. So there we are, we now can let some buttons be left aligned and some be right aligned.

    Refer Code as below:

        <Page.BottomAppBar>
            <AppBar>
                <Grid>
                    <StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
                        <Image x:Name="itemImage" Source="Assets/SmallLogo.png" Width="50" Height="50" Margin="20,0,0,0" HorizontalAlignment="Left" DoubleTapped="itemImage_DoubleTapped" />
                    </StackPanel>
                    <StackPanel HorizontalAlignment="Right" Orientation="Horizontal">
                        <Button x:Name="btPicture" HorizontalAlignment="Right" Margin="0,0,10,0" Style="{StaticResource PicturesAppBarButtonStyle}" Height="84" VerticalAlignment="Bottom" />
                        <Button x:Name="btSettings" HorizontalAlignment="Right" Margin="0,0,30,0" Style="{StaticResource SettingsAppBarButtonStyle}" />
                    </StackPanel>
                </Grid>
            </AppBar>
        </Page.BottomAppBar>
  • 相关阅读:
    Windows命令处理进程
    Linux 文件权限管理
    Linux 用户与用户组管理
    Linux 文件类型及操作
    快速了解必要的网络知识
    SSH免密码登录
    用SSH访问内网主机的方法
    MongoDB与PostgresQL无责任初步测试
    SpringMVC的Action在同一时间里只允许同一个浏览器的单次进入?
    Netty5使用自签证书实现SSL安全连接
  • 原文地址:https://www.cnblogs.com/qixue/p/2826698.html
Copyright © 2020-2023  润新知