将图像添加到 Silverlight 中的 DataGrid 行？

Question

我正在尝试在 Silverlight 中创建一个用户列表，我想在其中显示他们的图像、姓名、分数等。

我用这段代码绘制了一个数据网格，这样我看起来就像一个列表：

     <sdk:DataGrid Grid.Row="1" x:Name="KitchenChart" HorizontalAlignment="Center" AutoGenerateColumns="False" ItemsSource="{Binding KitchenScore}" Background="Black"
             AlternatingRowBackground="Black" GridLinesVisibility="Horizontal">
                <sdk:DataGrid.Columns>
                    <sdk:DataGridTemplateColumn Header="Image" IsReadOnly="True">
                        <sdk:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Background="Black">
                                    <Image Source="{Binding Image}" />                                
                                </StackPanel>
                            </DataTemplate>
                        </sdk:DataGridTemplateColumn.CellTemplate>
                    </sdk:DataGridTemplateColumn>
                    <sdk:DataGridTemplateColumn Header="Name">
                        <sdk:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Background="Black">
                                    <TextBlock  Padding="5,0,5,0" Text="{Binding Name}" Foreground="White"/>
                                </StackPanel>
                            </DataTemplate>
                        </sdk:DataGridTemplateColumn.CellTemplate>
                    </sdk:DataGridTemplateColumn>
                    <sdk:DataGridTemplateColumn Header="Score">
                        <sdk:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Background="Black">
                                    <TextBlock Padding="5,0,5,0" Text="{Binding Score}" Foreground="White" HorizontalAlignment="Stretch"/>
                                </StackPanel>
                            </DataTemplate>
                        </sdk:DataGridTemplateColumn.CellTemplate>
                    </sdk:DataGridTemplateColumn>
                </sdk:DataGrid.Columns>
            </sdk:DataGrid>

And the i used class to load dynamic data in datagrid using this as :
public class KitchenScoreClass
    {
        public Image Image { get; set; }
        public string Name { get; set; }
        public int Score { get; set; }
        public KitchenScoreClass(Image Image, string Name, int Score)
        {
            this.Image = Image;
            this.Name = Name;
            this.Score = Score;
        }
    }

然后我创建了一个动态加载所有数据的函数

private List<KitchenScoreClass> KitchenScore()
        {
            List<KitchenScoreClass> avgg = new List<KitchenScoreClass>();

            avgg.Add(new KitchenScoreClass( ??? ,"kundan",10));
            avgg.Add(new KitchenScoreClass( ??? , "me", 15));
            avgg.Add(new KitchenScoreClass( ??? , "varun", 10));

            return avgg;
        }

最后使用这个函数将数据添加到datagrid KitchenChart：

 public ScoreCharts()
        {
            InitializeComponent();
            KitchenChart.ItemsSource = KitchenScore();
        }

但我不知道我应该如何添加图片？假设我的所有图像与我的解决方案文件夹一起存储在 Mysolution/MyImgs 文件夹中。 如何添加图片？

请帮忙

谢谢

Answer 1

使用“DataGridTempalteColumn”添加图像列。添加单元格模板并创建图像对象以在单元格中显示图像。例如：

<data:DataGridTemplateColumn>

<data:DataGridTemplateColumn.CellTemplate>

<DataTemplate>

<Image x:Name="picture" ImageFailed="picture_ImageFailed" Width="200" Height="130" Visibility="Visible"/>

</DataTemplate>

</data:DataGridTemplateColumn.CellTemplate>

</data:DataGridTemplateColumn>

Answer 2

您需要从光盘中读取图像并将其转换为Image 对象。你可以使用ImageSourceConverter：

ImageSourceConverter ISC = new ImageSourceConverter();

var newImage = new Image
    {
        Stretch = Stretch.None,
        HorizontalAlignment = HorizontalAlignment.Left,
        VerticalAlignment = VerticalAlignment.Top
    };

newImage.Source = (ImageSource)ISC.ConvertFromString(ImagePath);

注意：这需要将图像下载到客户端计算机并且位于/ClientBin 文件夹下的某个位置。