Einfache
Extension für Prozent
Im Visual Studio (mindestens Professional und installiertem LightSwitch Extensibility
Toolkit) über Datei/Neu/Projekt ein neues Projekt anlegen. Bei der Auswahl der
Vorlagen nehmen wir LightSwitch/Extensibility/..Library(Visual
C#) und nennen es z.B. „Extension_Prozent“. Der Name
taucht dann später in der Erweiterungsliste von LightSwitch
auf.
Wir erhalten sieben vordefinierte Projekte. Daraus machen
wir jetzt eine „Business Type Extension“. D.h. wir fügen zum Projekt Extension_Prozent.Lspkg über Rechtsklick und
Hinzufügen/Neues Element die Vorlage Business Type mit dem Namen „Prozent“
hinzu.
Als zu überschreibenden Datentyp wählen wir „Decimal“. Dazu wählen wir im Projekt Extension_Prozent.Common/Metadata/Types die Datei Prozent.lsml aus.
In dieser XML-Datei ersetzen wir den „UnderlyingType
mit „:Decimal“ statt „:String“. Der angezeigte Name(DisplayName) ist schon richtig auf „Prozent“ gesetzt (wenn
gewünscht kann man den natürlich noch ändern). Er erscheint später bei den
Typen(wie z.B. Money) und sollte daher sprechend sein.
Es wird automatisch ein Control
mit der entsprechenden XAML-Beschreibungsdatei erstellt. Sie ist unter Extension_Prozent.Client/ProzentControl.xaml
zu finden. Standardmäßig enthält sie eine TextBox mit dem Binding zu „StringValue“. Wie der Name schon erahnen lässt, ist das
unser Wert als String und nicht decimal (das wäre
„Value“). Da wir direkt Einfluss auf das Erscheinungsbild nehmen wollen,
benutzen wir „StringValue“.
Einfluss nehmen heißt in unserem Fall, wir wollen den Wert
in der Datenbank für 10 % als 0,1 gespeichert haben, bei der Darstellung soll aber 10 % stehen. Außerdem soll der Benutzer auch in
ihm geläufigen Prozentwerten eingeben können.
Diese Forderungen lassen sich nicht mit reiner Formatierung
erledigen, daher brauchen wir einen Konvertierer, der
bei der Anzeige den Wert formatiert und bei der Eingabe des Benutzers den Wert
durch 100 dividiert. Für diese Konvertierer gibt es
ein vordefiniertes Interface „IValueConverter“, das zwei
Methoden implementiert: „Convert“ für die Anzeige und
„ConvertBack“ für die Eingaben des Benutzers.
Wir wollen also eine Klasse schreiben, die die Konvertierung
am Client für unser Control durchführt. Dazu klicken
wir rechts auf das Clientprojekt/Presentation/Controls
und fügen über Hinzufügen/Klasse eine Klasse mit dem Namen „ProzentwerteKonverter“
hinzu.
Der Code für C# sieht dann z.B. so aus:
///
<summary>
/// Annahme: der
Wertbereich für Prozent in der Datenbank ist 0 - 1
/// der Konverter handhabt
Werteingaben von z.B. 10 und wandelt dies in 0,1
/// </summary>
public class ProzentwerteKonverter : IValueConverter
{
// wird aufgerufen, wenn die Objekt-Eigenschaft an ein Control gebunden wird (Anzeige)
public object Convert(object
value, Type targetType,
object parameter,
System.Globalization.CultureInfo
culture)
{
decimal _Wert = 0M;
if (value == null)
return value;
if (!(decimal.TryParse((string)value,
out _Wert)))
return String.Empty;
return String.Format(culture, "{0:P}", _Wert);
}
// wird bei einem Two-Way-Binding
aufgerufen, wenn der Wert vom Control wieder
// zurück in die Objekteigenschaft geschrieben wird
public object ConvertBack(object value, Type
targetType, object
parameter,
System.Globalization.CultureInfo
culture)
{
decimal _Wert = 0M;
if (value == null)
return value;
string _strWert = value.ToString();
if (String.IsNullOrWhiteSpace(_strWert))
return "0";
// Prozent entfernen
_strWert = _strWert.Replace(culture.NumberFormat.PercentSymbol, string.Empty);
if (decimal.TryParse(_strWert,
out _Wert))
{
// der Wert wird wieder durch 100 dividiert
_Wert /= 100;
}
return _Wert.ToString();
}
}
Visual Studio kann jetzt „IValueConverter“
nicht finden, wir brauchen noch die using Deriktive:
using System.Windows.Data;
Jetzt müssen wir den Konverter noch unserem Control bekannt machen. Dazu erweitern wir unsere
XAML-Datei (ProzentControl.xaml) um den gerade benutzten Namespace(wir nennen den „lokal“):
xmlns:lokal="clr-namespace:Extension_Prozent.Presentation.Controls">
Der Konverter wird als UserControl.Resource
deklariert:
<UserControl.Resources>
<lokal:ProzentwerteKonverter x:Key="ProzentwertKonverter"
/>
</UserControl.Resources>
Zusätzlich müssen wir sie für unser Binding angeben:
<TextBox
Text="{Binding StringValue, Mode=TwoWay, Converter={StaticResource
ProzentwertKonverter}, Name="ProzentTextBox"
/>
Wir benutzen bei der Formatierung die Kultureinstellung. Sie
kommt allerdings nicht automatisch, sondern wir müssen sie angeben. Der
Einfachheit halber geben wir deutsch direkt in unserer TextBox an. Damit sieht
die gesamte XAML-Datei (ProzentControl.xaml) dann so
aus:
<UserControl x:Class="Extension_Prozent.Presentation.Controls.ProzentControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:lokal="clr-namespace:Extension_Prozent.Presentation.Controls">
<UserControl.Resources>
<lokal:ProzentwerteKonverter x:Key="ProzentwertKonverter"
/>
</UserControl.Resources>
<TextBox
Text="{Binding StringValue, Mode=TwoWay, Converter={StaticResource
ProzentwertKonverter}, ConverterCulture=de-DE}"
Name="ProzentTextBox"
/>
</UserControl>
Nach den Änderungen sollten wir über einen Rechtsklick auf
das Extension_Prozent.Client-Projekt und Erstellen,
dieses einzeln erstellen, um die lästigen Fehler zu beseitigen.
Wenn wir den Debug-Mode schon
richtig eingestellt haben (s. How to: Debug
or Test a LightSwitch
Extension), können wir jetzt unser Werk über F5 testen.
Dazu brauchen wir in eine Tabelle Testdaten nur eine
Variable TestProzent anlegen. In der Auswahl für Typ
finden wir aber noch kein Prozent.
Dazu müssen wir zuerst die Extension „scharf schalten“. Über
die Eigenschaften des LightSwitch-Projekts (direkt
unter dem Projektnamen im Projektmappen-Explorer) finden wir links in der
Navigation „Erweiterungen“. Dort gibt es die „Microsoft LightSwitch-Erweiterungen“
mit einem Haken vorne und unser Extension_Prozent,
allerdings ohne Haken. Den holen wir jetzt nach.
Zurück zu unserer Tabelle haben wir jetzt in der Typauswahl
auch unser Prozent. In den Eigenschaften (rechts unten) können wir unter
Skalierung die Anzahl der Nachkommastellen festlegen (z.B. 2) und den
Wertebereich (z.B. Minimalwert 0 und Maximalwert 1 für 100 %).
Möchte man zwischen dem %-Zeichen und der Zahl noch ein
Leerzeichen, so muss man die Formatierung im Konverter ändern
return String.Format(culture, "{0:# %}", _Wert);
Das könnte man natürlich noch in den Eigenschaften von
Prozent konfigurierbar machen(vielleicht später mal).
Außerdem besagt die Fehlermeldung bei Eingabe von über 100
%, dass der Wert 1 oder kleiner sein muss, was für den Anwender, der den Datenbankwert
nicht sieht, verwirrend sein kann. Dies kann man auch noch mit einer eigenen
Validierungsroutine ändern.
Jetzt ist unser Projekt soweit fertig, wir müssen es noch
verpacken zum Ausrollen.
Dazu brauchen wir die Eigenschaften der Extension_Prozent
-Projektsmappe (Rechtsklick auf die Projektmappe und
Eigenschaften). Unter „Konfiguration“ ändern wir die Konfiguration auf
„Release“.
Für Angaben des Autors, Version etc. können wir noch über
einen Doppelklick auf die source.extension.vsixmanifest-Datei
des Extension_Prozent.Vsix-Projekts die Werte dort
ändern.
Jetzt können wir das Projekt erstellen (Rechtsklick Projektmappe
neu erstellen).
Fertig!
Für alle, die kein Visual Studio Professional haben, hier das
Packet zum Herunterladen als
ZIP.