Přizpůsobení záhlaví

Windows poskytuje výchozí záhlaví pro každé okno a umožňuje ho přizpůsobit tak, aby odpovídal osobnosti vaší aplikace. Výchozí záhlaví obsahuje některé standardní součásti a základní funkce, jako je přetažení a změna velikosti okna.

aplikace pro Windows zobrazující záhlaví

Pokyny k přizpůsobení záhlaví aplikace, přijatelnému obsahu oblasti záhlaví a doporučeným vzorům uživatelského rozhraní najdete v článku o návrhu záhlaví, označeném jako Title bar.

Viz Pokyny k návrhu Fluent Design ve Windows 11 pro titulkovou lištu

Poznámka:

Tento článek ukazuje, jak přizpůsobit záhlaví aplikací, které používají UPW a WinUI 2. Aplikace, které používají sadu Windows App SDK a WinUI 3, najdete v tématu Přizpůsobení záhlaví sady Windows App SDK.

Pokud uvažujete o migraci aplikace pro UPW do sady Windows App SDK, projděte si průvodce migrací funkcí okna. Další informace najdete v části migrace funkcionality okno.

Platí pro: UPW/WinUI 2
Důležitá rozhraní API: Vlastnost ApplicationView.TitleBar, Třída ApplicationViewTitleBar, Třída CoreApplicationViewTitleBar

Součásti záhlaví

Tento seznam popisuje součásti standardního záhlaví.

Obdélník záhlaví
Text nadpisu
Systémová nabídka – přístup kliknutím na ikonu aplikace nebo kliknutím pravým tlačítkem myši na záhlaví
Ovládací prvky titulků
- Tlačítko Minimalizovat
- Tlačítko Maximalizovat/Obnovit
- Tlačítko Zavřít

V aplikacích pro UPW můžete záhlaví přizpůsobit pomocí členů třídy ApplicationView a CoreApplicationView . Existuje několik rozhraní API, která postupně upravují vzhled záhlaví na základě požadované úrovně přizpůsobení.

Poznámka:

Třída Windows.UI.WindowManagement.AppWindow , která se používá pro sekundární okna v aplikacích pro UPW, nepodporuje přizpůsobení záhlaví. Pokud chcete přizpůsobit záhlaví aplikace pro UPW, která používá sekundární okna, použijte ApplicationView, jak je popsáno v tématu Zobrazit více zobrazení pomocí ApplicationView.

Do jaké míry přizpůsobit hlavní panel

Na záhlaví můžete použít dvě úrovně přizpůsobení: použijte menší úpravy výchozího záhlaví nebo rozšiřte plátno aplikace do oblasti záhlaví a poskytněte zcela vlastní obsah.

Stručně

Jednoduché přizpůsobení, například změna barvy záhlaví, můžete nastavit vlastnosti v objektu záhlaví okna aplikace a určit barvy, které chcete použít pro prvky záhlaví. V tomto případě systém uchovává odpovědnost za všechny ostatní aspekty záhlaví, jako je kreslení názvu aplikace a definování oblastí přetažení.

Úplný

Další možností je skrýt výchozí záhlaví a nahradit ho vlastním obsahem. Do oblasti záhlaví můžete například umístit text, vyhledávací pole nebo vlastní nabídky. Tuto možnost budete muset použít také k rozšíření pozadí z materiálu, jako je Mica, do oblasti záhlaví.

Když se rozhodnete pro úplné přizpůsobení, zodpovídáte za umístění obsahu do oblasti záhlaví a můžete definovat vlastní oblast přetažení. Ovládací prvky titulků (tlačítka Zavřít, Minimalizovat a Maximalizovat) jsou stále dostupné a zpracovávané systémem, ale prvky, jako je název aplikace, nejsou. Tyto prvky budete muset vytvořit sami podle potřeby vaší aplikace.

Jednoduché přizpůsobení

Pokud chcete přizpůsobit jenom barvy nebo ikonu záhlaví, můžete pro okno aplikace nastavit vlastnosti objektu záhlaví.

Titulek

Ve výchozím nastavení se v záhlaví zobrazuje zobrazovaný název aplikace jako název okna. Zobrazovaný název se nastaví v Package.appxmanifest souboru.

Chcete-li přidat vlastní text do názvu, nastavte ApplicationView.Title vlastnost na textovou hodnotu, jak je znázorněno zde.

public MainPage()
{
    this.InitializeComponent();

    ApplicationView.GetForCurrentView().Title = "Custom text";
}

Text je přidán na začátek nadpisu okna, který se zobrazí jako "vlastní text – název zobrazené aplikace". Pokud chcete zobrazit vlastní název bez názvu aplikace, musíte nahradit výchozí záhlaví, jak je znázorněno v části Úplné přizpůsobení.

Barvy

Tento příklad ukazuje, jak získat instanci ApplicationViewTitleBar a nastavit její vlastnosti barvy.

Tento kód můžete umístit do metody ve vaší aplikaci (App.xaml.cs) po volání Window.Activate, nebo na první stránku vaší aplikace.

// using Windows.UI;
// using Windows.UI.ViewManagement;

var titleBar = ApplicationView.GetForCurrentView().TitleBar;

// Set active window colors
titleBar.ForegroundColor = Colors.White;
titleBar.BackgroundColor = Colors.Green;
titleBar.ButtonForegroundColor = Colors.White;
titleBar.ButtonBackgroundColor = Colors.SeaGreen;
titleBar.ButtonHoverForegroundColor = Colors.White;
titleBar.ButtonHoverBackgroundColor = Colors.DarkSeaGreen;
titleBar.ButtonPressedForegroundColor = Colors.Gray;
titleBar.ButtonPressedBackgroundColor = Colors.LightGreen;

// Set inactive window colors
titleBar.InactiveForegroundColor = Colors.Gainsboro;
titleBar.InactiveBackgroundColor = Colors.SeaGreen;
titleBar.ButtonInactiveForegroundColor = Colors.Gainsboro;
titleBar.ButtonInactiveBackgroundColor = Colors.SeaGreen;

Při nastavování barev záhlaví je potřeba vědět několik věcí:

Barva pozadí tlačítka se nepoužije pro stav najetí myší na tlačítko zavřít při a pro stav stisknutí při. Tlačítko Zavřít vždy používá pro tyto stavy barvu definovanou systémem.
Nastavením vlastnosti barvy null se obnoví na výchozí systémovou barvu.
Nemůžete nastavit průhledné barvy. Alfa kanál barvy se ignoruje.

Windows dává uživateli možnost použít vybranou barvu zvýraznění na název okna. Pokud nastavíte barvu záhlaví, doporučujeme explicitně nastavit všechny barvy. Tím se zajistí, že neexistují žádné nezamýšlené kombinace barev, ke kterým dochází kvůli uživatelsky definovaným nastavením barev.

Úplné přizpůsobení

Když se přihlásíte k přizpůsobení celého záhlaví, oblast klienta aplikace se rozšíří tak, aby pokrývala celé okno, včetně oblasti záhlaví. Zodpovídáte za kreslení a zpracování vstupu pro celé okno s výjimkou tlačítek titulků, které okno stále poskytuje.

Chcete-li skrýt výchozí záhlaví a rozšířit obsah do oblasti záhlaví, nastavte ExtendViewIntoTitleBar vlastnost true. Tuto vlastnost můžete nastavit v metodě aplikace OnLaunched (App.xaml.cs) nebo na první stránce vaší aplikace.

Návod

Pokud chcete zobrazit veškerý kód najednou, podívejte se na část Příklad úplného přizpůsobení.

Tento příklad ukazuje, jak získat CoreApplicationViewTitleBar a nastavit ExtendViewIntoTitleBar vlastnost true.

using Windows.ApplicationModel.Core;

