Freigeben über


Formatierungstipps für das "PasswordBox"-Steuerelement

Ee341382.0b2c798e-86c6-4ea2-a8a6-5cf1f12be1e2(de-de,Expression.40).png

Verwenden Sie die integrierten PasswordBox -Steuerelementvorlagen, um eine benutzerdefinierte PasswordBox -Vorlage zu erstellen. Ein PasswordBox -Steuerelement sieht standardmäßig wie folgt aus:

Ee341382.4e1556e5-03f0-4881-8283-8281cb11c978(de-de,Expression.40).png

Teile der PasswordBox-Vorlage

Das PasswordBox -Steuerelement weist ein Teil auf: das ContentElement -Teil. Dieses Teil ist obligatorisch.

tip noteTipp:

Wenn Sie die Teile der Vorlage anzeigen möchten, öffnen Sie das Teilepanel während der Bearbeitung der Vorlage.

Status des PasswordBox-Steuerelements

Standardmäßig kann das PasswordBox -Steuerelement in der CommonStates-Statusgruppe einen der vier folgenden Status annehmen. Die Statusgruppe können Sie im Zuständepanel anzeigen, während Sie eine PasswordBox -Vorlage ändern:

Zustandsname Beschreibung

Normal

Das Aussehen des PasswordBox -Steuerelements, wenn keine Interaktion mit dem Steuerelement stattfindet.

MouseOver

Das Aussehen des PasswordBox -Steuerelements, wenn der Benutzer den Mauszeiger darüber bewegt.

Disabled

Das Aussehen des PasswordBox -Steuerelements, wenn die IsEnabled -Eigenschaft auf False gesetzt ist.

Das PasswordBox -Steuerelement kann einen der beiden folgenden Status der Statusgruppe FocusStates aufweisen:

Zustandsname Beschreibung

Unfocused

Das Aussehen des PasswordBox -Steuerelements ohne Tastaturfokus.

Focused

Das Aussehen des PasswordBox -Steuerelements mit Tastaturfokus. Beispiel: Ein Benutzer drückt die TAB-TASTE, um die Objekte in der Anwendung zu durchlaufen, bis sich ein Tastaturfokus auf dem PasswordBox -Steuerelement befindet.

Das PasswordBox -Steuerelement kann einen der folgenden drei Status der ValidationStates-Statusgruppe aufweisen:

Zustandsname Beschreibung

Valid

Das Aussehen eines gültigen PasswordBox -Steuerelements.

InvalidUnfocused

Das Aussehen eines ungültigen PasswordBox -Steuerelements ohne Tastaturfokus.

InvalidFocused

Das Aussehen eines ungültigen PasswordBox -Steuerelements mit Tastaturfokus.

tip noteTipp:

Eine Statusgruppe enthält die visuellen Status, die Teil derselben logischen Kategorie sind und die nicht gleichzeitig angezeigt werden können. Beispiel: Die Gruppe CommonStates beinhaltet Zustände, die sich auf die Benutzerinteraktion mit einem Eingabegerät wie der Maus beziehen. Es kann jeweils nur ein Zustand in einer Zustandsgruppe angezeigt werden. Ein Zustand aus einer Zustandsgruppe kann jedoch gleichzeitig mit einem Zustand aus einer anderen Zustandsgruppe angezeigt werden.

Wenn Sie einen Status auswählen, wird die Statusaufzeichnung aktiviert, und alle vorgenommen Änderungen werden für diesen Status aufgezeichnet. Klicken Sie auf die Anzeige für Aufzeichnungsmodus Ee341382.0dcc6415-6d4e-4fcf-a9a3-eb4664cb6cbc(de-de,Expression.40).png, oder wählen Sie Basis im Zuständepanel aus, den Aufzeichnungsmodus zu deaktivieren. Um das Aussehen des Steuerelements zu ändern, wenn zwei getrennte Status aktiv sind, können Sie eine Voransicht eines Status in eine Statusgruppe einpassen, während Sie einen Status in einer anderen Statusgruppe bearbeiten.

Vorlagenbindung

Sie können die Eigenschaften Background, BorderBrush, Forground, BorderThickness oder Padding an eine Vorlage binden. Weitere Informationen finden Sie unter Übernehmen von Objekteigenschaften für die Vorlage.

So konvertieren Sie Objekte in ein PasswordBox-Steuerelement

Die folgende Abbildung stellt ein Probelayout (Comp) für ein PasswordBox -Element dar:

