Question

我有一个在运行时加载的类ExpanderItems，其列表被设置为DataContext的{{1}}。现在我要做的是为每个项目显示相应的图像ListBox。有任何建议怎么做？

Tooltip

在使用Items的窗口中，我正在调用：

public class ExpanderItem
{
    private String mItemName = "empty";
    public String ItemName
    {
        get { return mItemName; }
        set { mItemName = value; }
    }

    private Image mItemSymbol = null;
    public Image ItemSymbol
    {
        get { return mItemSymbol; }
        set { mItemSymbol = value; }
    }
}

public List<ExpanderItem> getExpanderItems()
    {
        List<ExpanderItem> ItemList = new List<ExpanderItem>();

        ExpanderItem i0 = new ExpanderItem();
        i0.ItemName = "Constant";
        i0.ItemSymbol = new Image();
        BitmapImage bi = new BitmapImage();
        bi.BeginInit();
        bi.UriSource = new Uri(@"/resources/Constant.png", UriKind.RelativeOrAbsolute);
        bi.EndInit();
        i0.ItemSymbol.Source = bi;
        ItemList.Add(i0);
        ...
   }

XAML看起来像：

   void WindowMain_Loaded(object sender, RoutedEventArgs e)
    {
        lbItems.DataContext = SomeService.getExpanderItems();
    }

Answer 1

经过编译和测试的解决方案。

XAML：

    <ListBox x:Name="lb"
         ItemsSource="{Binding}"
         HorizontalAlignment="Stretch"
         VerticalAlignment="Stretch">
    <ListBox.ItemContainerStyle>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="ToolTip">
                <Setter.Value>
                    <Image Stretch="UniformToFill"
                           Source="{Binding ItemSymbol}" />
                </Setter.Value>
            </Setter>
        </Style>
    </ListBox.ItemContainerStyle>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Label Grid.Column="1"
                   Content="{Binding ItemName}">
            </Label>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

代码：

using System;
using System.Collections.Generic;
using System.Windows;
using System.Windows.Media.Imaging;

namespace Test
{
    public class ExpanderItem
    {
        private String mItemName = "empty";
        public String ItemName
        {
            get { return mItemName; }
            set { mItemName = value; }
        }

        private BitmapImage mItemSymbol = null;
        public BitmapImage ItemSymbol
        {
            get { return mItemSymbol; }
            set { mItemSymbol = value; }
        }
    }

    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            this.InitializeComponent();
            lb.DataContext = this.getExpanderItems();
        }

        public List<ExpanderItem> getExpanderItems()
        {
            List<ExpanderItem> ItemList = new List<ExpanderItem>();
            ExpanderItem i0 = new ExpanderItem
            {
                ItemName = "Constant",
                ItemSymbol = new BitmapImage(new Uri(@"/resources/constant.png", UriKind.RelativeOrAbsolute))
            };
            ItemList.Add(i0);

            ExpanderItem i1 = new ExpanderItem
            {
                ItemName = "Constant",
                ItemSymbol = new BitmapImage(new Uri(@"/resources/constant.png", UriKind.RelativeOrAbsolute))
            };
            ItemList.Add(i1);

            return ItemList;
        }
    }
}

Answer 2

我找到了这样的解决方案，但这并没有将工具提示添加到整个列表框项目中，而只是添加到文本框中。

public class ExpanderItem
{
   private String mItemName = "empty";
   public String ItemName
   {
      get { return mItemName; }
      set { mItemName = value; }
   }

   private Image mItemSymbol = null;
   public Image ItemSymbol
   {
      get { return mItemSymbol; }
      set { mItemSymbol = value; }
   }
}


public List<ExpanderItem> getExpanderItems()
{
    List<ExpanderItem> ItemList = new List<ExpanderItem>();

    ExpanderItem i0 = new ExpanderItem();
    i0.ItemName = "Constant";
    i0.ItemSymbol = new Uri(@"/resources/Constant.png", UriKind.RelativeOrAbsolute);
    ItemList.Add(i0);
    ...
}

XAML：

<ListBox.ItemTemplate>
   <DataTemplate>
   ...
   <Label Grid.Column="1" Content="{Binding ItemName}">
      <Label.ToolTip>
      <Border BorderBrush="Black"
              BorderThickness="1"
              CornerRadius="2">
          <Image Source="{Binding ItemSymbol}" />
      </Border>
      </Label.ToolTip>
     </Label>

在列表框项的代码中设置工具提示图像

2 个答案: