Как сделать CommandBar открытым в нижней части экрана?

Question

У меня есть, что, вероятно, глупое сомнение, но я действительно не знаю, как это исправить.

У меня есть сложный интерфейс с множеством элементов внутри него (SplitView с другими вещами внутри него, а затем с рамкой, где хранится страница, где у меня есть сетка и, наконец, мой CommandBar).

Когда я нажимаю на кнопку «...», CommandBar открывается в верхней части окна, а также фактически покрывает часть UI за пределами кадра, где находится его родительская страница (я не знаю Не знаю, как это возможно.

Я попытался установить свойство VerticalAlignment как CommandBar, так и родительскую сетку, страницу и т. Д., Но CommandBar по-прежнему открывается к верхнему сверху.

Есть ли способ его открытым к низу, так же, как CommandBar в встроенный погоды или приложение фото? У меня отсутствует настройка/свойство здесь?

Благодарим за помощь!

Sergio

Edit: просто быть ясно, базовая структура для моей страницы что-то вроде этого:

RootContent > ... > Frame > Page > Grid > CommandBar 

Я не может поставить CommandBar внутри Page.TopAppBar как будто я делаю это, CommandBar получает за пределами моей страницы и охватывает верхнюю часть моего пользовательского интерфейса. Мне нужно, чтобы CommandBar находился в внутри Страница.

Answer 1

CommandBar полагается на VisualStates для управления этой частью своих измерений и анимаций, что упрощает использование настраиваемого диспетчера визуальных состояний для перехвата вызовов изменения состояния и замены всех вызовов OpenUp на OpenDown.

public class OpenDownCommandBarVisualStateManager : VisualStateManager 
{ 
    protected override bool GoToStateCore(Control control, FrameworkElement templateRoot, string stateName, VisualStateGroup group, VisualState state, bool useTransitions) 
    { 
     //replace OpenUp state change with OpenDown one and continue as normal 
     if(!string.IsNullOrWhiteSpace(stateName) && stateName.EndsWith("OpenUp")) 
     { 
      stateName = stateName.Substring(0, stateName.Length - 6) + "OpenDown"; 
     } 
     return base.GoToStateCore(control, templateRoot, stateName, group, state, useTransitions); 
    } 
} 

public class OpenDownCommandBar : CommandBar 
{ 
    public OpenDownCommandBar() 
    { 
    } 

    protected override void OnApplyTemplate() 
    { 
     base.OnApplyTemplate(); 
     var layoutRoot = GetTemplateChild("LayoutRoot") as Grid; 
     if(layoutRoot != null) 
     { 
      VisualStateManager.SetCustomVisualStateManager(layoutRoot, new OpenDownCommandBarVisualStateManager()); 
     } 
    } 
} 

Тогда просто используйте новый OpenDownCommandBar вместо обычного.

<myControls:OpenDownCommandBar>...</myControls:OpenDownCommandBar> 

Answer 2

Как вы определяете свою панель команд? Есть два способа сделать это:

<Page.BottomAppBar> 
    <CommandBar> 
    .... 
    </CommandBar> 
</Page.BottomAppBar> 

Или наоборот ..

<Page.TopAppBar> 
    <CommandBar> 
    .... 
    </CommandBar> 
</Page.TopAppBar> 

В вашем случае, если вы хотели бы использовать бывшие и убедитесь, что ваш AppBar не в каких-либо других контейнерах.

Answer 3

Вы используете командную строку для чего-то, для чего он не предназначен. Он должен покрывать содержание страницы при отображении.

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