Freigeben über


Erstellen einer Formatvorlage für ein Steuerelement

Mit Windows Presentation Foundation (WPF) können Sie die Darstellung eines vorhandenen Steuerelements mit ihrem eigenen wiederverwendbaren Stil anpassen. Formatvorlagen können global auf Ihre App, Fenster und Seiten oder direkt auf Steuerelemente angewendet werden.

Erstellen eines Stils

Sie können sich eine Style praktische Möglichkeit vorstellen, um einen Satz von Eigenschaftswerten auf ein oder mehrere Elemente anzuwenden. Sie können eine Formatvorlage auf jedes Element anwenden, das von FrameworkElement oder FrameworkContentElement abgeleitet ist, wie etwa einem Window oder einem Button.

Die am häufigsten verwendete Methode zum Definieren eines Stils ist die Deklaration als Ressource im Resources Abschnitt in einer XAML-Datei. Da es sich bei Formatvorlagen um Ressourcen handelt, befolgen sie dieselben Bereichsregeln, die für alle Ressourcen gelten. Einfach ausgedrückt, wo Sie eine Formatvorlage deklarieren, wirkt sich darauf aus, wo die Formatvorlage angewendet werden kann. Wenn Sie z. B. die Formatvorlage im Stammelement der XAML-Datei der App-Definition deklarieren, kann die Formatvorlage an einer beliebigen Stelle in Ihrer App verwendet werden.

<Application x:Class="IntroToStylingAndTemplating.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:IntroToStylingAndTemplating"
             StartupUri="WindowExplicitStyle.xaml">
    <Application.Resources>
        <ResourceDictionary>
            
            <Style x:Key="Header1" TargetType="TextBlock">
                <Setter Property="FontSize" Value="15" />
                <Setter Property="FontWeight" Value="ExtraBold" />
            </Style>
            
        </ResourceDictionary>
    </Application.Resources>
</Application>

Wenn Sie die Formatvorlage in einer der XAML-Dateien der App deklarieren, kann die Formatvorlage nur in dieser XAML-Datei verwendet werden. Weitere Informationen zu Geltungsbereichsregeln für Ressourcen finden Sie in der Übersicht zu XAML-Ressourcen.

<Window x:Class="IntroToStylingAndTemplating.WindowSingleResource"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:IntroToStylingAndTemplating"
        mc:Ignorable="d"
        Title="WindowSingleResource" Height="450" Width="800">
    <Window.Resources>
        
        <Style x:Key="Header1" TargetType="TextBlock">
            <Setter Property="FontSize" Value="15" />
            <Setter Property="FontWeight" Value="ExtraBold" />
        </Style>
        
    </Window.Resources>
    <Grid />
</Window>

Ein Stil besteht aus <Setter> untergeordneten Elementen, die die Eigenschaften der Elemente festlegen, auf die der Stil angewendet wird. Beachten Sie im obigen Beispiel, dass die Formatvorlage über das TextBlock-Attribut auf TargetType-Typen angewendet werden soll. Die Formatvorlage wird FontSize auf 15 setzen und FontWeight auf ExtraBold setzen. Fügen Sie ein <Setter> für jede Eigenschaft hinzu, deren Formatvorlage geändert wird.

Implizite Anwendung eines Stils

A Style ist eine bequeme Möglichkeit, einen Satz von Eigenschaftswerten auf mehrere Elemente anzuwenden. Betrachten Sie beispielsweise die folgenden TextBlock Elemente und deren Standarddarstellung in einem Fenster.

<StackPanel>
    <TextBlock>My Pictures</TextBlock>
    <TextBlock>Check out my new pictures!</TextBlock>
</StackPanel>

Vorheriger Formatierbeispiel-Screenshot

Sie können die Standarddarstellung ändern, indem Sie Eigenschaften wie FontSize z. B. und FontFamily, für jedes TextBlock Element direkt festlegen. Wenn Sie jedoch möchten, dass Ihre TextBlock Elemente einige Eigenschaften freigeben, können Sie einen Style im Resources Abschnitt Ihrer XAML-Datei erstellen, wie hier gezeigt.

<Window.Resources>
    <!--A Style that affects all TextBlocks-->
    <Style TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Center" />
        <Setter Property="FontFamily" Value="Comic Sans MS"/>
        <Setter Property="FontSize" Value="14"/>
    </Style>
</Window.Resources>

Wenn Sie die TargetType Formatvorlage auf den TextBlock Typ einstellen und das x:Key Attribut weglassen, wird die Formatvorlage auf alle TextBlock Elemente angewendet, die der Formatvorlage zugeordnet sind, was im Allgemeinen die XAML-Datei selbst betrifft.

Nun werden die TextBlock Elemente wie folgt angezeigt.

Formatieren des Beispiel-Screenshot-Basisstils

Explizites Anwenden einer Formatvorlage

Wenn Sie ein Attribut x:Key mit einem Wert zur Formatvorlage hinzufügen, wird die Formatvorlage nicht mehr implizit auf alle Elemente von TargetType angewendet. Nur bei Elementen, die explizit auf die Formatvorlage verweisen, wird die Formatvorlage angewendet.

Hier ist die Formatvorlage aus dem vorherigen Abschnitt, deklariert mit dem x:Key-Attribut.

<Window.Resources>
    <Style x:Key="TitleText" TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Center" />
        <Setter Property="FontFamily" Value="Comic Sans MS"/>
        <Setter Property="FontSize" Value="14"/>
    </Style>
</Window.Resources>

Um den Stil anzuwenden, legen Sie die Style-Eigenschaft des Elements auf den x:Key-Wert fest, indem Sie eine StaticResource-Markuperweiterung verwenden, wie hier gezeigt.

<StackPanel>
    <TextBlock Style="{StaticResource TitleText}">My Pictures</TextBlock>
    <TextBlock>Check out my new pictures!</TextBlock>
</StackPanel>

Beachten Sie, dass auf das erste TextBlock-Element der Stil angewendet wurde, während das zweite Textblock-Element unverändert bleibt. Die implizite Formatvorlage aus dem vorherigen Abschnitt wurde in eine Formatvorlage geändert, die das x:Key Attribut deklariert hat, d. h., das einzige element, das von der Formatvorlage betroffen ist, ist das Element, das direkt auf die Formatvorlage verweist.

Formatieren eines Screenshottextblocks

Sobald eine Formatvorlage explizit oder implizit angewendet wird, wird sie versiegelt und kann nicht mehr geändert werden. Wenn Sie eine angewendete Formatvorlage ändern möchten, erstellen Sie eine neue Formatvorlage, um die vorhandene zu ersetzen. Weitere Informationen finden Sie in den Ausführungen zur IsSealed-Eigenschaft.

Sie können ein Objekt erstellen, das mithilfe benutzerdefinierter Logik eine Formatvorlage auswählt, die angewendet werden soll. Ein Beispiel finden Sie im Beispiel für die StyleSelector Klasse.

Programmgesteuertes Anwenden einer Formatvorlage

Um einem Element programmgesteuert eine benannte Formatvorlage zuzuweisen, rufen Sie die Formatvorlage aus der Ressourcenauflistung ab, und weisen Sie sie der Eigenschaft des Style Elements zu. Die Elemente in einer Ressourcenauflistung sind vom Typ Object. Daher müssen Sie die abgerufene Formatvorlage in ein System.Windows.Style Format umwandeln, bevor Sie sie der Style Eigenschaft zuweisen. Zum Beispiel legt der folgende Code die Formatierung einer TextBlock mit dem Namen textblock1 auf die definierte Formatvorlage TitleText fest.

textblock1.Style = (Style)Resources["TitleText"];
textblock1.Style = CType(Resources("TitleText"), Windows.Style)

Erweitern einer Formatvorlage

Vielleicht möchten Sie, dass Ihre beiden TextBlock Elemente einige Eigenschaftswerte teilen, wie z. B. FontFamily und das zentrierte HorizontalAlignment. Sie möchten aber auch, dass der Text "Meine Bilder" einige zusätzliche Eigenschaften aufweist. Dazu können Sie eine neue Formatvorlage erstellen, die auf der ersten Formatvorlage basiert, wie hier gezeigt.