PasswordBox-Element

In diesem Beispiel wird der XAML-Code in Schritt 2 des nachfolgend beschriebenen Verfahrens aus der o. a. Grafik verwendet, um mithilfe der PasswordBox -Steuerelementvorlage ein benutzerdefiniertes Kennwortfeld zu erstellen.

  1. Öffnen Sie ein Microsoft Silverlight-Projekt. Suchen Sie in der Codeansicht folgenden Code, und löschen Sie den schließenden Schrägstrich (/).

    <Grid x:Name="LayoutRoot" Background="White"/>
    
  2. Kopieren Sie den folgenden Code und fügen Sie ihn in ein neues Projekt ein, und zwar hinter dem Code, den Sie in Schritt 1 gesucht haben.

    <Grid Height="20" Width="120">
    <Rectangle Fill="#FF333333" RadiusX="5" RadiusY="5"/>
    <TextBlock Margin="5,0" Foreground="White" Text="*****" VerticalAlignment="Center"/>
    </Grid>
    
  3. Fügen Sie ein Grid -Tag (</Grid>) hinter dem Code ein, den Sie gerade eingefügt haben.

  4. Klicken Sie im Panel Objekte und Zeitachsen mit der rechten Maustaste auf das Grid-Objekt (Raster), und klicken Sie dann auf Steuerelement erstellen. Klicken Sie im Dialogfeld Steuerelement erstellen auf PasswordBox und anschließend auf OK.

  5. Klicken Sie im Panel Objekte und Zeitachsen auf das Grid-Objekt. Doppelklicken Sie im Teilepanel auf ContentElement.

  6. Kopieren Sie die Eigenschaften VerticalAlignment (Vertikale Ausrichtung) und Margin (Rand) des TextBlock-Objekts und fügen Sie diese Eigenschaften in das ContentElement-Objekt ein. Klicken Sie im Panel Objekte und Zeitachsen auf das ContentElement-Objekt, und führen Sie dann im Eigenschaftenpanel folgende Schritte aus:

    • **VerticalAlignment   ** Legen Sie für diese Eigenschaft Center (Zentriert) fest.

    • **Margin   ** Legen Sie folgende Werte fest:

      • Left   5

      • Right   5

      • Top   0

      • Bottom   0

  7. Klicken Sie im Panel Objekte und Zeitachsen mit der rechten Maustaste auf das TextBlock-Objekt, und klicken Sie dann auf Löschen.

  8. Klicken Sie im Panel Objekte und Zeitachsen auf das Template-Objekt (Vorlage) und anschließend auf Bereich auf "<Bereichsname>" zurücksetzenEe341382.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(de-de,Expression.40).png. Wählen Sie im Panel Objekte und Zeitachsen das Style-Objekt (Stil) aus, und legen Sie in der Kategorie Pinsel des Eigenschaftenpanels für die Foreground-Eigenschaft (Vordergrund) den Wert #FFFFFFFF fest.

  9. Klicken Sie im Panel Objekte und Zeitachsen auf ****Bereich auf "<Bereichsname>" zurücksetzen ****Ee341382.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(de-de,Expression.40).png.

  10. Geben Sie im Eigenschaftenpanel in der Kategorie Allgemeine Eigenschaften für die Password-Eigenschaft (Kennwort) die Zeichenfolge abcde ein.

  11. Klicken Sie im Eigenschaftenpanel in der Kategorie Text auf Erweiterte Eigenschaften einblenden. Geben Sie im Textfeld PasswordChar das Zeichen * ein.

  12. Erstellen Sie Ihr Projekt (STRG+UMSCHALT+B), und testen Sie es dann durch Drücken auf F5.

Weitere Informationen zur Anwendung neuer PasswordBox -Vorlagen auf andere PasswordBox -Objekte finden Sie unter Anwenden oder Entfernen einer Ressource.

Verweise

Ausführliche Informationen zu den Eigenschaften und Ereignissen des Silverlight  PasswordBox -Steuerelements finden Sie in der Silverlight Control Gallery Ee341382.xtlink_newWindow(de-de,Expression.40).png (Silverlight Steuerelemente und Dialogfelder) in MSDN.

Siehe auch

Konzepte

Gestaltungstipps für häufig verwendete Silverlight-Steuerelemente
Formatieren eines Steuerelements, das Vorlagen unterstützt
Zeichnen von Text

Copyright © 2011 Microsoft Corporation. Alle Rechte vorbehalten.