public MainPage()
{
    this.InitializeComponent();

    // Hide default title bar.
    var coreTitleBar = CoreApplication.GetCurrentView().TitleBar;
    coreTitleBar.ExtendViewIntoTitleBar = true;
}

Návod

Toto nastavení se zachová, když se aplikace zavře a restartuje. Pokud jste v sadě Visual Studio nastavili možnost ExtendViewIntoTitleBar na true a pak se chcete vrátit k výchozí hodnotě, měli byste ji explicitně nastavit na false a spustit aplikaci, abyste přepsali uložené nastavení.

Obsah záhlaví a oblasti pro tažení

Když se aplikace rozšíří do oblasti záhlaví, zodpovídáte za definování a správu uživatelského rozhraní záhlaví. To obvykle zahrnuje alespoň specifikaci textu nadpisu a oblasti přetažení. Oblast přetažení záhlaví definuje, kam uživatel může kliknout a přetáhnout okno. Uživatel může také kliknout pravým tlačítkem myši a zobrazit tak systémovou nabídku.

Další informace o přijatelném obsahu záhlaví a doporučených vzorcích uživatelského rozhraní najdete v části Návrh záhlaví.

Oblast přetažení zadáte voláním metody Window.SetTitleBar a předáním UIElement, který definuje oblast přetažení. (Obvykle se jedná o UIElement panel, který obsahuje další prvky.) Vlastnost ExtendViewIntoTitleBar musí být nastavena na true, aby mělo volání SetTitleBar jakýkoli účinek.

Tady je postup, jak nastavit Grid obsahu jako oblast přetahovatelného záhlaví. Tento kód je umístěn v XAML a code-behind na první stránce vaší aplikace.

<Grid x:Name="AppTitleBar" Background="Transparent">
    <!-- Width of the padding columns is set in LayoutMetricsChanged handler. -->
    <!-- Using padding columns instead of Margin ensures that the background
         paints the area under the caption control buttons (for transparent buttons). -->
    <Grid.ColumnDefinitions>
        <ColumnDefinition x:Name="LeftPaddingColumn" Width="0"/>
        <ColumnDefinition/>
        <ColumnDefinition x:Name="RightPaddingColumn" Width="0"/>
    </Grid.ColumnDefinitions>
    <Image Source="Assets/WindowIcon.png" 
           Grid.Column="1"
           HorizontalAlignment="Left"
           Width="16" Height="16"
           Margin="8,0,0,0"/>
    <TextBlock x:Name="AppTitleTextBlock"
               Text="App title" 
               Style="{StaticResource CaptionTextBlockStyle}" 
               Grid.Column="1"
               VerticalAlignment="Center"
               Margin="28,0,0,0"/>
</Grid>

public MainPage()
{
    this.InitializeComponent();

    var coreTitleBar = CoreApplication.GetCurrentView().TitleBar;
    coreTitleBar.ExtendViewIntoTitleBar = true;

    // Set XAML element as a drag region.
    Window.Current.SetTitleBar(AppTitleBar);
}

Ve výchozím nastavení se v záhlaví systému zobrazuje zobrazovaný název aplikace jako název okna. Zobrazovaný název se nastaví v souboru Package.appxmanifest. Tuto hodnotu můžete získat a použít ji ve vlastním záhlaví takto.

AppTitleTextBlock.Text = AppInfo.Current.DisplayInfo.DisplayName;

Důležité

Zadaná oblast přetažení musí být testovatelná. Ve výchozím nastavení se některé prvky uživatelského rozhraní, jako například Grid, nezaúčastní testování zásahu, pokud nemají nastavené pozadí. To znamená, že pro některé prvky budete možná muset nastavit štětec s průhledným pozadím. Viz poznámky k VisualTreeHelper.FindElementsInHostCoordinates pro více informací.

Pokud například definujete mřížku jako oblast přetažení, nastavíte Background="Transparent" ji tak, aby ji bylo možné přetáhnout.

Tato mřížka není přetahovatelná (ale viditelné prvky v ní jsou): <Grid x:Name="AppTitleBar">.

