Teil von  SELFPHP
  +++ SELFPHP CronJob-Service :: Jetzt auch als Professional-Version verfügbar! +++

:: Anbieterverzeichnis ::

Globale Branchen

Informieren Sie sich über ausgewählte Unternehmen im Anbieterverzeichnis von SELFPHP  

 

:: SELFPHP Forum ::

Fragen rund um die Themen PHP? In über 120.000 Beiträgen finden Sie sicher die passende Antwort!  

 

:: Newsletter ::

Abonnieren Sie hier den kostenlosen SELFPHP Newsletter!

Vorname: 
Name:
E-Mail:
 
 

:: Qozido ::

Die Bilderverwaltung mit Logbuch für Taucher und Schnorchler.   

 
 
Grundlagen von Expression Blend


SELFPHP Produktempfehlung
Microsoft Windows Server 2008
Seite Windows Server 2008
Seite

Microsoft SQL Server 2008
Seite SQL Server 2008
Seite

Microsoft Expression Web 3
Seite Microsoft Expression
Seite


Kapseln von Fragmenten in UserControls
Es gibt in der Praxis immer wieder die Anforderung, ganze Bestandteile eines Quellcodes zu kapseln und wiederverwendbar abzulegen. In den vorangehenden Abschnitten in diesem Kapitel haben Sie folgende Kapselungsverfahren kennengelernt:

  • Einzelne Eigenschaftswerte anhand von Ressourcen
  • Eigenschaftswerte-Sets anhand von Formatvorlagen
  • Ganze Erscheinungsbilder von Steuerelernenten anhand von Steuerelementvorlagen

In diesem Abschnitt zeige ich Ihnen nun, wie Sie ganze Fragmente eines Dokuments inklusive Animation und Auslöser als separate Dokumente extrahieren und wiederverwenden können.

