{"id":55000069,"date":"2016-12-01T00:00:00","date_gmt":"2020-03-27T19:24:12","guid":{"rendered":"http:\/\/access-im-unternehmen.aix-dev.de\/aiu\/?p=69"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-30T00:00:00","slug":"EDM_Kundendetails_verwalten","status":"publish","type":"post","link":"https:\/\/vbentwickler.de\/EDM_Kundendetails_verwalten\/","title":{"rendered":"EDM: Kundendetails verwalten"},"content":{"rendered":"

\"Die<\/p>\n

Bild 1: Die Seite zum Bearbeiten und Anlegen von Kunden<\/span><\/b><\/p>\n

In unserer Lösung zur Verwaltung von Bestellungen spielt die Kundenverwaltung natürlich eine große Rolle. In diesem Artikel wollen wir uns ansehen, wie wir einen neuen Kunden anlegen oder einen vorhandenen Kunden bearbeiten können – eingebettet natürlich in unser Hauptfenster, das wir im Artikel “Kunden verwalten” beleuchten. Daher benötigen wir auch kein eigenes Fenster, um die Kundendetails anzuzeigen, sondern erstellen ein Page-Objekt mit den relevanten Informationen. Dieses nutzen wir dann sowohl zum Anlegen neuer Kunden als auch zum Bearbeiten vorhandener Kunden.<\/b><\/p>\n

Die Seite zum Bearbeiten und Erstellen von Kunden soll in Aktion wie in Bild 1 aussehen. Wenn der Benutzer auf den Ribbon-Eintrag Kundenübersicht <\/b>klickt, soll die Kundenliste erscheinen, über die per Doppelklick einer der Kunden in der hier gezeigten Detailansicht erscheinen soll. Wenn der Benutzer auf die Schaltfläche Neuer Kunde <\/b>klickt, erscheint die gleiche Seite, allerdings mit einem leeren Kunden<\/b>-Objekt.<\/p>\n

\"Die<\/p>\n

Bild 1: Die Seite zum Bearbeiten und Anlegen von Kunden<\/span><\/b><\/p>\n

Kundendetails-Seite anlegen<\/h2>\n

Um die Kunden zu bearbeiten, legen Sie in unserem Projekt Bestellverwaltung <\/b>ein Objekt des Typs Seite <\/b>an. Wir wollen diese Seite in ein Frame<\/b>-Element einblenden, wann immer die Bearbeitung eines Kunden nötig ist – oder wenn ein neuer Kunde angelegt werden soll. Erstmal müssen wir die Seite jedoch erstellen und mit den entsprechenden Steuerelementen sowie dem Code zum Füllen der Steuerelemente mit den Daten ausstatten. Die Seite soll im Entwurf wie in Bild 2 aussehen. Die zweite und die vierte Spalte haben wir so ausgelegt, dass sie sich beim Verbreitern des Page<\/b>-Elements ebenfalls im gleichen Maße verbreitern – allerdings nur bis zu einer bestimmten maximalen Breite.<\/p>\n

\"Die<\/p>\n

Bild 2: Die Seite zum Bearbeiten und Anlegen von Kunden im Entwurf<\/span><\/b><\/p>\n

Standardwerte für Steuerelementeigenschaften<\/h2>\n

Den WPF-Code für diese Seite finden Sie in Listing 1. Zu Beginn des Codes haben wir im Breich Page.Resources <\/b>einige Style<\/b>-Elemente hinzugefügt. Style<\/b>-Elemente dienen der Festlegung von Werten für bestimmte Attribute von WPF-Elementen. Das erste verwendet für das Attribut TargetType <\/b>den Wert Label<\/b>, das heißt, dass es Standardwerte für Label<\/b>-Elemente vorgibt. In diesem Fall legen wir mit den untergeordneten Elementen des Typs Setter <\/b>jeweils die Eigenschaft (Property<\/b>) und den Wert (Value<\/b>) der Voreinstellung fest. Das Attribut HorizontalAlignment <\/b>soll den Standardwert Left <\/b>erhalten, Margin <\/b>den Wert 3 <\/b>und VerticalAlignment <\/b>den Wert Center<\/b>. Diese Werte brauchen wir dann nicht mehr explizit für die Steuerelemente des Typs Label <\/b>festzulegen. Sollten wir an einer bestimmten Stelle einmal andere Werte benötigen, tragen Sie diese einfach für das entsprechende Label<\/b>-Element ein.<\/p>\n

<Page x:Class=\"Bestellverwaltung.Kundendetails\"\r\n       ...\r\n       d:DesignHeight=\"250\" d:DesignWidth=\"450\"\r\n       Title=\"Kundendetails\">\r\n     <Page.Resources>\r\n         <Style TargetType=\"Label\">\r\n             <Setter Property=\"HorizontalAlignment\" Value=\"Left\"><\/Setter>\r\n             <Setter Property=\"Margin\" Value=\"3\"><\/Setter>\r\n             <Setter Property=\"VerticalAlignment\" Value=\"Center\"><\/Setter>\r\n         <\/Style>\r\n         <Style TargetType=\"TextBox\">\r\n             <Setter Property=\"Height\" Value=\"23\"><\/Setter>\r\n             <Setter Property=\"Margin\" Value=\"3\"><\/Setter>\r\n             <Setter Property=\"VerticalAlignment\" Value=\"Center\"><\/Setter>\r\n         <\/Style>\r\n     <\/Page.Resources>\r\n     <Grid x:Name=\"grid1\" HorizontalAlignment=\"Stretch\" Margin=\"8,8,0,0\" VerticalAlignment=\"Top\">\r\n         <Grid.ColumnDefinitions>\r\n             <ColumnDefinition Width=\"Auto\" \/>\r\n             <ColumnDefinition Width=\"*\" MaxWidth=\"300\"\/>\r\n             <ColumnDefinition Width=\"Auto\"\/>\r\n             <ColumnDefinition Width=\"*\" MaxWidth=\"300\"\/>\r\n         <\/Grid.ColumnDefinitions>\r\n         <Grid.RowDefinitions>\r\n             <RowDefinition Height=\"Auto\"\/>\r\n             ...\r\n         <\/Grid.RowDefinitions>\r\n         <Label Content=\"ID:\" Grid.Column=\"0\" \/>\r\n         <TextBox x:Name=\"txtID\" Grid.Column=\"1\" HorizontalAlignment=\"Left\" Text=\"{Binding kunde.ID, Mode=TwoWay, \r\n             NotifyOnValidationError=true, ValidatesOnExceptions=true}\" Width=\"50\" IsEnabled=\"False\" BorderBrush=\"Transparent\"\/>\r\n         <Label Content=\"Firma:\" Grid.Column=\"0\" Grid.Row=\"1\" \/>\r\n         <TextBox x:Name=\"txtFirma\" ... Text=\"{Binding kunde.Firma, ...}\" \/>\r\n         <Label Content=\"Anrede ID:\" Grid.Column=\"0\" Grid.Row=\"2\" \/>\r\n         <ComboBox x:Name=\"cboAnreden\" Grid.Column=\"1\" HorizontalAlignment=\"Stretch\" Height=\"23\" Grid.Row=\"2\" \r\n             ItemsSource=\"{Binding Anreden}\" SelectedItem=\"{Binding kunde.Anreden}\" DisplayMemberPath=\"Bezeichnung\" \r\n             SelectedValuePath=\"ID\" VerticalAlignment=\"Center\" Margin=\"3\"><\/ComboBox>\r\n         <Label Content=\"Vorname:\" ... \/><TextBox x:Name=\"txtVorname\" ... Text=\"{Binding kunde.Vorname, ...}\" \/>\r\n         <Label Content=\"Nachname:\" ... \/><TextBox x:Name=\"txtNachname\" ... Text=\"{Binding kunde.Nachname, ...}\" \/>\r\n         <Label Content=\"Geburtsdatum:\" ...\/>\r\n         <DatePicker x:Name=\"dpGeburtsdatum\" ... SelectedDate=\"{Binding kunde.Geburtsdatum, ...}\" Margin=\"3\"\/>\r\n         <Label Content=\"Strasse:\" ... \/><TextBox x:Name=\"txtStrasse\" ... Text=\"{Binding kunde.Strasse, ...}\" \/>\r\n         <Label Content=\"PLZ:\" ... \/><TextBox x:Name=\"txtPLZ\" Text=\"{Binding kunde.PLZ, ...}\" \/>\r\n         <Label Content=\"Ort:\" ... \/> <TextBox x:Name=\"txtOrt\" ... Text=\"{Binding kunde.Ort, ...}\" \/>\r\n         <Label Content=\"Telefon:\" ... \/><TextBox x:Name=\"txtTelefon\" ... Text=\"{Binding kunde.Telefon, ...}\" \/>\r\n         <Label Content=\"EMail:\" ... \/><TextBox x:Name=\"txtEMail\" ... Text=\"{Binding kunde.EMail, ...}\" \/>\r\n         <Button x:Name=\"btnSpeichern\" Click=\"btnSpeichern_Click\" Grid.Row=\"6\" Grid.Column=\"0\" Height=\"23\" \r\n             Content=\"Speichern\"><\/Button>\r\n     <\/Grid>\r\n<\/Page><\/pre>\n
Listing 1: WPF-Code für die Seite Kundendetails<\/span><\/b><\/p>\n
Auch für das TextBox<\/b>-Steuerelement haben wir drei Attribute vordefiniert, nämlich Height <\/b>(Wert: 23<\/b>), Margin <\/b>(3<\/b>) und VerticalAlignment <\/b>(Center<\/b>).<\/p>\n
Damit erhalten wir nicht nur den Vorteil, diese Werte nicht mehr explizit einstellen zu müssen. Wir brauchen außerdem auch Änderungen, die alle Elemente des gleichen Typs betreffen, nur noch an einer Stelle vorzunehmen.<\/p>\n
Das Grid<\/h2>\n
Unser Grid soll vier Spalten und sieben Zeilen enthalten. Für die Spalten 1 und 3 haben wir die Breite Auto <\/b>festgelegt, für die Spalten 2 und 4 den Wert * <\/b>sowie die maximale Breite von 300<\/b>.<\/p>\n
Die einzelnen Steuerelemente weisen wir den Zellen des Grids zu, indem wir die Eigenschaften Grid.Column <\/b>und Grid.Row <\/b>auf die entsprechenden 0-basierten Werte einstellen.<\/p>\n
Die gebundenen Steuerelemente<\/h2>\n
Mö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
\n\n\t\t\n\t\t