Tato mřížka vypadá stejně, ale lze ji celou táhnout: <Grid x:Name="AppTitleBar" Background="Transparent">.

Interaktivní obsah

Interaktivní ovládací prvky, jako jsou tlačítka, nabídky nebo vyhledávací pole, můžete umístit do horní části aplikace, aby se zobrazovaly v záhlaví. Existuje však několik pravidel, která musíte dodržovat, abyste zajistili, že interaktivní prvky přijímají uživatelský vstup a zároveň umožňují uživatelům pohybovat se v okně.

Je nutné volat SetTitleBar, abyste definovali oblast jako přetahovatelné záhlaví. Pokud ne, systém nastaví výchozí oblast přetažení v horní části stránky. Poté systém zpracuje veškerý uživatelský vstup do této oblasti a zabrání tomu, aby se vstup dostal k vašim ovládacím prvkům.
Umístěte interaktivní ovládací prvky nad oblast přetažení definovanou voláním SetTitleBar (s vyšší hodnotou z-řádu). Neudělávejte interaktivní ovládací prvky podřízeným prvkům UIElement, předány SetTitleBar. Jakmile předáte prvek SetTitleBar, systém s ním zachází jako se záhlavím systému a zpracovává všechny vstupy ukazatele na tento prvek.

Zde má prvek AutoSuggestBox vyšší z-řád než AppTitleBar, takže přijímá uživatelský vstup.

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="48"/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Grid x:Name="AppTitleBar" Background="Transparent">
        <!-- Width of the padding columns is set in LayoutMetricsChanged handler. -->
        <!-- Using padding columns instead of Margin ensures that the background
             paints the area under the caption control buttons (for transparent buttons). -->
        <Grid.ColumnDefinitions>
            <ColumnDefinition x:Name="LeftPaddingColumn" Width="0"/>
            <ColumnDefinition/>
            <ColumnDefinition x:Name="RightPaddingColumn" Width="0"/>
        </Grid.ColumnDefinitions>
        <Image Source="Assets/WindowIcon.png" 
               Grid.Column="1"
               HorizontalAlignment="Left"
               Width="16" Height="16"
               Margin="8,0,0,0"/>
        <TextBlock x:Name="AppTitleTextBlock"
                   Text="App title" 
                   Style="{StaticResource CaptionTextBlockStyle}" 
                   Grid.Column="1"
                   VerticalAlignment="Center"
                   Margin="28,0,0,0"/>
    </Grid>

    <!-- This control has a higher z-order than AppTitleBar, 
         so it receives user input. -->
    <AutoSuggestBox QueryIcon="Find"
                    PlaceholderText="Search"
                    HorizontalAlignment="Center"
                    Width="260" Height="32"/>
</Grid>

Tlačítka titulků systému

Systém si vyhrazuje levý horní nebo pravý horní roh okna aplikace pro tlačítka titulků systému (minimalizovat, maximalizovat/obnovit, zavřít). Systém si zachová kontrolu nad oblastí tlačítek titulků a zaručuje, že minimální funkčnost je poskytována pro přetahování, minimalizaci, maximalizaci a zavření okna. Systém umístí tlačítko Zavřít v pravém horním rohu pro jazyky zleva doprava a v levém horním rohu pro jazyky zprava doleva.

Obsah můžete nakreslit pod oblastí ovládacího prvku titulků, například pozadí aplikace, ale neměli byste vložit žádné uživatelské rozhraní, se kterým očekáváte, že uživatel bude moct pracovat. Neobdrží žádný vstup, protože vstup ovládacích prvků titulků zpracovává systém.

Tyto řádky z předchozího příkladu ukazují výplň sloupců v XAML, které definují hlavičkový panel. Použití odsazení sloupců místo okrajů zajišťuje, že pozadí vykreslí oblast pod ovládacími tlačítky titulku (pro průhledná tlačítka). Použití výplňových sloupců zprava i zleva zajistí, že se titulek bude v rozloženích vpravo-vlevo a vlevo-vpravo chovat správně.

