我們先來看看微軟官方給出的定語:提供將自定義邏輯應用于綁定的方法,我們來看一下該接口的定義,Convert提供了將數據源到UI的格式化,ConvertBack表示反向
namespace?System.Windows.Data
{//// Summary:// Provides a way to apply custom logic to a binding.public interface IValueConverter{object?Convert(object?value,?Type?targetType,?object?parameter,?CultureInfo?culture);object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture);}
}
我們做一個簡單的例子實現商品列表的綁定,定義一個DecimalConverter數據轉化接口來實現一個價格的格式化,我們將價格格式化成兩位小數:
?
using System;
using System.Collections.Generic;
using System.Globalization;
using System.Windows;
using System.Windows.Data;
using?System.Windows.Media;
namespace Example_17
{/// <summary>/// Interaction logic for MainWindow.xaml/// </summary>public partial class MainWindow : Window{public MainWindow(){InitializeComponent();this.Loaded += MainWindow_Loaded;}private void MainWindow_Loaded(object sender, RoutedEventArgs e){List<Order> orders = new List<Order>();Order order = new Order();order.Merchindise = "IPhone 14";order.Quantity = 1;order.Price = 8000;orders.Add(order);order = new Order();order.Merchindise = "衛生紙";order.Quantity = 10;order.Price = 28.7895M;orders.Add(order);order = new Order();order.Merchindise = "筆記本";order.Quantity = 10;order.Price = 87.7895M;orders.Add(order);this.lstOrder.ItemsSource = orders;}}[ValueConversion(typeof(decimal), typeof(string))]public class DecimalConverter : IValueConverter{public object? Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture){if (value != null)return ((decimal)value).ToString("f2");elsereturn null;}public object? ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture){return null;}}public class Order{public?string?Merchindise?{?get;?set;?}?=?null!;public?int?Quantity?{?get;?set;?}public decimal Price { get; set; }}
}
<Window x:Class="Example_17.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:Example_17"mc:Ignorable="d" Title="MainWindow"?Height="450"?Width="800"><Window.Resources><local:DecimalConverter x:Key="myDecimalConverter"></local:DecimalConverter></Window.Resources><StackPanel x:Uid="staOrder"><ListView x:Uid="lstOrder" IsSynchronizedWithCurrentItem="True" ScrollViewer.CanContentScroll="True" x:Name="lstOrder" AllowDrop="True" BorderThickness="0,0,0,1" Focusable="False"><ListView.View><GridView x:Uid="GridView_1"><GridViewColumn x:Name="colMerchindise" x:Uid="GridViewColumn_1" Header="商品名稱" Width="250"><GridViewColumn.CellTemplate><DataTemplate><Border Width="138" Height="Auto"><Grid x:Uid="Grid_2" Height="Auto" Width="Auto"><TextBlock x:Uid="TextBlock_2" Margin="0,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Stretch" Text="{Binding Path=Merchindise}" FontFamily="Arial" FontWeight="Bold" FontSize="15" TextWrapping="NoWrap" TextTrimming="WordEllipsis" /></Grid></Border></DataTemplate></GridViewColumn.CellTemplate></GridViewColumn><GridViewColumn x:Name="colQuantity" x:Uid="GridViewColumn_2" Header="數量" Width="170" ><GridViewColumn.CellTemplate><DataTemplate><Border Width="56" Height="Auto"><Grid x:Uid="Grid_3" Height="Auto" Width="Auto"><TextBlock x:Uid="TextBlock_3" Margin="0,0,0,0" Text="{Binding Path=Quantity}" HorizontalAlignment="Right" VerticalAlignment="Center" FontFamily="Arial" FontWeight="Bold" FontSize="15" Background="{x:Null}" TextTrimming="WordEllipsis" /></Grid></Border></DataTemplate></GridViewColumn.CellTemplate></GridViewColumn><GridViewColumn x:Name="colPrice" x:Uid="GridViewColumn_3" Header="價格" Width="170"><GridViewColumn.CellTemplate><DataTemplate><Grid x:Uid="Grid_4" Height="Auto" Width="Auto"><TextBlock x:Uid="TextBlock_4" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,0,0,0" FontFamily="Arial" FontWeight="Bold" FontSize="15" TextTrimming="WordEllipsis" FontStretch="Normal" ><TextBlock.Text><Binding Path="Price" Converter="{StaticResource myDecimalConverter}"/></TextBlock.Text></TextBlock></Grid></DataTemplate></GridViewColumn.CellTemplate></GridViewColumn></GridView></ListView.View></ListView></StackPanel>
</Window>
運行效果如下,我們可以看到我們的價格已經被格式化:
我們如果想將數量等于10的背景顏色設置為綠色,又該怎么做的,同樣的我們定義一個ColorConverter轉換器:
[ValueConversion(typeof(int), typeof(SolidColorBrush))]public class ColorConverter : IValueConverter{public object? Convert(object value, Type targetType, object parameter, CultureInfo culture){if ((int)value == 10)return new SolidColorBrush(Colors.Green); ;return null;}public object? ConvertBack(object value, Type targetType, object parameter, CultureInfo culture){return null;}}
同樣我們在XAML中引用一下該對象:
<local:ColorConverter x:Key="myColorConverter"></local:ColorConverter>
在ListView中添加如下樣式:
<ListView.ItemContainerStyle><Style x:Uid="Style_2" TargetType="{x:Type ListViewItem}"><Setter Property="Background" Value="{Binding Path=Quantity, Converter={StaticResource myColorConverter}}"></Setter></Style>
</ListView.ItemContainerStyle>
運行效果如下:
從上面例子可以看出我們可以利用IValueConverter接口在數據源和UI之間做一些數據轉換,另外微軟還提供了一個IMultiValueConverter接口支持多個值轉換,我們這里就不說了,感興趣的小朋友可以研究一下。