TOC

This article has been localized into Swedish by the community.

Databindning:

Omvandling av värden med IvalueConverter

Hittills har vi utnyttjat enkla databindningar där den sändande och mottagande egenskapen var kompatibla. Du kommer emellertid snart att hamna i situationer där du vill binda ett värde av en viss typ men presentera det lite annorlunda.

När skall man använda en värdeomvandlare

Värdeomvandlare används flitigt i samband med databindningar. Här är några enkla exempel:

  • Du har ett numeriskt värde men du vill uppvisa värdet noll i en riktning och ett positivt värde i en annan
  • Du vill checka en ”CheckBox” baserat på ett värde som inte är ”boolean” utan en sträng som ”ja” eller ”nej”
  • Du har en fil med en viss storlek i bytes, men du vill presentera den i form av bytes, kilobytes, megabytes eller gigabytes beroende på dess storlek

Detta illustrerar några enkla fall, men det finns många fler. Du vill t. ex. checka en checkbox baserat på ett ”boolean” värde men du vill invertera det så att checkboxen checkas om värdet är falskt och vise versa. Du kan t. o. m. använda en värdeomvandlare för att generera en bild till en ”ImageSource” baserat på ett värde, t. ex. en bild på en grön skylt för ”sant” och sn bild på en röd skylt för ”falskt” - möjligheterna är i stort sett oändliga!

I sådana situationer kan du utnyttja en värdeomvandlare. Små klasser som implementerar gränssnittet ”IvalueConverter” kommer att tjäna som mellanhänder och översätta värden mellan källan och destinationen. Om du vid något tillfälle behöver transformera ett värde innan det når sin destination behöver du troligen en omvandlare.

Implementering av en enkel värdeomvandlare

Som tidigare nämnts behöver en värdeomvandlare inom WPF implementera gränssnittet ”IvalueConverter”, eller alternativt, gränssnittet ”ImultiValueConverter” (vi återkommer till detta senare). Båda gränssnitten kräver bara att du implementerar två metoder: ”Convert()” och ”ConvertBack()”. Som namnen indikerar skall dessa metoder omvandla värden till destinationens format och tillbaka igen.

Låt oss implementera en enkel omvandlare som omvandlar en sträng till ett ”boolean” värde och tillbaka igen. Om du saknar WPF-erfarenhet, vilket du troligen gör eftersom du läser denna kurs, kommer du kanske inte känna till alla koncept som utnyttjas i exemplet, men var inte orolig, de kommer alla att förklaras efter koden:

<Window x:Class="WpfTutorialSamples.DataBinding.ConverterSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
		xmlns:local="clr-namespace:WpfTutorialSamples.DataBinding"
        Title="ConverterSample" Height="140" Width="250">
	<Window.Resources>
		<local:YesNoToBooleanConverter x:Key="YesNoToBooleanConverter" />
	</Window.Resources>
	<StackPanel Margin="10">
		<TextBox Name="txtValue" />
		<WrapPanel Margin="0,10">
			<TextBlock Text="Current value is: " />
			<TextBlock Text="{Binding ElementName=txtValue, Path=Text, Converter={StaticResource YesNoToBooleanConverter}}"></TextBlock>
		</WrapPanel>
		<CheckBox IsChecked="{Binding ElementName=txtValue, Path=Text, Converter={StaticResource YesNoToBooleanConverter}}" Content="Yes" />
	</StackPanel>
</Window>
using System;
using System.Windows;
using System.Windows.Data;

namespace WpfTutorialSamples.DataBinding
{
	public partial class ConverterSample : Window
	{
		public ConverterSample()
		{
			InitializeComponent();
		}
	}

	public class YesNoToBooleanConverter : IValueConverter
	{
		public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
		{
			switch(value.ToString().ToLower())
			{
				case "yes":
				case "oui":
					return true;
				case "no":
				case "non":
					return false;
			}
			return false;
		}

		public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
		{
			if(value is bool)
			{
				if((bool)value == true)
					return "yes";
				else
					return "no";
			}
			return "no";
		}
	}
}

Bakomliggande kod

Så låt oss starta bakifrån då vi går igenom exemplet. Vi har implementerat en omvandlare i klassen benämnd ”YesNoToBooleanConverter”. Som vi har indikerat implementerar koden de två obligatoriska metoderna ”Convert()” och ”ConvertBack()”. Den första metoden förutsätter en sträng som insignal (parametern value) som sedan omvandlas till ett ”true”- eller ”false”-värde, med ett ”false” som ”fallback”-värde. På kul har vi också lagt till möjligheten med franska ingångsvärden.

Metoden ”ConvertBack()” skall förstås göra motsatsen: ett ingångsvärde av typ ”boolean” omvandlas till de engelska orden ”yes” eller ”no”, med värdet ”no” som ”fallback”-värde.

Du kanske undrar över metodernas övriga parametrar, men de behövs inte i detta exempel. Vi återkommer till dessa i ett av de följande kapitlen, där de kommer att förklaras.

XAML

I programmets XAML-del börjar vi med att deklarera en instans av vår omvandlare som en ”window”-resurs. Vi har en ”TextBox”, några ”TextBlock” och en ”CheckBox” och nu kan det börja hända intressanta saker: Vi binder ”TextBox”-värdet till ”TextBlock” och ”CheckBox” genom att använda ”Converter”-egenskapen och referensen till vår egen omvandlare, omvandlingen sker fram och tillbaka mellan sträng och ”boolean” värde beroende på vad som behövs.

Om du kör detta exempel kan du ändra värden på två ställen: Genom att skriva ”yes” eller ”oui” (eller annan text om du vill ha resultatet ”false”) i textrutan eller genom att checka checkboxen. Oavsett vilket kommer ändringen att återspeglas i övriga kontroller och i textblocket.

Sammanfattning

Detta var ett exempel på en enkel värdeomvandlare; vi gjorde den lite längre än nödvändigt för demonstrationens skull. I nästa kapitel skall vi studerat ett mer avancerat exempel, men innan du sätter igång med att konstruera din egen omvandlare kanske du bör kolla vad WPF kan erbjuda. I skrivande stund finns det mer än 20 inbyggda omvandlare som du kan utnyttja, men du måste förstås känna till deras namn. Följande lista kan vara användbar: http://stackoverflow.com/questions/505397/built-in-wpf-ivalueconverters


This article has been fully translated into the following languages: Is your preferred language not on the list? Click here to help us translate this article into your language!