我在UWP中为GridView生成的项目创建了一个自定义数据模板。这是截图:
以下是XAML代码:
<DataTemplate x:Key="FileExplorer_FolderItem">
<Grid x:Name="FileExplorer_Item" MaxWidth="0" MaxHeight="0" Margin="0" MinWidth="450" MinHeight="250" RequestedTheme="Dark">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Border x:Name="PathBorder" BorderThickness="2" Grid.RowSpan="2">
<Border.BorderBrush>
<SolidColorBrush Color="{StaticResource Jet}"/>
</Border.BorderBrush>
</Border>
<Grid x:Name="Header" Grid.RowSpan="2">
<Image x:Name="ThumbnailImage" Source="{Binding Thumb}" Stretch="UniformToFill"/>
</Grid>
<Grid x:Name="Footer" Grid.Row="1">
<Grid.Background>
<SolidColorBrush Color="#FF343434"/>
</Grid.Background>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid x:Name="PathGrid">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock x:Name="Name" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding Storage_item.DisplayName}" VerticalAlignment="Top" Margin="10,10,0,0" FontSize="15" LineHeight="20"/>
<TextBlock x:Name="Path" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding Storage_item.Path}" VerticalAlignment="Top" Grid.Row="1" Margin="10,0,0,10" FontSize="13" LineHeight="16"/>
</Grid>
<Image x:Name="Logo" HorizontalAlignment="Center" Height="48" VerticalAlignment="Center" Width="48" Grid.Column="1" Source="Images/Folder48.png" Stretch="UniformToFill">
</Image>
</Grid>
</Grid>
</DataTemplate>
之后,我为微软安装了#34; Behaviors.Managed for UWP&#34;来自GitHub在我的模板中创建一些行为。我拖放&#34; ChangePropertyAction&#34;在我的模板中进行图像控制。但是,XAML设计器中出现此错误:
&#39; EventTriggerBehavior&#39;不支持直接内容。
XAML Designer的图片:
和XAML图像控制代码:
<Image x:Name="Logo" HorizontalAlignment="Center" Height="48" VerticalAlignment="Center" Width="48" Grid.Column="1" Source="Images/Folder48.png" Stretch="UniformToFill">
<Interactivity:Interaction.Behaviors>
<Core:EventTriggerBehavior EventName="PointerPressed">
<Core:ChangePropertyAction/>
</Core:EventTriggerBehavior>
</Interactivity:Interaction.Behaviors>
</Image>
我无法解决为什么XAML设计师会出现此错误。我该如何解决?
感谢您的支持。
答案 0 :(得分:0)
根据我们的讨论以及我发布的最后一个答案,这是一个演示,以显示此场景中Converter
的用法:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.Resources>
<local:ThumbnailToImageConverter x:Key="cvt" />
<local:MusicTypeConverter x:Key="typecvt" />
</Grid.Resources>
<GridView x:Name="gridView">
<GridView.ItemTemplate>
<DataTemplate>
<StackPanel>
<Image Source="{Binding Thumbnail, Converter={StaticResource cvt}}" Stretch="None" />
<TextBlock Text="{Binding Name}" Margin="0,5" />
<Image Source="{Binding FileType, Converter={StaticResource typecvt}}" Stretch="None" />
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</Grid>
代码背后的代码:
private ObservableCollection<Model> Collection = new ObservableCollection<Model>();
protected override async void OnNavigatedTo(NavigationEventArgs e)
{
var files = await KnownFolders.MusicLibrary.GetFilesAsync();
foreach (var file in files)
{
var thumbnail = await file.GetThumbnailAsync(ThumbnailMode.PicturesView, 100);
Collection.Add(new Model { Name = file.Name, Thumbnail = thumbnail, FileType = file.FileType });
}
gridView.ItemsSource = Collection;
}
数据模型:
public class Model
{
public StorageItemThumbnail Thumbnail { get; set; }
public string Name { get; set; }
public string FileType { get; set; }
}
MusicTypeConverter
:
public class MusicTypeConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, string language)
{
if (value != null)
{
if ((string)value == ".mp4")
return "Assets/Music.PNG";
}
return "Assets/Video.PNG";
}
public object ConvertBack(object value, Type targetType, object parameter, string language)
{
throw new NotImplementedException();
}
}
对于ThumbnailToImageConverter
的部分,我已在最后一个问题中发布了代码。
在新的MusicTypeConverter
中,您可以添加想要的文件类型和图标图片路径。