Всплывающее окно перекрывает панель приложений

Я пытаюсь показать полноэкранное всплывающее окно вместе с панелью приложений. Для этого я использую такой код:

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Button Name="myButton" Content="Show PopUP" Click="myButton_Click"/>
    <Popup x:Name="myPopup">
        <Grid Name="PopupsGrid" Background="ForestGreen">
            <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="This is my PopUp"/>
        </Grid>
    </Popup>
</Grid>

<Page.BottomAppBar>
    <CommandBar>
        <AppBarButton Label="Done" Icon="Setting"/>
        <CommandBar.SecondaryCommands>
            <AppBarButton Label="Command"/>
        </CommandBar.SecondaryCommands>
    </CommandBar>
</Page.BottomAppBar>

private void myButton_Click(object sender, RoutedEventArgs e)
{
    var bounds = Windows.UI.ViewManagement.ApplicationView.GetForCurrentView().VisibleBounds;

    PopupsGrid.Height = bounds.Height - 25; // to show the problem - normally we can substract BottomAppBar.Height
    PopupsGrid.Width = bounds.Width;
    myPopup.IsOpen = true;
}

Я понял, что мы можем использовать ApplicationView.GetForCurrentView().VisibleBounds для вычисления желаемой высоты. Пока все хорошо, но когда я открываю всплывающее окно, оно перекрывает панель приложения (см. рисунок 2). С другой стороны, когда мы открываем панель приложений, кажется, что она частично перекрывается (см. рисунок 3).

всплывающие окна

Я тестировал его как на настольном компьютере, так и на мобильном устройстве, и возникает одна и та же проблема.

Я что-то упускаю? Как разместить панель приложения над всплывающим окном?


c# windows-10 uwp popup windows-10-mobile
person Romasz    schedule 24.10.2015    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Я не думаю, что мы можем убедиться, что панель команд всегда находится над всплывающим окном. Команда всплывающего окна, которую вы видели на третьем снимке экрана, на самом деле является элементом управления всплывающим окном, поэтому в этом сценарии она может быть выше «myPopup». Но если вы установите для IsSticky и IsOpen панели команд значение true, когда вы нажмете кнопку для отображения всплывающего окна, всплывающая команда будет скрыта. Всплывающие окна следуют этому правилу: последние вверху.

Что касается проблемы «частично перекрывающихся», вместо того, чтобы делать всплывающее окно полноэкранным, я думаю, мы можем динамически изменять высоту всплывающего окна в зависимости от высоты командной панели.

Одна вещь, которую вы можете не заметить, это то, что высота LayoutRoot(Child of CommandBar) больше, чем у CommandBar. Проверяя стиль CommandBar по умолчанию, вы можете обнаружить, что он использует Grid.Clip и RectangleGeometry.Transform для управления размером панели команд, которую мы видим. Вы также можете проверить это в живом визуальном дереве в VS. В моем случае фактическая высота mycommandbar равна 48, а фактическая высота LayoutRoot — 60.

введите здесь описание изображения

Поэтому в качестве обходного пути в компактном режиме мы можем динамически изменять высоту «myPopup», прослушивая свойство IsOpen панели команд. Если IsOpen = true, вычтите высоту LayoutRoot (60), если IsOpen = false, вычтите высоту CommandBar (48).

Это работает для меня.

person Alan Yao - MSFT    schedule 09.11.2015
comment
Похоже, панель приложений сильно изменилась по сравнению с WP8.1. Кажется, теперь можно редактировать весь шаблон и все такое - это хорошо. Странно то, что ActualHeight командной панели не изменяется при открытии панели - вам нужно использовать помощник визуального дерева, чтобы получить layoutroot и проверить его высоту, интересно, почему это так - у вас есть идеи? Тем не менее, в своем ответе вам, вероятно, следует изменить 60 на 64 - в открытии вы получите 60, но как только оно откроется, вы получите 64. - person Romasz; 09.11.2015

arrow_upward
-1
arrow_downward

Попробуйте дать вашему макету отступы?

person Stefan van de Laarschot    schedule 24.10.2015
comment
Панель приложений должна быть над «всем», как показано на третьем снимке экрана, это почти работает. Куда поставить эту прокладку? Ты это пробовал? - person Romasz; 25.10.2015