<Window.Resources>
    <!-- .... other resources .... -->

    <!--A Style that affects all TextBlocks-->
    <Style TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Center" />
        <Setter Property="FontFamily" Value="Comic Sans MS"/>
        <Setter Property="FontSize" Value="14"/>
    </Style>
    
    <!--A Style that extends the previous TextBlock Style with an x:Key of TitleText-->
    <Style BasedOn="{StaticResource {x:Type TextBlock}}"
           TargetType="TextBlock"
           x:Key="TitleText">
        <Setter Property="FontSize" Value="26"/>
        <Setter Property="Foreground">
            <Setter.Value>
                <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                    <LinearGradientBrush.GradientStops>
                        <GradientStop Offset="0.0" Color="#90DDDD" />
                        <GradientStop Offset="1.0" Color="#5BFFFF" />
                    </LinearGradientBrush.GradientStops>
                </LinearGradientBrush>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

Anschließend wenden Sie die Formatvorlage auf ein TextBlock an.

<StackPanel>
    <TextBlock Style="{StaticResource TitleText}" Name="textblock1">My Pictures</TextBlock>
    <TextBlock>Check out my new pictures!</TextBlock>
</StackPanel>

Diese TextBlock Formatvorlage ist jetzt zentriert, verwendet eine Comic Sans MS Schriftart mit einem Schriftgrad von 26, und die Vordergrundfarbe ist auf die im Beispiel gezeigte LinearGradientBrush festgelegt. Beachten Sie, dass der FontSize Wert der Basisformatvorlage überschrieben wird. Wenn mehr als eine Setter auf dieselbe Eigenschaft in einem Style verweist, hat das zuletzt deklarierte Setter Vorrang.

Im Folgenden wird gezeigt, wie die TextBlock Elemente jetzt aussehen:

Formatierte TextBlocks

Diese TitleText Formatvorlage erweitert die Formatvorlage, die für den TextBlock Typ erstellt wurde und auf die BasedOn="{StaticResource {x:Type TextBlock}}" verwiesen wird. Sie können auch eine Formatvorlage erweitern, die x:Key über die x:Key Formatvorlage verfügt. Wenn beispielsweise eine Formatvorlage benannt Header1 wurde und Sie diese Formatvorlage erweitern möchten, würden Sie verwenden BasedOn="{StaticResource Header1}".

Beziehung der TargetType-Eigenschaft und des x:Key-Attributs

Wie bereits gezeigt, bewirkt das Festlegen der TargetType Eigenschaft auf TextBlock ohne Zuweisung eines x:Key, dass die Formatvorlage auf alle TextBlock Elemente angewendet wird. In diesem Fall wird die x:Key-Eigenschaft implizit auf {x:Type TextBlock} gesetzt. Dies bedeutet, dass, wenn Sie den x:Key Wert explizit auf einen anderen Wert {x:Type TextBlock}als festlegen, der Style nicht automatisch auf alle TextBlock Elemente angewendet wird. Stattdessen müssen Sie die Formatvorlage (mithilfe des x:Key-Werts) explizit auf die TextBlock-Elemente anwenden. Wenn sich Ihr Stil im Ressourcenabschnitt befindet und Sie die TargetType Eigenschaft für Ihren Stil nicht festgelegt haben, müssen Sie das x:Key Attribut festlegen.

Zusätzlich zur Bereitstellung eines Standardwerts für die x:KeyEigenschaft gibt die TargetType Eigenschaft den Typ an, auf den Settereigenschaften angewendet werden. Wenn Sie kein TargetType angeben, müssen Sie die Eigenschaften in Ihren Setter-Objekten mit einem Klassennamen mithilfe der Syntax Property="ClassName.Property" qualifizieren. Statt die Einstellung Property="FontSize" zu verwenden, müssen Sie Property auf "TextBlock.FontSize" oder "Control.FontSize" setzen.

Beachten Sie außerdem, dass viele WPF-Steuerelemente aus einer Kombination anderer WPF-Steuerelemente bestehen. Wenn Sie eine Formatvorlage erstellen, die für alle Steuerelemente eines Typs gilt, erhalten Sie möglicherweise unerwartete Ergebnisse. Wenn Sie z. B. eine Formatvorlage erstellen, die auf den TextBlock Typ in einer Formatvorlage Windowabzielt, wird die Formatvorlage auf alle TextBlock Steuerelemente im Fenster angewendet, auch wenn der TextBlock Teil eines anderen Steuerelements ist, z. B. ein ListBox.

Siehe auch