如何修改UWP TabViewItem的圆角半径为0以实现直角效果？

我完全懂你遇到的麻烦——默认的TabViewItem自带圆角，不管直接设置TabView的CornerRadius、自定义ItemTemplate都没效果，甚至翻TabView的模板也找不到相关设置对吧？其实问题出在WinUI的系统资源绑定上，TabViewItem的圆角是由全局预设资源控制的，咱们可以通过以下几种方式搞定：

方法1：全局覆盖系统资源（所有TabViewItem生效） #

WinUI预定义了名为TabViewItemCornerRadius的资源来控制TabViewItem的圆角大小，只需要在你的App.xaml或者页面资源里重新定义这个资源为0即可：

<!-- 全局生效（放在App.xaml里） -->
<Application.Resources>
    <CornerRadius x:Key="TabViewItemCornerRadius">0</CornerRadius>
</Application.Resources>

如果只想让单个页面的TabView生效，就把这段代码放在页面的资源里：

<Page.Resources>
    <CornerRadius x:Key="TabViewItemCornerRadius">0</CornerRadius>
</Page.Resources>

方法2：自定义TabViewItem控件模板（精准控制） #

如果不想全局修改，或者需要更个性化的调整，可以提取TabViewItem的默认模板，找到负责背景的Border元素（通常名为BackgroundBorder），把它的CornerRadius直接设为0。

提取模板步骤（Visual Studio中）： #

• 选中TabViewItem控件，右键→编辑模板→编辑副本，选择模板存放的位置（比如页面资源）
• 在生成的模板里找到类似下面的Border元素，修改它的CornerRadius：

<Border x:Name="BackgroundBorder"
        CornerRadius="0" <!-- 把这里改成0 -->
        Background="{TemplateBinding Background}"
        BorderBrush="{TemplateBinding BorderBrush}"
        BorderThickness="{TemplateBinding BorderThickness}">
    <!-- 模板内其他元素 -->
</Border>

最后把这个自定义模板通过TabView的ItemContainerStyle统一应用：

<winui:TabView>
    <winui:TabView.ItemContainerStyle>
        <Style TargetType="winui:TabViewItem">
            <Setter Property="Template" Value="{StaticResource YourCustomTabViewItemTemplate}" />
        </Style>
    </winui:TabView.ItemContainerStyle>
    <!-- 你的Tab项内容 -->
</winui:TabView>

为什么之前的方法无效？ #

• 直接设置TabView的CornerRadius：这个属性控制的是TabView整体内容区域的圆角，和TabItem头部的圆角无关，所以没用。
• 在ItemTemplate里设置TabViewItem的CornerRadius：TabViewItem的这个属性并没有直接绑定到模板里的背景Border，模板里用的是系统预设资源，所以直接设置属性不会生效。

内容的提问来源于stack exchange，提问作者Muzib