<Grid.ColumnDefinitions>
    <ColumnDefinition x:Name="LeftPaddingColumn" Width="0"/>
    <ColumnDefinition/>
    <ColumnDefinition x:Name="RightPaddingColumn" Width="0"/>
</Grid.ColumnDefinitions>

Rozměry a umístění oblasti ovládacího prvku titulkové se sdělují třídou CoreApplicationViewTitleBar, abyste ji mohli zohlednit v rozložení uživatelského rozhraní záhlaví. Šířka rezervované oblasti na každé straně je určena prostřednictvím vlastností SystemOverlayLeftInset nebo SystemOverlayRightInset a její výška je dána vlastností Height.

Můžete zpracovat událost LayoutMetricsChanged, abyste reagovali na změny velikosti ovládacích tlačítek okna. K tomu může dojít například v případě, že se rozložení aplikace změní zleva doprava na zprava doleva. Zpracujte tuto událost a ověřte a aktualizujte umístění prvků uživatelského rozhraní, které závisí na velikosti záhlaví.

Tento příklad ukazuje, jak upravit rozložení záhlaví tak, aby zohlednilo změny v metrikách záhlaví. AppTitleBar, LeftPaddingColumna RightPaddingColumn jsou deklarovány v XAML zobrazené dříve.

private void CoreTitleBar_LayoutMetricsChanged(CoreApplicationViewTitleBar sender, object args)
{
    // Get the size of the caption controls and set padding.
    LeftPaddingColumn.Width = new GridLength(coreTitleBar.SystemOverlayLeftInset);
    RightPaddingColumn.Width = new GridLength(coreTitleBar.SystemOverlayRightInset);
}

Barva a průhlednost tlačítek titulků

Když rozšíříte obsah aplikace do oblasti záhlaví, můžete nastavit pozadí tlačítek popisku jako průhledné, aby se zobrazilo pozadí aplikace. Pozadí obvykle nastavíte na Colors.Transparent pro úplnou průhlednost. Pro částečnou průhlednost nastavte alfa kanál pro barvu , ke které jste nastavili vlastnost.

Tyto vlastnosti záhlaví můžou být průhledné:

Všechny ostatní vlastnosti barvy budou i nadále ignorovat alfa kanál. Pokud je ExtendViewIntoTitleBar nastavena na false, alfa kanál je vždy ignorován pro všechny vlastnosti barvy ApplicationViewTitleBar.

Barva pozadí tlačítka se nepoužije na tlačítko Zavřít v případech najetí myší na a stisknutí na. Tlačítko Zavřít vždy používá pro tyto stavy barvu definovanou systémem.

Návod

Mica je nádherný materiál, který pomáhá odlišit okno, na které je zaostřeno. Doporučujeme ho používat jako pozadí pro dlouhodobá okna ve Windows 11. Pokud jste v klientské oblasti okna použili efekt Mica, můžete ho rozšířit do oblasti záhlaví a zprůhlednit ovládací tlačítka, aby mohl efekt Mica prosvítat. Další informace najdete v materiálu Mica.

Ztlumit panel titulku, když je okno neaktivní

Měli byste to zviditelnit, když je okno aktivní nebo neaktivní. Minimálně byste měli změnit barvu textu, ikon a tlačítek v záhlaví.

Zpracujte událost CoreWindow.Activated , abyste zjistili stav aktivace okna, a podle potřeby aktualizujte uživatelské rozhraní záhlaví.

public MainPage()
{
    ...
    Window.Current.CoreWindow.Activated += CoreWindow_Activated;
}

private void CoreWindow_Activated(CoreWindow sender, WindowActivatedEventArgs args)
{
    UISettings settings = new UISettings();
    if (args.WindowActivationState == CoreWindowActivationState.Deactivated)
    {
        AppTitleTextBlock.Foreground = 
            new SolidColorBrush(settings.UIElementColor(UIElementType.GrayText));
    }
    else
    {
        AppTitleTextBlock.Foreground = 
            new SolidColorBrush(settings.UIElementColor(UIElementType.WindowText));
    }
}

