如何移除WPF应用顶部Grid行下方的分隔线

你看到的这条分隔线，大概率是两个独立Grid控件的边缘因WPF布局渲染的像素对齐问题，或是主Grid默认白色背景透过缝隙显露导致的——虽然你给Row0和Row1的Grid都设了DarkSlateGray背景，但最外层主Grid没设置背景色，一旦两个Grid之间出现哪怕1像素的空隙，就会透出白色线条。

下面是两种可靠的解决方法：

方法1：给主Grid设置统一背景色 #

直接在最外层<Grid>标签添加同色背景，彻底消除缝隙透出的色差：

<Grid Background="DarkSlateGray">
    <Grid.RowDefinitions>
        <RowDefinition Height="50"></RowDefinition>
        <RowDefinition Height="50"></RowDefinition>
        <RowDefinition />
    </Grid.RowDefinitions>
    <!-- 后续原有内容保持不变 -->
</Grid>

方法2：合并顶部两个Grid为一个控件 #

把原本Row0和Row1的两个Grid合并成一个，让它同时占用主Grid的前两行，内部再拆分布局，从根源上消除两个控件的边缘间隙：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="50"></RowDefinition>
        <RowDefinition Height="50"></RowDefinition>
        <RowDefinition />
    </Grid.RowDefinitions>
    <!-- 合并后的顶部Grid，覆盖主Grid前两行 -->
    <Grid Grid.Row="0" Grid.RowSpan="2" Background="DarkSlateGray">
        <Grid.RowDefinitions>
            <RowDefinition Height="50"></RowDefinition>
            <RowDefinition Height="50"></RowDefinition>
        </Grid.RowDefinitions>
        <!-- 原Row0的标题栏内容 -->
        <DockPanel Grid.Row="0" VerticalAlignment="Center">
            <Grid>
                <Rectangle Width="30" Height="30" Margin="10,0,0,0" VerticalAlignment="Center" Fill="#2F2F2F" ></Rectangle>
                <Image Width="30" Height="30" Margin="10,0,0,0" VerticalAlignment="Center"></Image>
            </Grid>
            <TextBlock Margin="10,0,0,0" FontSize="30" VerticalAlignment="Center">Title</TextBlock>
        </DockPanel>
        <!-- 原Row1的导航按钮内容 -->
        <Grid Grid.Row="1">
            <Grid.Resources>
                <Style TargetType="RadioButton" BasedOn="{StaticResource NavButton}"/>
            </Grid.Resources>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <RadioButton Grid.Column="0" Content="Home" VerticalAlignment="Center" Checked="RadioButton_Checked" Tag="home" IsChecked="True"></RadioButton>
            <RadioButton Grid.Column="1" Content="System" VerticalAlignment="Center" Checked="RadioButton_Checked" Tag="system"></RadioButton>
            <RadioButton Grid.Column="2" Content="Troubleshoot" VerticalAlignment="Center" Checked="RadioButton_Checked" Tag="troubleshoot"></RadioButton>
            <RadioButton Grid.Column="3" Content="Support" VerticalAlignment="Center" Checked="RadioButton_Checked" Tag="support"></RadioButton>
        </Grid>
    </Grid>
    <!-- 第三行内容区域 -->
</Grid>

额外排查点 #

如果以上方法无效，可检查：

• NavButton样式是否给RadioButton添加了顶部边框，误造成分隔线视觉效果
• 尝试临时设置WindowStyle="None"，验证是否是窗口默认边框导致的干扰

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