Search code examples
uwptemplate10

How to make overlay pane start at the top? (template10, UWP)

i use template10 for my UWP-App and need to achive that overlay pane starts at the most top. Do you have any ideas if it is possible?

What i have What i need

Solution

  • In template 10, it is designed so that the HamburgerButton is separated away from the SplitView, you can refer to the source code of HamburgerMenu.xaml. Take a blank Hamburger(Template 10) app's MainPage for example, you can comment out the controls:PageHeader and modify the controls:Resizer like so:

    <controls:Resizer x:Name="parameterResizer" Margin="16,16,16,0"
                  RelativePanel.AlignLeftWithPanel="True"
                  RelativePanel.AlignTopWithPanel="True">

    This will solve part of this problem, but it only scratches the surface of a problem, when the window's size is resized or when it runs on mobile, because of its built-in, unexposed-to-the-project style of template 10, this method will fail to make the HamburgerMenu open from the start of the page.

    If you're using Template 10, it's better to stick to use its HamburgerMenu, it will make the work easier. But if you insist to make it open from the start of the page, you can create your own SplitView which the HamburgerButton is inside of the SplitView, and together maybe your own navigation system for this.