C# ContentControl赢了';不要使用数据模板
我有两个模型,我想表示为目录和文件。这两个模型都实现了一个包含属性C# ContentControl赢了';不要使用数据模板,c#,xaml,datatemplate,win-universal-app,uwp,C#,Xaml,Datatemplate,Win Universal App,Uwp,我有两个模型,我想表示为目录和文件。这两个模型都实现了一个包含属性字符串名{get;}的接口 public interface INode { string Name { get; } string Path { get; } } public class Directory : INode { public Directory(string name, string path) { this.Name = name; this.
字符串名{get;}
的接口
public interface INode
{
string Name { get; }
string Path { get; }
}
public class Directory : INode
{
public Directory(string name, string path)
{
this.Name = name;
this.Path = path;
}
public string Name { get; }
public string Path { get; }
}
public class File : INode
{
public File(string name, string path)
{
this.Name = name;
this.Path = path;
}
public string Name { get; }
public string Path { get; }
}
我创建了两个DataTemplates
,每个INode
实现一个。每个模板都有一个ContentControl
来呈现Path
,还有一个TextBlock
来呈现INode.Name
属性
<views:NavigationAwarePage
x:Class="OpenTasks.Views.ProviderDirectoryBrowserPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:views="using:OpenTasks.Views"
xmlns:models="using:OpenTasks.DomainLogic">
<views:NavigationAwarePage.Resources>
<DataTemplate x:Key="FolderIconTemplate">
<Path Data="M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z"
Fill="{StaticResource AppTint}"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Width="96"
Height="96">
<Path.RenderTransform>
<ScaleTransform ScaleX="2" ScaleY="2" />
</Path.RenderTransform>
</Path>
</DataTemplate>
<DataTemplate x:Key="FileIconTemplate">
<Path Data="M13,9H18.5L13,3.5V9M6,2H14L20,8V20A2,2 0 0,1 18,22H6C4.89,22 4,21.1 4,20V4C4,2.89 4.89,2 6,2M11,4H6V20H11L18,20V11H11V4Z"
Fill="{StaticResource AppTint}"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Width="96"
Height="96">
<Path.RenderTransform>
<ScaleTransform ScaleX="2" ScaleY="2" />
</Path.RenderTransform>
</Path>
</DataTemplate>
<DataTemplate x:DataType="models:Directory"
x:Key="DirectoryItemTemplate">
<StackPanel Orientation="Horizontal">
<ContentControl Content="{StaticResource FolderIconTemplate}" />
<TextBlock Text="{Binding Path=Name}" />
</StackPanel>
</DataTemplate>
<DataTemplate x:DataType="models:File"
x:Key="FileItemTemplate">
<StackPanel Orientation="Horizontal">
<ContentControl Content="{StaticResource FileIconTemplate}" />
<TextBlock Text="{Binding Path=Name}" />
</StackPanel>
</DataTemplate>
</views:NavigationAwarePage.Resources>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<ListView ItemsSource="{Binding Path=ContentsOfPath}" />
</Grid>
</views:NavigationAwarePage>
UWP
应用程序处理DataTemplate
s是否与WPF
不同?我注意到,如果不指定键,就无法定义模板,即使我指定了数据类型
。我不确定还有什么其他的差异可能会导致这个问题。在WPF应用程序中,这个确切的示例对我来说效果很好,因此这个问题特定于UWP
编辑
我不知道为什么我第一次尝试时它不起作用,但是模板选择器现在可以工作了。我不希望为每个可以支持多个模板的ContentControl
或ItemsControl
编写模板选择器。模板选择器是进入UWP
的唯一方法吗
<views:NavigationAwarePage
x:Class="OpenTasks.Views.ProviderDirectoryBrowserPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:views="using:OpenTasks.Views"
xmlns:models="using:OpenTasks.DomainLogic"
xmlns:viewModels="using:OpenTasks.ViewModels"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DataContext="viewModels:ProviderDirectoryBrowserViewModelDesignData">
<views:NavigationAwarePage.Resources>
<views:DirectoryListingTemplateSelector x:Key="DirectoryListingSelector"
FileTemplate="{StaticResource FileItemTemplate}"
DirectoryTemplate="{StaticResource DirectoryItemTemplate}" />
<DataTemplate x:Key="FolderIconTemplate">
<Path Data="M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z"
Fill="{StaticResource AppTint}"
HorizontalAlignment="Stretch"
VerticalAlignment="Center"
Width="24"
Height="24" />
</DataTemplate>
<DataTemplate x:Key="FileIconTemplate">
<Path Data="M13,9H18.5L13,3.5V9M6,2H14L20,8V20A2,2 0 0,1 18,22H6C4.89,22 4,21.1 4,20V4C4,2.89 4.89,2 6,2M11,4H6V20H11L18,20V11H11V4Z"
Fill="{StaticResource AppTint}"
HorizontalAlignment="Stretch"
VerticalAlignment="Center"
Width="24"
Height="24" />
</DataTemplate>
<DataTemplate x:DataType="models:Directory"
x:Key="DirectoryItemTemplate">
<StackPanel Orientation="Horizontal">
<ContentControl ContentTemplate="{StaticResource FolderIconTemplate}"
VerticalAlignment="Center"
Margin="0 0 10 0"/>
<TextBlock Text="{Binding Path=Name}"
VerticalAlignment="Center"/>
</StackPanel>
</DataTemplate>
<DataTemplate x:DataType="models:File"
x:Key="FileItemTemplate">
<StackPanel Orientation="Horizontal">
<ContentControl ContentTemplate="{StaticResource FileIconTemplate}"
Margin="0 0 10 0"
VerticalAlignment="Center"/>
<TextBlock Text="{Binding Path=Name}"
VerticalAlignment="Center"/>
</StackPanel>
</DataTemplate>
</views:NavigationAwarePage.Resources>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<ListView ItemsSource="{Binding Path=ContentsOfPath}"
ItemTemplateSelector="{StaticResource DirectoryListingSelector}" />
</Grid>
</views:NavigationAwarePage>
我想说有几种方法可以解决这个问题。在您的情况下,我会尝试使用自定义转换器并将您的图标模板分配给它 转换器可能看起来像:
public class FileIconConverter : IValueConverter
{
public DataTemplate FileIconTemplate { get; set; }
public DataTemplate FolderIconTemplate { get; set; }
public object Convert(object value, Type targetType, object parameter, string language)
{
if (value is Directory)
{
return this.FolderIconTemplate;
}
if (value is File)
{
return this.FileIconTemplate;
}
return null;
}
public object ConvertBack(object value, Type targetType, object parameter, string language)
{
throw new NotImplementedException();
}
}
然后,在页面资源中,创建转换器并分配图标模板:
<local:FileIconConverter x:Key="FileIconConverter">
<local:FileIconConverter.FileIconTemplate>
<DataTemplate>
<Path Data="M13,9H18.5L13,3.5V9M6,2H14L20,8V20A2,2 0 0,1 18,22H6C4.89,22 4,21.1 4,20V4C4,2.89 4.89,2 6,2M11,4H6V20H11L18,20V11H11V4Z"
Fill="{StaticResource AppTint}"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Width="96"
Height="96">
<Path.RenderTransform>
<ScaleTransform ScaleX="2" ScaleY="2" />
</Path.RenderTransform>
</Path>
</DataTemplate>
</local:FileIconConverter.FileIconTemplate>
<local:FileIconConverter.FolderIconTemplate>
<DataTemplate>
<Path Data="M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z"
Fill="{StaticResource AppTint}"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Width="96"
Height="96">
<Path.RenderTransform>
<ScaleTransform ScaleX="2" ScaleY="2" />
</Path.RenderTransform>
</Path>
</DataTemplate>
</local:FileIconConverter.FolderIconTemplate>
</local:FileIconConverter>
最后,在listview中,绑定数据并使用转换器:
<ListView x:Name="ListView">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<ContentControl ContentTemplate="{Binding Converter={StaticResource FileIconConverter}}"
Margin="0 0 10 0"
VerticalAlignment="Center"/>
<TextBlock Text="{Binding Path=Name}"
VerticalAlignment="Center"/>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
我想说有几种方法可以解决这个问题。在您的情况下,我会尝试使用自定义转换器并将您的图标模板分配给它 转换器可能看起来像:
public class FileIconConverter : IValueConverter
{
public DataTemplate FileIconTemplate { get; set; }
public DataTemplate FolderIconTemplate { get; set; }
public object Convert(object value, Type targetType, object parameter, string language)
{
if (value is Directory)
{
return this.FolderIconTemplate;
}
if (value is File)
{
return this.FileIconTemplate;
}
return null;
}
public object ConvertBack(object value, Type targetType, object parameter, string language)
{
throw new NotImplementedException();
}
}
然后,在页面资源中,创建转换器并分配图标模板:
<local:FileIconConverter x:Key="FileIconConverter">
<local:FileIconConverter.FileIconTemplate>
<DataTemplate>
<Path Data="M13,9H18.5L13,3.5V9M6,2H14L20,8V20A2,2 0 0,1 18,22H6C4.89,22 4,21.1 4,20V4C4,2.89 4.89,2 6,2M11,4H6V20H11L18,20V11H11V4Z"
Fill="{StaticResource AppTint}"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Width="96"
Height="96">
<Path.RenderTransform>
<ScaleTransform ScaleX="2" ScaleY="2" />
</Path.RenderTransform>
</Path>
</DataTemplate>
</local:FileIconConverter.FileIconTemplate>
<local:FileIconConverter.FolderIconTemplate>
<DataTemplate>
<Path Data="M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z"
Fill="{StaticResource AppTint}"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Width="96"
Height="96">
<Path.RenderTransform>
<ScaleTransform ScaleX="2" ScaleY="2" />
</Path.RenderTransform>
</Path>
</DataTemplate>
</local:FileIconConverter.FolderIconTemplate>
</local:FileIconConverter>
最后,在listview中,绑定数据并使用转换器:
<ListView x:Name="ListView">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<ContentControl ContentTemplate="{Binding Converter={StaticResource FileIconConverter}}"
Margin="0 0 10 0"
VerticalAlignment="Center"/>
<TextBlock Text="{Binding Path=Name}"
VerticalAlignment="Center"/>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
这与使用数据模板选择器有何不同?我想知道为什么您会使用convert来处理模板之间的切换,而不是模板选择器。原因有两个:1/性能:使用datatemplateselector会杀死项目回收,因为它会阻止缓存(),尽管可以说我的解决方案也需要实现模板,即使它们更小,2/可维护性:我没有复制主项目模板,因此添加更多图标类型更容易。您可以通过绑定路径的数据
而不是整个控件来进一步推进这个概念,这与使用数据模板选择器
有什么区别?我想知道为什么您会使用convert来处理模板之间的切换,而不是模板选择器。原因有两个:1/性能:使用datatemplateselector会杀死项目回收,因为它会阻止缓存(),尽管可以说我的解决方案也需要实现模板,即使它们更小,2/可维护性:我没有复制主项目模板,因此添加更多图标类型更容易。通过绑定路径的数据
,而不是整个控件,可以进一步推进这个概念