在BottomAppBars中添加不同的App.xaml

Question

如何在BottomAppBar中添加不同的App.xaml？我需要在相同或不同的页面中动态加载不同的BottomAppBar，所以我想将它们添加到App.xaml中。

例如，在xaml中有两个BottomAppBars：

PageBottomAppBar1

<Page.BottomAppBar>
    <CommandBar Name="PageBottomAppBar1">
        <CommandBar.PrimaryCommands>
            <AppBarButton Label="new" 
                          Icon="Page" 
                          Command="{Binding AddCommand, Mode=OneWay}"/>
            <AppBarButton Label="search" 
                          Icon="Find" />
        </CommandBar.PrimaryCommands>

        <CommandBar.SecondaryCommands>
            <AppBarButton Name="Logout" 
                          Label="Logout" 
                          Command="{Binding LogoutCommand, Mode=OneWay}" />
        </CommandBar.SecondaryCommands>
    </CommandBar>
</Page.BottomAppBar>

PageBottomAppBar2

<Page.BottomAppBar>
    <CommandBar Name="PageBottomAppBar2">
        <CommandBar.PrimaryCommands>
            <AppBarButton Label="sync" 
                          Icon="Sync" 
                          Command="{Binding SyncCommand, Mode=OneWay}"/>
            <AppBarButton Label="search" 
                          Icon="Find" />
        </CommandBar.PrimaryCommands>

        <CommandBar.SecondaryCommands>
            <AppBarButton Name="About" 
                          Label="About" 
                          Command="{Binding AboutCommand, Mode=OneWay}" />
        </CommandBar.SecondaryCommands>
    </CommandBar>
</Page.BottomAppBar>

如何将它们添加到App.xaml中以便将它们作为资源使用？

下面是App.xaml：

<Application x:Class="Test.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:Test">
<Application.Resources>
  <vm:ViewModelLocator x:Key="Locator" xmlns:vm="using:Test.ViewModel" />

</Application.Resources>
</Application>

Answer 1

只是一个想法，但是如何定义从IObservableVector继承的类：

public class CommandBarContent : IObservableVector<ICommandBarElement> {}

然后在XAML

<cb:CommandBarContent x:Key="FirstPrimaryBar">
    <AppBarButton Label="new" 
                      Icon="Page" 
                      Command="{Binding AddCommand, Mode=OneWay}"/>
    <AppBarButton Label="search" 
                      Icon="Find" />
</cb:CommandBarContent>

添加一个选择器/转换器(以http://tech.pro/tutorial/807/wpf-tutorial-how-to-use-a-datatemplateselector为例)

<cb:MyCommandSelector x:Key="CommandSelector" Case1="{StaticResource FirstPrimaryBar}" Case2="{StaticResource SecondPrimaryBar}" />

然后绑定命令栏：

<CommandBar Name="PageBottomAppBar1" PrimaryCommands="{Binding ScenarioParameter,Converter={StaticResource CommandSelector}}">

我还没有试过，但取决于可能的方案的数量，这可能是我将使用的解决方案。

另一个选项是绑定按钮的可见性属性，对于delete按钮，我已经这样做了，但是该按钮在更改场景时具有“跳转”行为，这有点奇怪。

Answer 2

您可以创建一个从AppBar继承的类

public class MyAppBar : AppBar
{
    public MyAppBar() 
    { 
    }

    //...
}

然后你就可以像这样使用它：

<Page.BottomAppBar>
    <local:MyAppBar />
</Page.BottomAppBar>

不幸的是，在这种情况下，XAML将不可用。

为了能够使用XAML，您可以创建一个UserControl

MyCustomAppBar.xaml

<ctrls:AppBar
    x:Class="App1.MyCustomAppBar"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:ctrls="using:Windows.UI.Xaml.Controls"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">

    <Grid>

    </Grid>
</ctrls:AppBar>

MyCustomAppBar.xaml.cs

using Windows.UI.Xaml.Controls;

namespace App1
{
    public sealed partial class MyCustomAppBar : AppBar
    {
        public MyCustomAppBar()
        {
            this.InitializeComponent();
        }
    }
}