Symbolerweiterungen

Die Symbolerweiterungen sind eine Gruppe von Markuperweiterungen, die die Erstellung verschiedener Symboltypen vereinfachen sollen (insbesondere BitmapIcon, BitmapIconSource, FontIcon, FontIconSource, SymbolIcon und SymbolIconSource), die für eine Vielzahl von XAML-Steuerelementen verwendet werden. Durch die Verwendung dieser Erweiterungen werden keine neuen Funktionen pro Se aktiviert, die XAML-Syntax wird jedoch erheblich vereinfacht, um Instanzen dieser Symboltypen zu erstellen.

BitmapIconExtension

Die BitmapIconExtension Markuperweiterung ähnelt der Struktur der beiden vorherigen Erweiterungen, erzeugt BitmapIcon jedoch Instanzen anstelle von schriftartbasierten Symbolen. Hier erfahren Sie, wie sie verwendet werden kann:

<MenuFlyout xmlns:ui="using:CommunityToolkit.WinUI">

    <!--Before-->
    <MenuFlyoutItem Text="Click me!">
        <MenuFlyoutItem.Icon>
            <BitmapIcon Source="/Assets/myicon.png"/>
        </MenuFlyoutItem.Icon>
    </MenuFlyoutItem>

    <!--After-->
    <MenuFlyoutItem
        Text="No, click me!"
        Icon="{ui:BitmapIcon Source=/Assets/myicon.png}" />
</MenuFlyout>

BitmapIconSourceExtension

Die BitmapIconSourceExtension Klasse spiegelt den BitmapIconExtension Typ wieder, wobei der einzige Unterschied darin ist, dass sie eine BitmapIconSource Instanz zurückgibt. Hier erfahren Sie, wie sie verwendet werden kann:

<SwipeItems
    xmlns:ui="using:CommunityToolkit.WinUI"
    Mode="Reveal">
    <SwipeItem Text="Send" IconSource="{ui:BitmapIconSource Source=/Assets/myicon.png}"/>
</SwipeItems>

FontIconExtension

Der FontIconExtension-Typ ermöglicht es, FontIcon-Instanzen aus XAML in einer kompakteren Form zu erstellen, als dies durch das explizite Erstellen eines neuen FontIcon-Objekts zur Zuweisung an die Zieleigenschaft möglich wäre. Die Eigenschaft ordnet auch alle verfügbaren FontIcon Eigenschaften zu, sodass die beiden APIs den gleichen Satz von Anpassungsoptionen direkt über eine andere XAML-Syntax verfügbar machen:

<CommandBar xmlns:ui="using:CommunityToolkit.WinUI">

    <!--Before-->
    <AppBarButton>
        <AppBarButton.Icon>
            <FontIcon Glyph="&#xE102;" FontFamily="{ThemeResource SymbolThemeFontFamily}"/>
        </AppBarButton.Icon>
    </AppBarButton>

    <!--After-->
    <AppBarButton Icon="{ui:FontIcon Glyph=&#xE102;}"/>
</CommandBar>

FontIconSourceExtension

Die FontIconSourceExtension Klasse spiegelt den FontIconExtension Typ wieder, erzeugt jedoch FontIconSource Instanzen anstelle von FontIcon:

<SwipeItems
    xmlns:ui="using:CommunityToolkit.WinUI"
    Mode="Reveal">

    <!--Before-->
    <SwipeItem Text="Accept">
        <SwipeItem.IconSource>
            <FontIconSource Glyph="&#xE10B;"/>
        </SwipeItem.IconSource>
    </SwipeItem>
    
    <!--After-->
    <SwipeItem Text="Accept" IconSource="{ui:FontIconSource Glyph=&#xE10B;}"/>
</SwipeItems>

SymbolIconExtension

Der SymbolIconExtension Typ spiegelt die FontIcon Markuperweiterung mit dem Hauptunterschied darin, dass ein Symbol Wert zum Angeben des Symbols verwendet wird. Alle anderen Eigenschaften FontIconExtension sind verfügbar, mit Ausnahme der Schriftartfamilie, die immer auf "Segoe MDL2 Assets" festgelegt ist. Hier erfahren Sie, wie sie verwendet werden kann:

<CommandBar xmlns:ui="using:CommunityToolkit.WinUI">

    <!--Before-->
    <AppBarButton>
        <AppBarButton.Icon>
            <SymbolIcon Symbol="Play"/>
        </AppBarButton.Icon>
    </AppBarButton>

    <!--After-->
    <AppBarButton Icon="{ui:SymbolIcon Symbol=Play}"/>
</CommandBar>

Note

Der SymbolIconExtension gibt tatsächlich einen FontIcon-Wert anstelle eines SymbolIcon-Werts zurück. Dies geschieht, um die zusätzlichen Eigenschaften (z. B. FontSize, FontWeightusw.) einzuschließen, die andernfalls nicht verfügbar wären. Wenn diese nicht geändert werden, entspricht das Aussehen des resultierenden Symbols weiterhin derjenigen, die aus der Verwendung einer SymbolIcon Instanz resultierte.

SymbolIconSource

Der Typ SymbolIconSourceExtension ist eine Alternative zu FontIconSourceExtension, der anstelle von Text einen Symbol-Wert verwendet und das Symbol mit „Segoe MDL2 Assets“ anzeigt. Sie entspricht dem SymbolIconExtension Typ, mit Ausnahme der Tatsache, dass sie eine FontIconSource Instanz zurückgibt:

<SwipeItems
    xmlns:ui="using:CommunityToolkit.WinUI"
    Mode="Reveal">
    <SwipeItem Text="Play" IconSource="{ui:SymbolIconSource Symbol=Play}"/>
</SwipeItems>

Hinweise

Alle von diesen Markuperweiterungen zurückgegebenen Werte gehören zum namespace Windows.UI.Xaml.*. Dies bedeutet, dass sie nur ordnungsgemäß funktionieren, wenn sie mit Steuerelementen aus diesem Namespace und nicht aus Microsoft.UI.Xaml.* (dem WinUI-Namespace) verwendet werden. Wenn Sie z. B. versuchen, mit FontIconSourceExtension die Eigenschaft IconSource für Microsoft.UI.Xaml.Controls.SwipeItems festzulegen, funktioniert dies nicht richtig, da die Erweiterung einen Wert vom Typ Windows.UI.Xaml.Controls.FontIconSource anstelle eines Werts vom Typ Microsoft.UI.Xaml.Controls.FontIconSource erzeugt. Beim Arbeiten mit WinUI-Steuerelementen müssen Sie die benötigten Symbole mit der expliziten XAML-Syntax manuell deklarieren.

Beispiele

Weitere Beispiele finden Sie in den Komponententests.