Resetování záhlaví

Můžete volat SetTitleBar, abyste přepnuli na nový prvek záhlaví, když je vaše aplikace v běhu. Můžete také předat null jako parametr SetTitleBar a nastavit ExtendViewIntoTitleBar na false, aby se vrátilo na výchozí systémové záhlaví.

Zobrazení a skrytí záhlaví

Pokud do aplikace přidáte podporu pro režimy na celou obrazovku nebo kompaktní překryvný režim , budete možná muset při přepínání mezi těmito režimy udělat změny v záhlaví.

Když aplikace běží v režimu celé obrazovky nebo tabletu (jenom Windows 10), systém skryje ovládací tlačítka záhlaví a titulků. Uživatel ale může vyvolat záhlaví, aby byl zobrazen jako překryv nad uživatelským rozhraním aplikace.

Můžete zpracovat událost CoreApplicationViewTitleBar.IsVisibleChanged, abyste byli upozorněni, když je titulkový pruh skrytý nebo aktivován, a podle potřeby zobrazit nebo skrýt vlastní obsah titulkového pruhu.

Tento příklad ukazuje, jak zpracovat IsVisibleChanged událost k zobrazení a skrytí AppTitleBar elementu z předchozích příkladů.

public MainPage()
{
    this.InitializeComponent();

    var coreTitleBar = CoreApplication.GetCurrentView().TitleBar;

    // Register a handler for when the title bar visibility changes.
    // For example, when the title bar is invoked in full screen mode.
    coreTitleBar.IsVisibleChanged += CoreTitleBar_IsVisibleChanged;
}

private void CoreTitleBar_IsVisibleChanged(CoreApplicationViewTitleBar sender, object args)
{
    if (sender.IsVisible)
    {
        AppTitleBar.Visibility = Visibility.Visible;
    }
    else
    {
        AppTitleBar.Visibility = Visibility.Collapsed;
    }
}

Poznámka:

režim na celou obrazovku lze použít jenom v případě, že ji vaše aplikace podporuje. Další informace najdete v tématu ApplicationView.IsFullScreenMode . Režim tabletu (jenom Windows 10) je uživatelská možnost ve Windows 10 na podporovaném hardwaru, takže se uživatel může rozhodnout spustit libovolnou aplikaci v režimu tabletu.

Co dělat a co nedělat

Zviditelněte, když je okno aktivní nebo neaktivní. Minimálně změňte barvu textu, ikon a tlačítek v záhlaví.
Definujte oblast přetažení podél horního okraje plátna aplikace. Porovnávání umístění systémových záhlaví usnadňuje uživatelům hledání.
Definujte oblast přetažení, která odpovídá záhlaví vizuálu (pokud existuje) na plátně aplikace.

Příklad úplného přizpůsobení

Tento příklad ukazuje veškerý kód popsaný v části Úplné přizpůsobení.

<Page
    x:Class="WinUI2_ExtendedTitleBar.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:WinUI2_ExtendedTitleBar"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
    muxc:BackdropMaterial.ApplyToRootOrPageBackground="True">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="48"/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid x:Name="AppTitleBar" Background="Transparent">
            <!-- Width of the padding columns is set in LayoutMetricsChanged handler. -->
            <!-- Using padding columns instead of Margin ensures that the background
                 paints the area under the caption control buttons (for transparent buttons). -->
            <Grid.ColumnDefinitions>
                <ColumnDefinition x:Name="LeftPaddingColumn" Width="0"/>
                <ColumnDefinition/>
                <ColumnDefinition x:Name="RightPaddingColumn" Width="0"/>
            </Grid.ColumnDefinitions>
            <Image Source="Assets/WindowIcon.png" 
                   Grid.Column="1"
                   HorizontalAlignment="Left"
                   Width="16" Height="16"
                   Margin="8,0,0,0"/>
            <TextBlock x:Name="AppTitleTextBlock"
                       Text="App title" 
                       Style="{StaticResource CaptionTextBlockStyle}" 
                       Grid.Column="1"
                       VerticalAlignment="Center"
                       Margin="28,0,0,0"/>
        </Grid>

        <!-- This control has a higher z-order than AppTitleBar, 
             so it receives user input. -->
        <AutoSuggestBox QueryIcon="Find"
                        PlaceholderText="Search"
                        HorizontalAlignment="Center"
                        Width="260" Height="32"/>

        <muxc:NavigationView Grid.Row="1"
                             IsBackButtonVisible="Collapsed"
                             IsSettingsVisible="False">
            <StackPanel>
                <TextBlock Text="Content" 
                           Style="{ThemeResource TitleTextBlockStyle}"
                           Margin="12,0,0,0"/>
            </StackPanel>
        </muxc:NavigationView>
    </Grid>
