WPF中DataGrid显示图片，绑定图片路径显示

王焜棟琦

于 2023-01-09 01:25:56 发布

阅读量813

点赞数

分类专栏： WPF 文章标签： wpf

本文链接：https://blog.csdn.net/u011511086/article/details/128608032

版权

WPF 专栏收录该内容

17 篇文章 1 订阅

订阅专栏

该Xaml页面展示了WPF应用中的用户界面设计，包括DataGrid组件用于数据展示，使用了自定义的ImgShowConvert转换器处理图片显示，实现了从文件系统加载图像到DataGrid的电子签名列。页面包含账号查询功能，以及角色选择、启用状态检查框和操作列等交互元素。

摘要由CSDN通过智能技术生成

Xaml页面

<Page x:Class="WpfSnqkGasAnalysis.PageUser"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="clr-namespace:WpfSnqkGasAnalysis.Model;assembly=WpfSnqkGasAnalysis.Model" 
      xmlns:local1="clr-namespace:WpfSnqkGasAnalysis"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="PageUser" Loaded="Page_Loaded">
    <Page.Resources>
        <local1:ImgShowConvert x:Key="imgShow"></local1:ImgShowConvert>
    </Page.Resources>
    <Grid>       
        <Grid.RowDefinitions>
            <RowDefinition Height="60"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
        </Grid.RowDefinitions>
        <DockPanel LastChildFill="False" Grid.Row="0">
            <Label Content="账号：" Style="{StaticResource Label1}"  />
            <TextBox  x:Name="txtAccount" Text="" Style="{StaticResource input1}" Margin="0,0,20,0" />
            <Button x:Name="btnSearch" Content="查询"  Style="{StaticResource buttonBlue}" HorizontalAlignment="Left" VerticalAlignment="Center" Click="btnSearch_Click"/>
        </DockPanel>
        <Grid Grid.Row="1">
            <DataGrid  x:Name="dgUser"  ItemsSource="{Binding }"  Style="{StaticResource DataGrid1}" AutoGenerateColumns="False" SelectionUnit="Cell" CanUserAddRows="True" CellEditEnding="dgUser_CellEditEnding"   >
                <DataGrid.Columns>
                    <DataGridTextColumn ElementStyle="{StaticResource dataGridColumn}" Width="200" Header="账号" Binding="{Binding User_account}"  ></DataGridTextColumn>
                    <DataGridTextColumn ElementStyle="{StaticResource dataGridColumn}" Width="200" Header="姓名" Binding="{Binding User_real_name,Mode=TwoWay}"></DataGridTextColumn>
                    <DataGridComboBoxColumn   Width="200" Header="角色" TextBinding="{Binding Role_id,Mode=TwoWay }"  ItemsSource="{x:Static  local:CommonConfig.RoleList  }" SelectedItemBinding="{Binding  Role_id,UpdateSourceTrigger=PropertyChanged}"   />
                    <DataGridCheckBoxColumn   Width="100"  Header="是否启用" Binding="{Binding U_stat,Mode=TwoWay}"  ></DataGridCheckBoxColumn>
                    <DataGridTemplateColumn Header="电子签名"  >
                        <DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>                           
                                <Image Source="{Binding SignatureImgPath,Converter={StaticResource imgShow} }" MaxHeight="60" ></Image>
                            </DataTemplate>
                        </DataGridTemplateColumn.CellTemplate>
                    </DataGridTemplateColumn>
                    <DataGridTextColumn ElementStyle="{StaticResource dataGridColumn}" Width="300"   Header="备注" Binding="{Binding Remark,Mode=TwoWay}"></DataGridTextColumn>
                    <DataGridTemplateColumn  Header="操作" Width="*">
                        <DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal" Style="{StaticResource StackPanel_buttonSpance}">
                                    <Button  Name="btnEdit" Tag="{Binding Id}" HorizontalAlignment="Left" VerticalAlignment="Center" Content="上传电子签名"   Click="BtnImgName_Click"  />
                                </StackPanel>
                            </DataTemplate>
                        </DataGridTemplateColumn.CellTemplate>
                    </DataGridTemplateColumn>
                </DataGrid.Columns>
            </DataGrid>
        </Grid>
    </Grid>   
</Page>

后台代码

using System;
using System.Collections.Generic;
using System.Globalization;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Data;
using System.Windows.Media.Imaging;
using WpfSnqkGasAnalysis.Model;

namespace WpfSnqkGasAnalysis
{
    /// <summary>
    /// DataGrid 中 图片展示
    /// </summary>
    /// 创建时间：2023-1-5 16:01:35。 
    public class ImgShowConvert : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            string imgSaveUrl = System.Convert.ToString(value);
            if (string.IsNullOrWhiteSpace(imgSaveUrl)) return null;
            try
            {
                imgSaveUrl = imgSaveUrl.TrimStart('\\');
                imgSaveUrl = imgSaveUrl.TrimStart('/');

                string imgPath = System.IO.Path.Combine(AppDomain.CurrentDomain.BaseDirectory, imgSaveUrl);
                if (!System.IO.File.Exists(imgPath))
                {
                    return null;
                }

                //开始加载图像
                BitmapImage bim = new BitmapImage();
                bim.BeginInit();
                bim.CacheOption = BitmapCacheOption.OnLoad;                 
                bim.StreamSource = System.IO.File.OpenRead(imgPath);
                bim.EndInit();
                return bim;
            }
            catch (Exception ex)
            {
                //LogHelpter.AddLog(ex.Message, null, "img_show_error");
                return null;
            }
        }

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