UWP动态页面

Question

我有一个UWP应用程序，将管理3个实体(类别，板块，菜单)。我为每个实体提供了一个视图模型，并提供了一个视图模型列表来选择要管理的实体。所以我希望当我在视图模型列表中选择一个实体时，页面中的usercontrol是动态加载的。

我试图进行内容控制，但它不起作用。

我的xaml代码是：

<ListBox Grid.Row="1" ItemsSource="{Binding ConfigurationItems}" 
             SelectedItem="{Binding ConfigurationItemSelected, Mode=TwoWay}">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding Path=ConfigurationAbstract}"/>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

    <StackPanel Grid.Row="1" Grid.Column="1" Margin="10,0,0,0">
        <TextBlock Text="{Binding Path=ConfigurationItemSelected.ConfigurationAbstract}" Style="{StaticResource TitleTextBlockStyle}"/>

        <Grid  Grid.Row="1"  Grid.Column="1" 
               Visibility="{Binding ImportVisible, Converter={StaticResource b2v} }"
               >
            <Grid.RowDefinitions>
                <RowDefinition Height="40"></RowDefinition>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="75*"></ColumnDefinition>
                <ColumnDefinition Width="25*"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <StackPanel Grid.Column="0" Orientation="Horizontal" VerticalAlignment="Center">
                <TextBlock  Text="File Importato: "/>
                <TextBlock  Text="{Binding Path= ConfigurationItemSelected.ImportedFilePathName}"/>
            </StackPanel>
            <StackPanel Grid.Column="1" Orientation="Horizontal">
                <Button Content="Scegli..." Command="{Binding Path=ConfigurationItemSelected.ChooseCommand}" Margin="5,0"></Button>
                <Button Content="Importa" Command="{Binding Path=ConfigurationItemSelected.ImportCommand}" Margin="5,0"></Button>
            </StackPanel>
        </Grid>
        <ContentControl Content="{Binding Path=ConfigurationItemSelected}"/>
    </StackPanel>

感谢您的问候

我已经用以下命令更新了代码：

<Page.Resources>
        <DataTemplate  x:DataType="vm:CategoriesViewModel" x:Key="Categorie">
            <controls:UcCategories DataContext="{Binding Path=ConfigurationItemSelected}" />
        </DataTemplate>
        <DataTemplate   x:DataType="vm:MenuItemsViewModel" x:Key="Menu">
            <controls:UcMenu  DataContext="{Binding Path=ConfigurationItemSelected}"  />
        </DataTemplate>
        <DataTemplate   x:DataType="vm:PlatesViewModel" x:Key="Piatti">
            <controls:UcPlates  DataContext="{Binding Path=ConfigurationItemSelected}"  />
        </DataTemplate>

    </Page.Resources>

<ContentControl Content="{Binding Path=ConfigurationItemSelected}">

            </ContentControl>

但是不能再工作了..。

Answer 1

您必须创建一个DataTemplateSelector，您可以在其中根据某种逻辑(目前是数据的类型)来决定将哪个模板应用于ContentControl。

选择器：

public class MyDataTemplateSelector : DataTemplateSelector
{
    public DataTemplate CategoryTemplate { get; set; }
    public DataTemplate MenuTemplate { get; set; }
    public DataTemplate PlateTemplate { get; set; }

    protected override DataTemplate SelectTemplateCore(object item, DependencyObject container)
    {
        if (item is CategoriesViewModel)
        {
            return CategoryTemplate;
        }
        else if (item is MenuItemsViewModel)
        {
            return MenuTemplate;
        }
        else if (item is PlatesViewModel)
        {
            return PlateTemplate;
        }
        else
        {
            return base.SelectTemplateCore(item);
        }
    }
}

XAML：

<Page.Resources>
    <DataTemplate  x:DataType="vm:CategoriesViewModel" x:Key="Categorie">
        <controls:UcCategories DataContext="{Binding Path=ConfigurationItemSelected}" />
    </DataTemplate>
    <DataTemplate   x:DataType="vm:MenuItemsViewModel" x:Key="Menu">
        <controls:UcMenu  DataContext="{Binding Path=ConfigurationItemSelected}"  />
    </DataTemplate>
    <DataTemplate   x:DataType="vm:PlatesViewModel" x:Key="Piatti">
        <controls:UcPlates  DataContext="{Binding Path=ConfigurationItemSelected}"  />
    </DataTemplate>

    <local:MyDataTemplateSelector x:Key="TemplateSelector"
                                  CategoryTemplate="{StaticResource Categorie}"
                                  MenuTemplate="{StaticResource Menu}"
                                  PlateTemplate="{StaticResource Piatti}"/>
</Page.Resources>

<ContentControl Content="{Binding Path=ConfigurationItemSelected}" 
                ContentTemplateSelector="{StaticResource TemplateSelector}"/>