Winui3内容扩展到标题栏

最新推荐文章于 2024-10-21 14:58:22 发布

浅墨入画，岁月入禅

最新推荐文章于 2024-10-21 14:58:22 发布

阅读量417

点赞数

分类专栏：操作栏文章标签： c#

本文链接：https://blog.youkuaiyun.com/a10750/article/details/130507656

版权

操作栏专栏收录该内容

51 篇文章

订阅专栏

本文介绍了如何在Winui3Gallery中修改导航栏和标题栏的背景颜色，确保它们一致。通过设置静态资源，可以将标题栏背景设为透明，解决右上角按钮不可见或样式不匹配的问题。在MainWindow.xaml和MainWindow.xaml.cs文件中进行相应代码配置，可以实现标题栏的自定义，并确保在页面跳转时标题仍然可见。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

效果

Winui3 Gallery中导航栏左侧和上方标题栏背景颜色相同，上方标题栏可以自定义：
在这里插入图片描述

代码：

App.xaml

<StaticResource x:Key="WindowCaptionBackground" ResourceKey="SystemControlTransparentBrush" />
<StaticResource x:Key="WindowCaptionBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />

将右上角按键的背景色设置为透明。如果不设置，会导致程序右上方三个按钮不可见或者跟title中其他元素颜色不同，或者不可点击等问题。

MainWindow.xaml

<Grid>
   <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Border x:Name="AppTitleBar" Height="32" VerticalAlignment="Top" Grid.Row="0">
        <StackPanel Orientation="Horizontal">
            <Image Source="Images/fileManager.png"
               HorizontalAlignment="Left"
               Width="16" Height="16"
               Margin="20,0"/>
            <TextBlock x:Name="AppTitleTextBlock" Text="SoftWare"
                   TextWrapping="NoWrap"
                   Style="{StaticResource CaptionTextBlockStyle}" 
                   VerticalAlignment="Center" Margin="0" />
        </StackPanel>
    </Border>
    <Frame x:Name="frame" Grid.Row="1"></Frame>
</Grid>

如果代码全写在MainWindow中，也可以不设置Grid.Row，直接把Border标签写上，然后再写其它前端元素即可，因为我把代码全写在了page界面中，需要从MainWindow跳转，如果不定义两行，frame.navigate指代的是整个页面，会导致title不可见。

MainWindow.xaml.cs

public MainWindow()
{
    this.InitializeComponent();
    ExtendsContentIntoTitleBar = true;
    SetTitleBar(AppTitleBar);
    frame.Navigate(typeof(MainPage), null);
}