如何在WPF应用程序中正确添加带有图像单元格的GridViewColumn

时间:2018-06-19 06:23:56

标签: c# wpf wpf-controls wpfdatagrid

如果我只添加字符串值列 - 一切正常:

gridView.Columns.Add(new GridViewColumn
{
    Header = "ExecFileName",
    DisplayMemberBinding = new Binding("ExecFileName")
});

但是我如何在此列的单元格中添加包含BitmapImage或ImageSource值的列?

无论我做了什么 - 我总是只看到图像文件的路径 - 我如何才能显示图像本身?

P.S。:我正在从代码创建GridView,在xaml中我只有:

<ListView x:Name="ResultListView" 
          BorderThickness="2,0,2,0" 
          BorderBrush="Gray" 
          Height="Auto" 
          Width="Auto" 
          Margin="0,0,0,10" 
          RenderTransformOrigin="0.502,2.299" 
          AutomationProperties.IsColumnHeader="True" 
          Loaded="ResultListView_Loaded" 
          MouseDoubleClick="ResultListView_MouseDoubleClick" >
</ListView>

2 个答案:

答案 0 :(得分:1)

由于您是在代码隐藏中创建GridView,因此您还需要在代码隐藏中创建对ImageSource / BitmapSource的绑定。

以下是生成此列​​表视图的示例:

Screenshot

MainWindow.xaml文件是:

<Window x:Class="WpfApplication6.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApplication6"
        mc:Ignorable="d"
        Title="MainWindow" Height="150" Width="250"
        d:DataContext="{d:DesignData d:Type=local:MainWindow}">
    <Grid>
        <ListView x:Name="ResultListView" 
                  ItemsSource="{Binding Items}"
                  BorderThickness="2,0,2,0" 
                  BorderBrush="Gray" 
                  Height="Auto" 
                  Width="Auto" 
                  Margin="0,0,0,10" 
                  RenderTransformOrigin="0.502,2.299" 
                  AutomationProperties.IsColumnHeader="True">
        </ListView>
    </Grid>
</Window>

代码隐藏是这个(MainWindow.xaml.cs):

using System;
using System.Collections.ObjectModel;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Media.Imaging;

namespace WpfApplication6
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public ObservableCollection<Item> Items { get; } = new ObservableCollection<Item>(new[]
        {
            new Item { ExecFileName = @"C:\Temp\icon1.png" },
            new Item { ExecFileName = @"C:\Temp\icon2.png" }
        });

        public MainWindow()
        {
            InitializeComponent();
            DataContext = this;

            FrameworkElementFactory factory = new FrameworkElementFactory(typeof(Image));
            factory.SetBinding(Image.SourceProperty, new Binding("ImageSource"));

            GridView gridView = new GridView();
            gridView.Columns.Add(new GridViewColumn
            {
                Header = "FileName",
                DisplayMemberBinding = new Binding("ExecFileName")
            });
            gridView.Columns.Add(new GridViewColumn
            {
                Header = "Image",
                CellTemplate = new DataTemplate() { VisualTree = factory }
            });
            ResultListView.View = gridView;
        }
    }

    public class Item
    {
        public string ExecFileName { get; set; }

        public BitmapImage ImageSource
        {
            get
            {
                return new BitmapImage(
                    new Uri(ExecFileName, UriKind.RelativeOrAbsolute));
            }
        }
    }
}

答案 1 :(得分:0)

我只是简单回答一下 - 究竟是我的错误:

我正在尝试像往常一样为字符串值单元添加列:

            gridView.Columns.Add(new GridViewColumn
        {
            Header = "Icon",
            DisplayMemberBinding = new Binding("Icon")
        });

但我需要像这样添加:

            FrameworkElementFactory factory = new FrameworkElementFactory(typeof(Image));
        factory.SetBinding(Image.SourceProperty, new Binding("Icon"));

        gridView.Columns.Add(new GridViewColumn
        {
            Header = "Icon",
            CellTemplate = new DataTemplate() { VisualTree = factory }
        });