UWP 动态页面答案

【问题标题】：UWP dynamically pageUWP 动态页面
【发布时间】：2016-12-25 00:31:23
【问题描述】：

我有一个 UWP 应用程序，它将管理 3 个实体（类别、板、菜单）。我有每个实体的视图模型和一个视图模型列表来选择要管理的实体。所以我希望当我在页面中的视图模型列表中选择一个实体时，动态加载用户控件。

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

我的 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>

但无法再次工作......

【问题讨论】：

将 ContentTemplate 添加到您的 ContentControl 并使 ContentControl 的内容绑定 OneWay
你有例子吗？
您可以将 ContentTemplate 设置为包含您的 UserControl 的 DataTemplate，就像您在 ListBox 的 ItemTemplate 中所做的那样

标签： c# wpf mvvm uwp

【解决方案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}"/>

【讨论】：