get-the-solution


ItemsSource zu UserControl hinzufügen

By
on Regards: .NET Framework; Archive; C#; XAML;

1. ItemsSource

wenn man ein (User)Control erstellt, benötigt dieses meistens Daten die es verarbeiten bzw. anzeigen soll. Dabei stellt sich die Frage, wie man dem UserControl die zu verarbeitenden Daten übergeben soll. Soll man dies über den DataContext, über eine Methode, oder über eine Propertie realisieren?

Bei den Standard Controls passiert das setzen der Daten über eine DependencyProperty. Für ein UserControl schien mir der Name ItemsSource für die DependencyProperty am geeignetsten. Mit einer DependencyProperty (abkürzung DP) kann man die Daten, nicht nur über den Code-Behind, sondern bequem im XAML dem UserControl “übergeben”. Man setzt dieses Propertie damit das UserControl die Daten verarbeiten und anzeigen kann.

Theoretisch könnte man auch mit dem setzten des DataContext die Daten dem UserControls übergeben. Allerdings ist der DataContext vom Typ object und der Anwender der das UserControl verwendet weiß nicht, welchen DatenTyp das UserControl erwartet. Außerdem sollten wir es vermeiden uns auf Dinge von “außen” zu verlassen.

1.1 Richtiger DatenTyp für die Propertie ItemsSource wählen

Wenn man meint, dass man bei der Wahl des DatenTyps bei der ItemsSource nichts besonderes beachten muss, dann ist man etwas zu voreilig. Das UserControl sollte wenn möglich mit so vielen DatenTyp wie möglich arbeiten können. Das beste Beispiel dazu ist die ListBox oder die ListView. Sie unterstützen Listen, Arrays eben alle DatenTypen welche das Interface IEnumerable implementieren. Deshalb sollte als DatenTyp für die Propertie ItemsSource ein möglichst flexibler DatenTyp zum Einsatz kommen. Das kann man z.B. mit Interfaces erreichen.

1.2 ItemsSource – Daten für die Anzeige vorbereiten

Die ItemsSource im UserControl kann die übergebenen Daten als DataContext setzten. Das erleichter das Binden im UserControl. Besser wäre aber, wenn im UserControl das Binding immer mittels RelativeSource gesetzt wird. Was für einen Grund das hat, wird im nächsten Abschnitt erklärt.

Das UserControl hat eine DependencyProperty ItemsSource. Das UserControl setzt den DataContext auf sich selber. Somit kann man im XAML einfach auf die ItemsSource binden.

<TextBlock Text="{Binding Path=ItemsSource.Text}"></TextBlock>

Folgendes Problem kann auftreten. Das UserControl wird in einem DataTemplate oder in einem anderem verschachtelt Element verwendet. Wenn wir z.B. an unserem UserControl irgend ein Binding setzen kommt es zu einem Binding Error. Aber warum?

Wir gehen davon aus, dass das UserControl genau den gleichen DataContext wie das Window besitzt. Sämtliche Standard UserControls, wie zum Beispiel TextBox’es, ListViews, erben den DataContext vom Übergeordneten Control. Weil aber das UserControl den DataContext auf sich selber setzt, haben wir einen anderen DataContext wie beim Window.

Diese Problem kann man mithilfe der RelativeSource umgehen. Hätte das Binding wie folgt ausgeshene, wäre es egal, welchen DataContext das UserControl besitzt.

<TextBlock Text="{Binding Path=ItemsSource.Text,RelativeSource=
	        {RelativeSource Mode=FindAncestor,AncestorType={x:Type local:UserControlName}}}"></TextBlock>

Dennoch gibt es Gegebenheit in dem ein Binding ohne RelativeSource berechtigt ist.

1.3 UserControl mit der ItemSource vom Type IEnumerable

Im folgenden Beispiel wird eine ItemsSource für ein UserControl erstellt, welches eine Liste von Objekten anzeigt. Die ItemsSource ist eine DependencyProperty und verwendet als DatenTyp das Interface IEnumerable. Somit wird gewährleistet, dass man die Objekte in einer Liste, Array usw. übergeben kann.

Im Beispiel Projekt habe ich eine Solution angelegt, welches ein ClassControl Projekt (beinhaltet UserControl und ObjektTyp) und ein WPF Window Projekt enthält um das UserControl zu testen.

Das UserControl zeigt eine Liste vom Objekttyp Class an. Zugegebenermaßen – der Name ist unpassend gewählt. Der ObjektTyp Class sieht wie folgt aus:

        [assembly: XmlnsDefinition("http://schemas.get.com/winfx/2009/xaml", "ClassControl")]
	namespace ClassControl
	{
	    public class Class
	    {
	        public Class()
	        {
	            StringList = new ObservableCollection<string>();
	        }
	        public string Artikelname { get; set; }
	        public string Foto { get; set; }
	        public ObservableCollection<string> StringList { get; set; }
	    }
	 
	}

Informationen zum Attribut XmlnsDefinition siehe hier. Das UserControl hat eine DependencyPropertie mit dem DatenTyp IEnumerable. Als ContentProperty wird die Propertie ItemsSource angegeben. So muss man im XAML nicht den Tag <ItemsSource> angeben, wenn man die Daten setzen will. Mehr dazu nach dem CodeBehind.