</Page>

public MainPage()
{
    this.InitializeComponent();

    // Hide default title bar.
    CoreApplicationViewTitleBar coreTitleBar = 
        CoreApplication.GetCurrentView().TitleBar;
    coreTitleBar.ExtendViewIntoTitleBar = true;

    // Set caption buttons background to transparent.
    ApplicationViewTitleBar titleBar = 
        ApplicationView.GetForCurrentView().TitleBar;
    titleBar.ButtonBackgroundColor = Colors.Transparent;

    // Set XAML element as a drag region.
    Window.Current.SetTitleBar(AppTitleBar);

    // Register a handler for when the size of the overlaid caption control changes.
    coreTitleBar.LayoutMetricsChanged += CoreTitleBar_LayoutMetricsChanged;

    // Register a handler for when the title bar visibility changes.
    // For example, when the title bar is invoked in full screen mode.
    coreTitleBar.IsVisibleChanged += CoreTitleBar_IsVisibleChanged;

    // Register a handler for when the window activation changes.
    Window.Current.CoreWindow.Activated += CoreWindow_Activated;
}

private void CoreTitleBar_LayoutMetricsChanged(CoreApplicationViewTitleBar sender, object args)
{
    // Get the size of the caption controls and set padding.
    LeftPaddingColumn.Width = new GridLength(coreTitleBar.SystemOverlayLeftInset);
    RightPaddingColumn.Width = new GridLength(coreTitleBar.SystemOverlayRightInset);
}

private void CoreTitleBar_IsVisibleChanged(CoreApplicationViewTitleBar sender, object args)
{
    if (sender.IsVisible)
    {
        AppTitleBar.Visibility = Visibility.Visible;
    }
    else
    {
        AppTitleBar.Visibility = Visibility.Collapsed;
    }
}

 private void CoreWindow_Activated(CoreWindow sender, WindowActivatedEventArgs args)
 {
     UISettings settings = new UISettings();
     if (args.WindowActivationState == CoreWindowActivationState.Deactivated)
     {
         AppTitleTextBlock.Foreground = 
            new SolidColorBrush(settings.UIElementColor(UIElementType.GrayText));
     }
     else
     {
         AppTitleTextBlock.Foreground = 
            new SolidColorBrush(settings.UIElementColor(UIElementType.WindowText));
     }
 }

Váš názor

Byla tato stránka užitečná?

Last updated on 2025-06-10

Sdílet prostřednictvím

Přizpůsobení záhlaví

Součásti záhlaví

Do jaké míry přizpůsobit hlavní panel

Stručně

Úplný

Jednoduché přizpůsobení

Titulek

Barvy

Úplné přizpůsobení

Obsah záhlaví a oblasti pro tažení

Interaktivní obsah

Tlačítka titulků systému

Barva a průhlednost tlačítek titulků

Ztlumit panel titulku, když je okno neaktivní

Resetování záhlaví

Zobrazení a skrytí záhlaví

Co dělat a co nedělat

Příklad úplného přizpůsobení

Související články

Váš názor

Další materiály