使用分层数据模板将数据绑定的图像加载到菜单项中 [英] Loading databound images into a menuitem with hierarchical data template

问题描述

在WPF客户端应用程序中，使用分层数据模板加载数据绑定菜单项时遇到一些困难.

首先，我创建了ViewModel，其中包含菜单项的基本属性:Title，Command，ImageSource(用于Icon属性的图像路径)和子项.
然后，我在XAML窗口中创建了视图以显示菜单.为了绑定我的集合，考虑到子项，我使用了菜单项模板的分层数据模板.

这是ItemTemplate的XAML代码:

In a WPF client application, I''m having some difficulties using hierarchical data template to load databound menuitems.

First I created the ViewModel, containing the basic properties for a menu item : Title, Command, ImageSource (Path to the image to use for Icon property) and sub items.

Then, I created the view in a XAML window to display my menus. To bind my collection, taking sub items into account, I used the hierarchical data template for the menu item template.

Here is the XAML code for the ItemTemplate :

<HierarchicalDataTemplate DataType="{x:Type vm:MenuItemViewModel}" ItemsSource="{Binding Path=Items}">
    <HierarchicalDataTemplate.ItemContainerStyle>
        <Style TargetType="MenuItem">
            <Style.Resources>
                <Image x:Key="ItemImage" Source="{Binding ImageSource}" Width="16" Height="16" x:Shared="false" />
            </Style.Resources>
            <Style.Setters>
                <Setter Property="Command" Value="{Binding Command}" />
                <Setter Property="CommandParameter" Value="{Binding CommandParameter}" />
                <Setter Property="Icon" Value="{StaticResource ItemImage}" />
            </Style.Setters>
        </Style>
    </HierarchicalDataTemplate.ItemContainerStyle>
    <StackPanel Orientation="Horizontal">
        <TextBlock Text="{Binding Title}" />
    </StackPanel>
</HierarchicalDataTemplate>

当我初始化菜单并显示窗口时，一切看起来都很好.

之后，我尝试将菜单项模板放入资源字典中，以便能够从应用程序中的任何地方重用它作为默认模板.
当我这样做时，会抛出异常:

When I initialize the menus and show the window, all looks fine.

After that, I tried to put the menu item template into a resource dictionary in order to be able to reuse it from wherever in my application as a default template.
When I do that, I have an exception thrown :

Shared attribute in namespace 'http://schemas.microsoft.com/winfx/2006/xaml' can be used only in compiled resource dictionaries.

在花了很多时间寻找解决方案之后，我终于创建了一个测试器项目(可在此处)进行演示.问题.

我不知道如何使我的资源字典成为已编译的资源字典...
有人可以帮我吗?

After spending so much time searching for a solution, I finally made a tester project (available here) to demonstrate the problem.

I don''t know how to make my resource dictionary being a compiled resource dictionary...
Could anyone help me ?

推荐答案

Peltchag，

我遇到了同样的问题，对于资源词典来说，这不是AFAIK.

我最终得到的是在我的DataTemplate中使用ValueConverter.

使转换器可访问(其中local是名称空间的别名)

Hi Peltchag,

I had the same problem and AFAIK this isn''t possible for resource dictionaries.

What I ended up with is using a ValueConverter in my DataTemplate.

Make the converter accessible (where local is an alias for the namespace)

<local:menuiconconverter x:key="menuIconConverter" xmlns:x="#unknown" xmlns:local="#unknown" />

然后在您的DataTemplate中编写类似以下内容的内容:

And then write in your DataTemplate something like:

<setter property="Icon" value="{Binding ImageSource, Converter={StaticResource menuIconConverter}}" />

在local引用的名称空间中，此类:

And in the namespace referenced by local, this class:

using System;
using System.Globalization;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Media.Imaging;

[ValueConversion(typeof(String), typeof(Image))]
public class MenuIconConverter : IValueConverter
{
   #region IValueConverter implementation

   public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
   {
      if (value == null)
      {
         return Binding.DoNothing;
      }

      string imageUrl = value.ToString();

      if (string.IsNullOrEmpty(imageUrl))
      {
         return Binding.DoNothing;
      }


      var bmp = new BitmapImage(new Uri(imageUrl, UriKind.RelativeOrAbsolute)) { DecodePixelHeight = 16, DecodePixelWidth = 16 };

      return new Image { Width = 16, Height = 16, Source = bmp, UseLayoutRounding = true, SnapsToDevicePixels = true };
   }

   public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
   {
      return Binding.DoNothing;
   }

   #endregion
}

希望这会有所帮助，

问候，

托马斯.

Hope this helps,

Regards,

Thomas.

这篇关于使用分层数据模板将数据绑定的图像加载到菜单项中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！