WPF 之转换器

举个例子，比如在邮件系统中，我们在设计数据库的时候，用0代表邮件未读，1代表已读，这个时候我们希望未读的时候用没有打开邮件的图片显示，而已经读的邮件用打开的邮件图片显示出来，这个在web和winform中很好实现，但是在wpf中我们需要借助转换器来实现。

所谓的转换器就是通过一个条件或者一个类型，转换成另外一种结果或者类型，主要实现了IValueConverter接口，下面把刚才的例子简单的用代码写一下

首先我们来定义一个转换器

    //定义值转换器
    [ValueConversion(typeof(int), typeof(String))]
    public class DateConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            int reValue = System.Convert.ToInt32(value);
            string imgPath = "/Financial;component/Images/public/mail0.gif";
            if (reValue == 1)
            {
                imgPath="/Financial;component/Images/public/mail1.gif";
            }
            return imgPath;
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            string strValue = value.ToString();
            return value;
        }
   
    
    }

Convert和ConvertBack的区别：
Convert函数表示从数据源到目标的值转换，ConvertBack函数表示从目标到数据源的值转换。因此，如果绑定模式是一次绑定或单向绑定，只需实现Convert函数；如果绑定模式是双向绑定，需要实现Convert和ConvertBack函数。

在这里我们不仅需要通过传过来的1和0来判断显示哪个图片，而且还要显示的图片显示在绑定的DataGrid中，所以我们需要使用ConVert和ConVertBack

下一步，我们就要在控件中去绑定了

<UserControl x:Class="PFM.DawnXZ.WPF.UserControls.FeedBack"
              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:local1="clr-namespace:PFM.DawnXZ.WPF.EntityListener" 
             xmlns:my="clr-namespace:PFM.DawnXZ.WPF.UserControls" 
             xmlns:local="clr-namespace:PFM.DawnXZ.WPF.UserControls"
             mc:Ignorable="d" d:DesignHeight="448" Tag="私信列表" d:DesignWidth="734" Height="448" Width="734"
             Initialized="UserControl_Initialized" Loaded="UserControl_Loaded">
    <UserControl.Resources>
        <local:DateConverter x:Key="dateConverter"/>
      
    </UserControl.Resources>



    <Grid Name="gdMainPanel">
        <Canvas x:Name="cplButtonPanel" Margin="0" Width="734" Height="44" HorizontalAlignment="Left" VerticalAlignment="Top" FlowDirection="RightToLeft">
           <Canvas.Background>
                <ImageBrush ImageSource="/Images/public/navigation.png" />
            </Canvas.Background>
            <my:CPager x:Name="pager" Margin="404,7.5,0,0" FlowDirection="LeftToRight" EventPaging="pager_EventPaging" />
            <Button Content="　　添加" Height="29" Name="btnAdd" Width="60" Margin="80,7.5,0,0" Style="{StaticResource ButtonFunction}" Click="btnAdd_Click" Visibility="Collapsed">
                <Button.Background>
                    <ImageBrush ImageSource="/Financial;component/Images/function/add.png" />
                </Button.Background>
            </Button>
            <Button Content="　　刷新" Height="29" Name="btnReload" Width="60" Margin="10,7.5,0,0" Style="{StaticResource ButtonFunction}" Click="btnReload_Click">
                <Button.Background>
                    <ImageBrush ImageSource="/Financial;component/Images/function/reload.png" />
                </Button.Background>
            </Button>
            <Button Content="发件箱" Foreground="Black" Height="23" Name="button2" Width="75" Canvas.Left="297" Canvas.Top="11" Click="button2_Click" />
            <Button Content="收件箱" Foreground="Black" Height="23" Name="button1" Width="75" Canvas.Left="190" Canvas.Top="11" Click="button1_Click" />
        </Canvas>
        <DockPanel Name="dplDataPanel" Margin="0,44,0,0" Width="734" Height="404" HorizontalAlignment="Left" VerticalAlignment="Top">
           
            <DataGrid Name="dgDataSource" IsReadOnly="True"  Width="740" DataContext="{Binding}" LoadingRow="dgDataSource_LoadingRow" PreviewMouseDoubleClick="dgDataSource_PreviewMouseDoubleClick">
                <DataGrid.Columns>
                    <!--<DataGridTextColumn Width="150" Header="" Binding="{Binding userMessage.ReedStatus,Mode=OneWay}" />-->
                    <DataGridTextColumn Width="80" Header="发件人" Binding="{Binding SendUserBase.UserName,Mode=OneWay}" CellStyle="{StaticResource dgvCellLeft10}" />
                    <DataGridTextColumn Width="400" Header="私信标题" Binding="{Binding Tile,Mode=OneWay}" CellStyle="{StaticResource dgvCellLeft10}" />
                    <DataGridTemplateColumn Header="状态" Width="100">
                        <DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <Image  Source="{Binding ReadState,Converter={StaticResource dateConverter},Mode=OneWay}" Name="image1"  Width="16" Height="14"  />
                            </DataTemplate>
                        </DataGridTemplateColumn.CellTemplate>
                    </DataGridTemplateColumn>
                    <DataGridTextColumn Width="150" Header="发送时间" Binding="{Binding AddTime,Mode=OneWay,StringFormat='yyyy-MM-dd HH:mm:ss'}" CellStyle="{StaticResource dgvCellLeft10}"/>
                   
             
                </DataGrid.Columns>
                <DataGrid.ContextMenu>
                    <ContextMenu>
                        <!--<Separator />-->
                        <MenuItem x:Name="mitmDelete" Header="删除私信"  Click="mitmDelete_Click">
                            <MenuItem.Icon>
                                <Image Source="/Financial;component/Icons/Error.ico" />
                            </MenuItem.Icon>
                        </MenuItem>
                        
                        <!--<Separator />-->
                    </ContextMenu>
                </DataGrid.ContextMenu>
            </DataGrid>
  
        </DockPanel>
        
    </Grid>
</UserControl>

有几点需要说明：

1、首先我们需要引入空间

xmlns:local="clr-namespace:PFM.DawnXZ.WPF.UserControls"

这里就和web中使用用户控件很类似，然后引入资源

    <UserControl.Resources>
        <local:DateConverter x:Key="dateConverter"/>
      
    </UserControl.Resources>

这里我用的是用户控件，所以使用UserControl.Resources，如果不是用户控件，比如window窗体，就要使用window.Resources了(这个问题曾经纠结过)

2、绑定到需要转换的控件中

 <DataGridTemplateColumn Header="状态" Width="100">
                        <DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <Image  Source="{Binding ReadState,Converter={StaticResource dateConverter},Mode=OneWay}" Name="image1"  Width="16" Height="14"  />
                            </DataTemplate>
                        </DataGridTemplateColumn.CellTemplate>
                    </DataGridTemplateColumn>

这里面使用了模板列，这个后期会说到，最主要的是这个

这样我们就可以通过我们定义的转换器来实现我们想要的东西了...