Панель команд страницы перекрывает панель Splitview

На моей странице у меня есть нижняя панель команд, и если эта панель команд открыта, и пользователь щелкает меню SplitView, панель команд перекрывает меню.

Ниже приведен xaml страницы splitview:

<SplitView  x:Name="NavigationSplitView"
                    DisplayMode="CompactOverlay"
                    IsPaneOpen="True"
                    CompactPaneLength="{StaticResource ShellCompactPaneSize}"
                    OpenPaneLength="300"
                    PaneBackground="{ThemeResource SplitViewBackgroundBrush}"
                    >

               <!--//App root frame where all content data will be loaded-->
                <Frame x:Name="rootFrame" />



            <SplitView.Pane>
             ...
           </SplitView.Pane></SplitView>

Вот как я устанавливаю панель команд на моей странице содержимого, которая загружается в rootFrame разделенного просмотра:

 <Page.BottomAppBar>

    <CommandBar x:Name="AppCommandBar"
                Background="Transparent">
        <CommandBar.PrimaryCommands>
            <AppBarButton Name="Save"
                          Icon="Save"
                          Label="Save"></AppBarButton>
            <AppBarButton Name="Clear"
                          Icon="ClearSelection"
                          Label="Clear"></AppBarButton>
        </CommandBar.PrimaryCommands>
    </CommandBar>

</Page.BottomAppBar>

Пожалуйста, проверьте скриншот ниже, у меня есть Splitview с зеленым фоном, и вы можете видеть, что панель команд перекрывает его.

Снимок экрана с проблемой разделения экрана

Вот демонстрационное приложение onedrive ссылка


c# win-universal-app windows-10-universal
person Zea Shah    schedule 26.04.2016    source источник

Ответы (2)


arrow_upward
8
arrow_downward

Ваша страница контента должна выглядеть так

 <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <TextBlock FontSize="36"
                   Text="Content Page"
                   HorizontalAlignment="Center"
                   VerticalAlignment="Center"
                   Foreground="Black"></TextBlock>
        <CommandBar x:Name="AppCommandBar" VerticalAlignment="Bottom">
            <CommandBar.PrimaryCommands>
                <AppBarButton Name="Save"
                              Icon="Save"
                              Label="Save"></AppBarButton>
                <AppBarButton Name="Clear"
                              Icon="ClearSelection"
                              Label="Clear"></AppBarButton>
            </CommandBar.PrimaryCommands>
        </CommandBar>
    </Grid>
person Archana    schedule 26.04.2016

arrow_upward
3
arrow_downward

Удалите <Page.BottomAppBar>, переместите <CommandBar>....</CommandBar> в содержимое вашей страницы контента (в корневом фрейме).

person thang2410199    schedule 26.04.2016
comment
Как я могу переместить содержимое панели разделенного просмотра в корневой фрейм, оно действует как содержимое меню. - person Zea Shah; 26.04.2016
comment
что, стек над потоком испортил мой ответ. Отредактировал. Я не имел в виду, что вы должны вносить какие-либо изменения в структуру SplitView, просто чтобы что-то изменить на своей XAML-странице содержимого. - person thang2410199; 26.04.2016
comment
Хорошо, понял. Большое спасибо. - person Zea Shah; 26.04.2016
comment
Не могли бы вы проголосовать за мой ответ? К сожалению -1 :( - person thang2410199; 26.04.2016
comment
Я хотел бы это сделать, но не хватает репутации. - person Zea Shah; 26.04.2016