Question

我要求根据绑定值将图像显示为单独的行。 Datagrid代码如下。

<DataGrid AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="OrderId : "/>
                                    <TextBlock Text="{Binding OrderId}"/>
                                </StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="OrderTime : "/>
                                    <TextBlock Text="{Binding OrderTime}"/>
                                </StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="OrderStatus : "/>
                                    <TextBlock Text="{Binding OrderStatus}"/>
                                </StackPanel>
                            </StackPanel>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>

我想再添加一个带有<Image Source=""/>的StackPanel。源路径将基于网格上方的{Binding OrderStatus}。如果OrderStatus值是＆＃34;新＆＃34;我想要显示new.png。如果OrderStatus值为＆＃34; Old＆＃34;我想显示old.png等......

任何人都可以帮助我。

Answer 1

使用DataTrigger。该链接也有一个很好的例子。

Answer 2

<DataGrid AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="OrderId : "/>
                                    <TextBlock Text="{Binding OrderId}"/>
                                </StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="OrderTime : "/>
                                    <TextBlock Text="{Binding OrderTime}"/>
                                </StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="OrderStatus : "/>
                                    <TextBlock Text="{Binding OrderStatus}"/>
                                </StackPanel>

                <StackPanel Orientation="Horizontal">
                                    <Image Width="250px" Height="50px" Margin="3,0">
                                      <Image.Style>
                                       <Style TargetType="{x:Type Image}">
                                       <Style.Triggers>
                                       <DataTrigger Binding="{Binding OrderStatus}" Value="New">
                                       <Setter Property="Source" Value="/Images/New.png"/>
                                       </DataTrigger>
                                      <DataTrigger Binding="{Binding OrderStatus}" Value="Old">
                                      <Setter Property="Source" Value="/Images/Old.png"/>
                                      </DataTrigger>
                                      </Style.Triggers>
                                     </Style>
                                    </Image.Style>
                                   </Image>
                               </StackPanel>

                            </StackPanel>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>

如何根据绑定值在datagrid StackPanel中显示图像

2 个答案: