- \n
- KundenUebersicht.xaml<\/b>: Diese Seite zeigt eine Liste aller Kunden an und bietet die Möglichkeit, die Kunden nach verschiedenen Kriterien zu durchsuchen. Außerdem enthält sie Schaltflächen zum Anlegen neuer Kunden, zum Löschen von Kunden und zum Bearbeiten eines Kunden.<\/li>\n
- Kundendetails.xaml<\/b>: Diese Seite zeigt die Details zu einem Kunden an. Dazu gehören neben den Daten der Tabelle tblKunden <\/b>auch die von diesem Kunden gebuchten Seminare. Die Seite soll auch die Möglichkeit bieten, Seminare zum Kunden hinzuzufügen oder zu entfernen.<\/li>\n<\/ul>\n
In der ersten Fortsetzung dieses Artikels namens Seminarverwaltung IVb: Kunden und Seminare <\/b>(www.datenbankentwickler.net\/294<\/b>) schauen wir uns die Seiten zur Darstellung der Seminare in der Übersicht und in der Einzelansicht an. Die dort beschriebenen Seiten lauten:<\/p>\n
- \n
- SeminareUebersicht.xaml<\/b>: Die Übersichtsseite für die Seminare soll eine Liste aller Seminare anzeigen. Hier soll der Benutzer eine Suchfunktion vorfinden sowie Schaltflächen zum Anlegen neuer Seminare und zum Bearbeiten oder Löschen von Seminaren.<\/li>\n
- Seminardetails.xaml<\/b>: Die Detailseite eines Seminars zeigt neben den Details des Seminars auch eine Liste der Kunden an, die dieses Seminar gebucht haben. Sie können hier manuell Kunden hinzufügen oder aus der Liste der Teilnehmer entfernen. Außerdem finden Sie hier Funktionen, um den Kunden Informationen zum Seminar zuzusenden – beispielsweise E-Mails mit dem Link zur Teams-Sitzung, in der das Seminar stattfindet, oder für die Aufzeichnung des Seminars.<\/li>\n<\/ul>\n
Schließlich folgt noch der dritte Teil, den wir Seminarverwaltung IVc: Kunden und Seminare <\/b>(www.datenbankentwickler.net\/295<\/b>) genannt haben. In diesem beschreiben wir, wie wir den in den ersten beiden Teilen erläuterten Seiten noch die Elemente hinzufügen, mit denen Sie die Zuordnung von Kunden zu Seminaren verwalten können.<\/p>\n
Die Kundenübersicht<\/h2>\n
Die Kundenübersicht soll alle Kunden in einem ListView<\/b>-Steuerelement anzeigen. Außerdem wollen wir folgende Funktionen bereitstellen:<\/p>\n
- \n
- Öffnen der Details zu einem Kunden per Doppelklick auf den jeweiligen Eintrag<\/li>\n
- Öffnen der Details zu einem Kunden durch Auswahl und anschließendes Betätigen der Bearbeiten<\/b>-Schaltfläche<\/li>\n
- Löschen des aktuell markierten Kunden per Schaltfläche<\/li>\n
- Anlegen eines neuen Kunden per Schaltfläche<\/li>\n
- Suche nach Kunden über den Vornamen und den Nachnamen<\/li>\n<\/ul>\n
Der Entwurf dieser Seite namens Kundendetails.xaml <\/b>sieht wie in Bild 1 aus.<\/p>\n
![\"Entwurf](\"..\/fileadmin\/_temp_\/2021_06\/pic_273_001.png\")
<\/p>\nBild 1: Entwurf der Seite zur Anzeige der Kundenübersicht<\/span><\/b><\/p>\n
Im XAML-Code haben wir ein Grid definiert, das drei Zeilen aufnimmt. Die erste enthält ein StackPanel mit den Suchfeldern, die zweite das ListView<\/b>-Steuerelement und die dritte die Steuerelemente zum Verwalten der angezeigten Kunden:<\/p>\n
<Page x:Class=\"KundenUebersicht\" ... Title=\"KundenUebersicht\">\r\n ...\r\n <Grid>\r\n <Grid.RowDefinitions>\r\n <RowDefinition Height=\"Auto\"><\/RowDefinition>\r\n <RowDefinition Height=\"*\"><\/RowDefinition>\r\n <RowDefinition Height=\"Auto\"><\/RowDefinition>\r\n <\/Grid.RowDefinitions><\/pre>\n
Das StackPanel für die Suche definieren wir mit zwei Textfeldern zur Eingabe von Vorname und\/oder Nachname und einer Schaltfläche zum Ausführen der Suche:<\/p>\n
<StackPanel Orientation=\"Horizontal\">\r\n <Label>Vorname:<\/Label>\r\n <TextBox x:Name=\"txtSucheVorname\" Width=\"100\"><\/TextBox>\r\n <Label>Nachname:<\/Label>\r\n <TextBox x:Name=\"txtSucheNachname\" Width=\"100\"><\/TextBox>\r\n <Button x:Name=\"btnSuchen\" Click=\"btnSuchen_Click\">\r\n <StackPanel Orientation=\"Horizontal\">\r\n <Image Source=\"images\/find_text.png\" Width=\"24\" Height=\"24\"><\/Image>\r\n <\/StackPanel>\r\n <\/Button>\r\n <\/StackPanel><\/pre>\n
Das ListView<\/b>-Steuerelement namens lvwKunden <\/b>ist an die Auflistung Kunden <\/b>aus dem Code behind-Modul gebunden. Es erlaubt das Auswählen jeweils eines Elements und bei einem Doppelklick soll eine Ereignismethode ausgelöst werden. Die einzelnen anzuzeigenden Spalten definieren wir mit GridViewColumn<\/b>-Elementen:<\/p>\n
<ListView x:Name=\"lvwKunden\" Grid.Row=\"1\" ItemsSource=\"{Binding Kunden}\" SelectionMode=\"Single\" MouseDoubleClick=\"lvwKunden_MouseDoubleClick\">\r\n <ListView.View>\r\n <GridView>\r\n <GridViewColumn Header=\"ID\" DisplayMemberBinding=\"{Binding ID}\" \/>\r\n <GridViewColumn Header=\"Firma\" DisplayMemberBinding=\"{Binding Firma}\" \/>\r\n <GridViewColumn Header=\"Vorname\" DisplayMemberBinding=\"{Binding Vorname}\" \/>\r\n <GridViewColumn Header=\"Nachname\" DisplayMemberBinding=\"{Binding Nachname}\" \/>\r\n <GridViewColumn Header=\"Straße\" DisplayMemberBinding=\"{Binding Strasse}\" \/>\r\n <GridViewColumn Header=\"PLZ\" DisplayMemberBinding=\"{Binding PLZ}\" \/>\r\n <GridViewColumn Header=\"Ort\" DisplayMemberBinding=\"{Binding Ort}\" \/>\r\n <GridViewColumn Header=\"Land\" DisplayMemberBinding=\"{Binding Land}\" \/>\r\n <GridViewColumn Header=\"E-Mail\" DisplayMemberBinding=\"{Binding EMail}\" \/>\r\n <\/GridView>\r\n <\/ListView.View>\r\n <\/ListView><\/pre>\nDie dritte Zeile des Grid<\/b>-Elements enthält ein weiteres StackPanel<\/b>-Element mit den Steuerelementen zum Verwalten der Kunden – hier mit Schaltflächen zum Schließen des Bereichs (btnOK<\/b>), zum Anlegen neuer Kunden (btnNeu<\/b>), zum Anzeigen des aktuellen Kunden (btnDetails<\/b>) und zum Löschen des aktuell markierten Kunden (btnLoeschen<\/b>):<\/p>\n
<StackPanel Orientation=\"Horizontal\" Grid.Row=\"2\">\r\n <Button x:Name=\"btnOK\" Click=\"btnOK_Click\">\r\n <StackPanel Orientation=\"Horizontal\">\r\n <Image Source=\"images\/ok.png\" Width=\"24\" Height=\"24\"><\/Image>\r\n <Label>OK<\/Label>\r\n <\/StackPanel>\r\n <\/Button>\r\n <Button x:Name=\"btnNeu\" Click=\"btnNeu_Click\">\r\n <StackPanel Orientation=\"Horizontal\">\r\n <Image Source=\"images\/add.png\" Width=\"24\" Height=\"24\"><\/Image>\r\n <Label>Neu<\/Label>\r\n <\/StackPanel>\r\n <\/Button>\r\n <Button x:Name=\"btnDetails\" Click=\"btnDetails_Click\">\r\n <StackPanel Orientation=\"Horizontal\">\r\n <Image Source=\"images\/pencil.png\" Width=\"24\" Height=\"24\"><\/Image>\r\n <Label>Bearbeiten<\/Label>\r\n <\/StackPanel>\r\n <\/Button>\r\n <Button x:Name=\"btnLoeschen\" Click=\"btnLoeschen_Click\">\r\n <StackPanel Orientation=\"Horizontal\">\r\n <Image Source=\"images\/delete.png\" Width=\"24\" Height=\"24\"><\/Image>\r\n <Label>Löschen<\/Label>\r\n <\/StackPanel>\r\n <\/Button>\r\n <\/StackPanel>\r\n <\/Grid>\r\n<\/Page><\/pre>\n
Anzeigen der Kunden im ListView-Steuerelement<\/h2>\n
Im Code behind-Modul benötigen wir den folgenden Namespace-Verweis:<\/p>\n
Imports System.Collections.ObjectModel<\/pre>\n
Außerdem deklarieren wir hier die folgenden Variablen:<\/p>\n
Private <\/span>dbContext As <\/span>New<\/span> SeminarverwaltungContext\r\nPrivate <\/span>_kunden As <\/span>ObservableCollection(Of Kunde)\r\nPrivate <\/span>objFrame As <\/span>Frame\r\nPrivate <\/span>objListCollectionView As <\/span>ListCollectionView<\/pre>\nBeim Initialisieren der Seite wird die Konstruktor-Methode ausgelöst. Diese erwartet als Parameter einen Verweis auf das übergeordnete Frame<\/b>-Element, beispielsweise zum Leeren des Frame<\/b>-Elements, wenn die Seite geschlossen wird. Diesen Verweis speichert die Prozedur in der Variablen objFrame<\/b>. Außerdem initialisiert die Methode die Komponente (InitializeComponent<\/b>), füllt die Liste der Kunden, weist sich selbst dem DataContext <\/b>zu und referenziert mit objListCollectionView <\/b>eine Sicht auf die Auflistung Kunden<\/b>. Schließlich stellt sie die Methode Kundenfilter <\/b>als auszuführende Methode beim Aufruf des Filters der ListCollectionView <\/b>ein:<\/p>\n
Public Sub <\/span>New(fra As <\/span>Frame)\r\n objFrame = fra\r\n InitializeComponent()\r\n Kunden = New<\/span> ObservableCollection(Of Kunde)(dbContext.Kunden)\r\n DataContext = Me\r\n objListCollectionView = CollectionViewSource.GetDefaultView(Kunden)\r\n objListCollectionView.Filter = AddressOf Kundenfilter\r\nEnd Sub<\/span><\/pre>\nDie öffentliche Eigenschaft Kunden <\/b>erfasst die Auflistung der Kunden und stellt diese als Quelle für das ListView<\/b>-Steuerelement zur Verfügung:<\/p>\n
Public Property <\/span>Kunden As <\/span>ObservableCollection(Of Kunde)\r\n Get\r\n Return _kunden\r\n End Get\r\n Set(value As <\/span>ObservableCollection(Of Kunde))\r\n _kunden = value\r\n End Set<\/span>\r\nEnd Property<\/span><\/pre>\nFiltern nach dem Vornamen und dem Nachnamen<\/h2>\n
Die Steuerelemente im oberen Bereich der Kundenübersicht erlauben die Eingabe eines Vornamens und einen Nachnamens, nach dem gefiltert werden soll. Für die Eigenschaft Filter <\/b>des ListCollectionView<\/b>-Elements haben wir weiter oben bereits die Funktion Kundenfilter <\/b>zugewiesen. Die Funktion Kundenfilter <\/b>wird beim Filtern der ListCollectionView <\/b>für jeden Datensatz einmal aufgerufen. Dabei erfasst sie den Vornamen und den Nachnamen des aktuellen Kunde<\/b>-Elements und schreibt diese beziehungsweise gegebenenfalls eine leere Zeichenkette in die Variablen strVorname <\/b>und strNachname<\/b>. Dann prüft sie, ob Nachname und Vorname mit den Werten aus txtSucheNachname <\/b>beziehungsweise txtSucheVorname <\/b>beginnen. Falls nicht, wird der Wert False <\/b>zurückgegeben. Ist beides erfüllt, gibt die Funktion den Wert True <\/b>zurück und des jeweilige Element wird angezeigt:<\/p>\n
Private Function <\/span>Kundenfilter(item As Object<\/span>) As Boolean<\/span>\r\n Dim <\/span>objKunde As <\/span>Kunde\r\n Dim <\/span>strVorname As String<\/span>\r\n Dim <\/span>strNachname As String<\/span>\r\n objKunde = TryCast(item, Kunde)\r\n strVorname = IIf(objKunde.Vorname = Nothing, \"\", objKunde.Vorname)\r\n strNachname = IIf(objKunde.Nachname = Nothing, \"\", objKunde.Nachname)\r\n If <\/span>Not<\/span> (strNachname.StartsWith(txtSucheNachname.Text, StringComparison.OrdinalIgnoreCase)) Then<\/span>\r\n Return False<\/span>\r\n End If<\/span>\r\n If <\/span>Not<\/span> (strVorname.StartsWith(txtSucheVorname.Text, StringComparison.OrdinalIgnoreCase)) Then<\/span>\r\n Return False<\/span>\r\n End If<\/span>\r\n Return True<\/span>\r\nEnd Function<\/span><\/pre>\nMöchten Sie weiterlesen? Dann lösen Sie Ihr Ticket!<\/span>
\nHier geht es zur Bestellung des Jahresabonnements des Magazins Visual Basic Entwickler<\/strong>:<\/span>
\nZur Bestellung ...<\/a><\/span>
\nDanach greifen Sie sofort auf alle rund 200 Artikel<\/strong> unseres Angebots zu - auch auf diesen hier!<\/span>
\nOder haben Sie bereits Zugangsdaten? Dann loggen Sie sich gleich hier ein:<\/span><\/p>\n<\/div>\n\n\t\n\t
- Seminardetails.xaml<\/b>: Die Detailseite eines Seminars zeigt neben den Details des Seminars auch eine Liste der Kunden an, die dieses Seminar gebucht haben. Sie können hier manuell Kunden hinzufügen oder aus der Liste der Teilnehmer entfernen. Außerdem finden Sie hier Funktionen, um den Kunden Informationen zum Seminar zuzusenden – beispielsweise E-Mails mit dem Link zur Teams-Sitzung, in der das Seminar stattfindet, oder für die Aufzeichnung des Seminars.<\/li>\n<\/ul>\n
- Kundendetails.xaml<\/b>: Diese Seite zeigt die Details zu einem Kunden an. Dazu gehören neben den Daten der Tabelle tblKunden <\/b>auch die von diesem Kunden gebuchten Seminare. Die Seite soll auch die Möglichkeit bieten, Seminare zum Kunden hinzuzufügen oder zu entfernen.<\/li>\n<\/ul>\n