UserControl1.xaml.cs:

        using System.Collections;
	using System.Windows;
	using System.Windows.Controls;
	using System.Windows.Markup;
	 
	[assembly: XmlnsDefinition("http://schemas.get.com/winfx/2009/xaml", "ClassControl")]
	namespace ClassControl
	{
	    /// <summary>
	    /// Interaction logic for UserControl1.xaml
	    /// http://msdn.microsoft.com/de-de/library/system.windows.markup.contentpropertyattribute.aspx
	    /// </summary>
	    [ContentProperty("ItemsSource")]
	    public partial class UserControl1 : UserControl
	    {
	        public UserControl1()
	        {
	            InitializeComponent();
	        }
	        public IEnumerable ItemsSource
	        {
	            get { return (IEnumerable)GetValue(_ItemsSourceProperty); }
	            set { SetValue(_ItemsSourceProperty, value); }
	        }
	 
	        // IEnumerable als Type verwenden - 
                // damit werden die verschiedensten Typen unterstützt wie List<Class>, Array<Class> ...
	        public static readonly DependencyProperty _ItemsSourceProperty =
	            DependencyProperty.Register("ItemsSource", typeof(IEnumerable), typeof(UserControl1), new UIPropertyMetadata(null));
	    }
	}

Das Binding wird mittels RelativeSource umgesetzt.
UserControl1.xaml:

           <UserControl
	    x:Class="ClassControl.UserControl1"
	    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	    xmlns:local="clr-namespace:ClassControl"
	    Background="Red">
	    <UserControl.Resources>
	        <DataTemplate DataType="{x:Type local:Class}">
	            <StackPanel>
	                <Border BorderBrush="Black" BorderThickness="1">
	                    <TextBlock Text="{Binding Path=Artikelname}"></TextBlock>
	                </Border>
	                <Border BorderBrush="Black" BorderThickness="1">
	                    <TextBlock Text="{Binding Path=Foto}"></TextBlock>
	                </Border>
	            </StackPanel>
	        </DataTemplate>
	    </UserControl.Resources>
	    <StackPanel Orientation="Vertical">
	        <!-- Wir verwenden den DataContext vom UserControl nicht;
	        Mit RelativeSource funktioniert das Binding immer, auch wenn der falsche DataContext gesetzt ist. -->
	        <ItemsControl VerticalAlignment="Top" HorizontalAlignment="Left" Margin="2" ItemsSource="{Binding Path=ItemsSource,
	            RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type local:UserControl1}}}" />
	    </StackPanel>
	</UserControl>

Und so bindet man das UserControl im Window ein:

                <!--UserControl mit ItemsSource vom Typ IEnumerable-->
	        <controls:UserControl1 Name="_ClassControl">
	          <!-- Weil das UserControl das Attribut [ContentProperty("ItemsSource")] besitzt,
	            müssen wir den Array nicht implizit der ItemsSource zuweisen z.B. so
	 
	            <controls:UserControl1.ItemsSource>
	
	                <x:Array Type="{x:Type controls:Class}">
	                    <controls:Class Artikelname = "Amazon Buch" Foto = "Buch.jpg"></controls:Class>
	                </x:Array>
	            </controls:UserControl1.ItemsSource>
	            -->
	            <x:Array Type="{x:Type controls:Class}">
	                <controls:Class Artikelname = "Amazon Buch" Foto = "Buch.jpg"></controls:Class>
	                <controls:Class Artikelname = "C#" Foto = "Foto.jpg"></controls:Class>
	                <controls:Class Artikelname = "Lebenslauf Buch" Foto = "Me.jpg"></controls:Class>
	            </x:Array>
	        </controls:UserControl1>

Da das UserControl das ContentPropertie Attribut angegeben hat, muss man nicht zwingend den ItemsSource Tag angeben.

Im Prinzip gibt es bei dieser Thematik nichts kompliziertes, man sollte jedoch die kleinen aber feinen Details genug Beachtung schenken, damit man sich später änderungen am UserControl ersparen kann.

Im Beispiel Projekt wird eine WPF-Benutzersteuerelementbibliothek verwendet. Es sollte beachtet werden, dass ein UserControl keine ControlTemplates unterstützt. Die alternative dazu wäre ein Benutzerdefiniertes WPF-Steuerelementbibliothek Projekt.

 


Subklassen in XAML ansprechen

By
on Regards: .NET Framework; Archive; C#; XAML;

Heute habe ich ein DataTemplate in einer XAML Resource Datei für meine Klasse erstellt. Ich hab als DataTyp meine Subklasse angegeben.

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:Project;assembly=Project">
    <DataTemplate x:Key="myTaskTemplate" DataType="{x:Type local:Subclass}">
      [..]
    </DataTemplate>
</ResourceDictionary> 

Dabei bekam ich beim compilieren immer die Fehlermeldung “Der Typ Subclass wurde nicht gefunden”. Ich hab dann verschiedene Varianten ausprobiert, wie zum Beispiel, Class.Subclass usw..

So gesehen, war ich schon ziemlich nah an der Lösung. Dieses geht wie folgt:

DataType=”{x:Type local:class+subclass}”