In diesem Beispiel werden wir eine gekapselte Datei mit einern sich drehenden Rechteck erstellen und diese Datei mehrfach in einern anderen Dokument verwenden. Gehen Sie dazu wie folgt vor:

  1. Erstellen Sie ein neues WPF-Projekt.
  2. Klicken Sie im Projektpanel das Projekt mit der rechten Maustaste an und wählen Sie Neues Element hinzufügen.
  3. Im sich öffnenden Dialogfeld wählen Sie UserControl und geben einen Namen für die neue Datei an. Geben Sie einen beliebigen Namen ein, zum Beispiel UserControll.xaml. Lassen Sie das Kontrollkästchen Code-Datei einschließen aktiviert und bestätigen Sie mit OK. Eine neue Datei mit dem von Ihnen angegebenen Namen wird im Projektordner erzeugt und geöffnet.

    Falls Sie versucht haben, als Namen UserControl.xaml einzugeben, so werden Sie erst beim Versuch, die Anwendung zu kompilieren, in einer Fehlermeldung darüber informiert, dass der Name eines Members nicht gleich lauten darf wie der Name seines Typs.

  4. Fügen Sie ein Rechteck in das LayoutRoot des neuen Dokuments ein und füllen Sie es mit einer Farbe oder einern Farbverlauf.
  5. Erstellen Sie ein neues Storyboard. Setzen Sie den Zeitmarker in der Zeitachse auf Sekunde 3, selektieren Sie das Rechteck und geben Sie im Eigenschaftenpanel in der Kategorie Transformation und der Unterrubrik Drehung einen Drehwinkel von 360 Grad an (siehe Abbildung 3.39). Das Rechteck zeigt logischerweise keine Veränderung, wir haben es einmal vollständig gedreht und es befindet sich wieder an der Ausgangsposition. Wenn Sie aber das Storyboard ablaufen lassen, sehen Sie die Drehung.

    Abbildung 3.39: UserControl mit einem gedrehten Rechteck



    Abbildung 3.40: Etwas versteckt: Die Storyboardeigenschaften nach Klicken aufdessen Namen



  6. Klicken Sie im Bereich Objekte und Zeitachsen, wie aus Abbildung 3.40 ersichtlich, auf den Namen des Storyboards. Es werden die Eigenschaften des Storyboards im Eigenschaftenpanel angezeigt.
  7. Geben Sie für die Eigenschaft RepeatBehavior den Wert Forever an. Das veranlasst das Storyboard, eine Schleife zu durchlaufen. Da wir Start- und Endpunkt der Rotation identisch gesetzt haben, wird die Animation eine flüssige Bewegung sein.
  8. Klicken Sie im Interaktionspanel auf +Ereignis und geben Sie als Ereignis UserControl.MouseEnter an, als Storyboard wählen Sie darunter den Namen Ihres Storyboards mit der Drehung, als Aktion wählen Sie Pause. Diese Einstellung bewirkt, dass die Drehung anhält, wenn die Maus über das UserControl fährt.
  9. Klicken Sie im Interaktionspanel auf +Ereignis und geben Sie als Ereignis UserControl.MouseLeave an, als Storyboard wählen Sie darunter den Namen Ihres Storyboards mit der Drehung, als Aktion wählen Sie Resume. Diese Einstellung bewirkt, dass sich das Element dann weiterdreht, wenn sich die Maus nicht mehrüber dem UserControl befindet. Eine Darstellung dieser Einstellung finden Sie in Abbildung 3.41.

    Abbildung 3.41: Einstellungen für eine Storyboardsteuerung in einem UserControl



    Mit Einfügen eines UserControls wird ein mit dem OnLoad-Ereignis verknüpftes Storyboard bereits wie konfiguriert auf der Zeichenfläche gestartet und somit lehnt sich die Darstellung der Zeichenfläche sehr eng an die spätere Ausführung an.

  10. Kompilieren Sie die Anwendung, indern Sie den Menübefehl Projekt/Projektmappe erstellen wählen oder die Tastenkombination [STRG][SHIFT][B] drücken. Erst durch das Kompilieren weiß Expression Blend sozusagen vorn UserControl, und wir können es nun in unserem Hauptdokument einsetzen.
  11. Wechseln Sie zum Ursprungsdokument, in unserem Beispiel die Datei namens Window1.xaml.
  12. Ändern Sie den Typ des LayoutRoots von Crid zu StackPanel.
  13. Öffnen Sie die Objektbibliothek durch Klicken auf die beiden nach rechts zeigenden Pfeile ganz unten in der Werkzeugpalette.
  14. Auf der Registerkarte Benutzerdefinierte Steuerelemente ist das gerade erstellte UserControl gelistet. Wählen Sie es durch einmaliges Klicken an. Es ist jetzt in der Werkzeugpalette an vorletzter Position eingefügt.
  15. Doppelklicken Sie auf das UserControl in der Werkzeugpalette, sodass Sie es wiederholt wie in Abbildung 3.42 in das StackPanel einfügen.
  16. Starten Sie die Anwendung über den Menübefehl Projekt/Projektmappe testen oder über die Taste [F5]. Wie in Abbildung 3.43 zu sehen, setzen sich alle Rechtecke erwartungsgemäß mit dem Start der Anwendung in Bewegung. Wenn Sie die Mausüber einern der Rechtecke positionieren, stoppt die Animation des Rechtecks unter dem Mauszeiger. Verlässt der Mauszeiger das Rechteck, wird die Animation fortgesetzt.

    Das aufgeführte Beispiel eines UserControls zeigt einen wichtigen Sachverhalt: Zwar handelt es sich bei dem UserControl um eine einzige Datei. Bei seinem mehrfachen Einsatz in einem Dokument wird aber klar, dass die Ereignisse für jedes UserControl einzeln und separat verarbeitet werden. Programmierern ist dieser Sachverhalt natürlich aus der Objektorientierung bekannt: Das UserControl ist eine Klasse, welche wie eine Art Schablone fungiert. Die eingesetzten UserControls sind autarke, quasi nach der Schablone erstellte Instanzen der Klasse.

    Abbildung 3.42: Mehrfach eingesetztes UserControl



    Abbildung 3.43: Ein mehrfach eingesetztes UserControl in Form eines animierten Rechtecks


Zusammenfassung
Dieses Kapitel stellte den ersten Werkzeugkasten dar, um ein User Interface zu gestalten. Es wurden grundlegende Vorgehensweisen mit Expression Blend thematisiert. Im nächsten Kapitel folgen theoretische und absolut notwendige wissenschaftliche Betrachtung zum Thema User-Interface-Design. Mit diesem Handwerkszeug ausgestattet wird ab Kapitel 5 ein Projekt realisiert: Die Gestaltung eines User Interface für eine Kassen-Anwendung - angefangen bei der Planung und Analyse der Rahmenbedingungen bis zur tatsächlichen Realisierung.



Seite 17 von 17 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17



Copyright © 2010
Microsoft Deutschland GmbH
Alle Rechte vorbehalten.

 Microsoft Deutschland GmbH
 




:: Premium-Partner ::

Webhosting/Serverlösungen


Premium-Partner MECO Systemhaus GmbH & Co. KG
Premium-Partner PSW GROUP GmbH & Co. KG
Premium-Partner BPI-Systeme
Premium-Partner Pixel X
Premium-Partner
 

:: SELFPHP Sponsoren ::


DM Solutions
Microsoft Deutschland GmbH
twosteps.net - ...Premium-Webhosting
Sedo - Bei uns wird PHP großgeschrieben
hostfactory.ch - OptimaNet Schweiz AG
ZEND - The PHP Company
Kaspersky Labs
HighText iBusiness
SELFPHP Sponsoren
 

Qozido


© 2001-2013 E-Mail SELFPHP OHG, info@selfphp.deImpressumKontakt