WPF 值转换器(Converter)的使用

示例一、ViewModel层int型属性Gender绑定界面表示性别的两个RadioButton,Gender=1表示男,Gender=2表示女;
在这里插入图片描述
窗体xaml代码:

<Window x:Class="WpfApp1.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:WpfApp1"
        xmlns:converter="clr-namespace:WpfApp1.Converter"
        mc:Ignorable="d"
        Title="MainWindow" Height="250" Width="400">
    <Window.Resources>
        <converter:GenderConverter x:Key="genderConverter"/>
    </Window.Resources>
    <Grid HorizontalAlignment="Center" VerticalAlignment="Center">
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="性别:" Margin="10 0"/>
            <RadioButton Content="男" IsChecked="{Binding Gender,Converter={StaticResource genderConverter},ConverterParameter=1}" Margin="0 0 10 0"/>
            <RadioButton Content="女" IsChecked="{Binding Gender,Converter={StaticResource genderConverter},ConverterParameter=2}"/>
        </StackPanel>
    </Grid>
</Window>

后台代码:

public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            this.DataContext = new MainWindowModel();
        }
    }

MainWindowModel代码:

namespace WpfApp1
{
    class MainWindowModel
    {
        public int Gender { get; set; }

        public MainWindowModel()
        {
            Gender = 2;
        }
    }
}

转换器代码:

namespace WpfApp1.Converter
{
    public class GenderConverter : IValueConverter
    {
        //model->view转换
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            if (value == null || parameter == null)
                return false;
            return value.ToString() == parameter.ToString();
            //throw new NotImplementedException();
        }

        //view->model转换
        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            //throw new NotImplementedException();
            return parameter;
        }

    }
}

示例二、如果ViewModel层的Flag属性的值为true时,窗体中的字体为绿色,否则字体为红色
在这里插入图片描述
窗体xaml代码:

<Window x:Class="WpfApp1.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:WpfApp1"
        xmlns:converter="clr-namespace:WpfApp1.Converter"
        mc:Ignorable="d"
        Title="MainWindow" Height="250" Width="400">
    <Window.Resources>
        <converter:BoolToBrushConverter x:Key="BoolToBrushConverter"/>
    </Window.Resources>
    <Grid HorizontalAlignment="Center" VerticalAlignment="Center">
        <TextBlock Text="Hello World !" FontSize="16" Foreground="{Binding Flag,Converter={StaticResource BoolToBrushConverter}}"/>
    </Grid>
</Window>

后台代码:

public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            this.DataContext = new MainWindowModel();
        }
    }

MainWindowModel代码:

namespace WpfApp1
{
    class MainWindowModel
    {
        public bool Flag { get; set; }

        public MainWindowModel()
        {
            Flag = false;
        }
    }
}

转换器代码:

namespace WpfApp1.Converter
{
    class BoolToBrushConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            //throw new NotImplementedException();
            if (value != null && bool.Parse(value.ToString()))
            {
                return Brushes.Green;
            }
            return Brushes.Red;
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }

    }
}

示例三、多值转换器
下图:只有当第一个ComboBox值为A,第二个ComboBox值为B时,下面的文本字体才为红色,否则均为灰色。
在这里插入图片描述
多值转换器类代码:

class MyConverter : IMultiValueConverter
{
    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
    {
        if(values[0] == null || values[1] == null)
            return Brushes.Gray;

        if (values[0].ToString() == "A" && values[1].ToString() == "B")
        {
            return Brushes.Red;
        }
        return Brushes.Gray;
    }

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

MainWindow.xaml代码:

<Window x:Class="WpfApp2.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:WpfApp2"
        mc:Ignorable="d"
        Title="MainWindow" Height="250" Width="400">
    <Window.Resources>
        <local:MyConverter x:Key="myConverter"/>
    </Window.Resources>
    <StackPanel>
        <ComboBox Name="cb_001" Width="100" Height="25" Margin="0 30 0 0">
            <ComboBoxItem Content="A"/>
            <ComboBoxItem Content="B"/>
            <ComboBoxItem Content="C"/>
        </ComboBox>
        <ComboBox Name="cb_002" Width="100" Height="25" Margin="0 10 0 0">
            <ComboBoxItem Content="A"/>
            <ComboBoxItem Content="B"/>
            <ComboBoxItem Content="C"/>
        </ComboBox>
        <TextBlock Margin="0 20 0 0" Text="Hello World!" HorizontalAlignment="Center">
            <TextBlock.Foreground>
                <MultiBinding Converter="{StaticResource myConverter}">
                    <Binding Path="Text" ElementName="cb_001"></Binding>
                    <Binding Path="Text" ElementName="cb_002"></Binding>
                </MultiBinding>
            </TextBlock.Foreground>
        </TextBlock>
    </StackPanel>
</Window>

示例四:多值转换器的使用二
下图:如果质量和服务评分都在60以上,则评价为✔;否则评价为✘;
在这里插入图片描述
转换器代码:

  class GradeConverter : IMultiValueConverter
    {
        public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
        {
            if (int.Parse(values[0].ToString()) >= 60 && int.Parse(values[1].ToString()) >= 60)
                return "✔";
            else
                return "✘";
        }

        public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }

主页面代码:

   <Window.Resources>
        <local:GradeConverter x:Key="gradeConverter"/>
    </Window.Resources>
    <Grid>
        <ListView ItemsSource="{Binding products}">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="Height" Value="30"/>
                    <Setter Property="HorizontalContentAlignment" Value="Center"/>
                </Style>
            </ListView.ItemContainerStyle>
            <ListView.View>
                <GridView>
                    <GridView.ColumnHeaderContainerStyle>
                        <Style TargetType="GridViewColumnHeader">
                            <Setter Property="Height" Value="30"/>
                        </Style>
                    </GridView.ColumnHeaderContainerStyle>
                    <GridViewColumn Header="名称" Width="100" DisplayMemberBinding="{Binding Name}"/>
                    <GridViewColumn Header="质量" Width="100" DisplayMemberBinding="{Binding Score}"/>
                    <GridViewColumn Header="服务" Width="100" DisplayMemberBinding="{Binding Service}"/>
                    <GridViewColumn Header="评价" Width="100" >
                        <GridViewColumn.DisplayMemberBinding>
                            <MultiBinding Converter="{StaticResource gradeConverter}">
                                <Binding Path="Score"/>
                                <Binding Path="Service"/>
                            </MultiBinding>
                        </GridViewColumn.DisplayMemberBinding>
                    </GridViewColumn>
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>

后台代码:

 public partial class MainWindow : Window
    {
        public MainWindow()
        {
            products = new List<object>();
            InitializeComponent();
            products.Add(new { Name = "产品一", Score = 90, Service = 40});
            products.Add(new { Name = "产品二", Score = 70, Service = 70 });
            products.Add(new { Name = "产品三", Score = 50, Service = 80 });
            DataContext = this;
        }
        public List<object> products { get; set; }
    }
Logo

瓜分20万奖金 获得内推名额 丰厚实物奖励 易参与易上手

更多推荐