如何让XAML边框贴合ChessBoard元素？C#象棋应用布局问题

问题原因 #

你的ChessBoard继承自Grid且设置了HorizontalAlignment="Center"和VerticalAlignment="Center"，而外层Border默认会填充父容器（Grid）的全部空间。这导致ChessBoard在Border的可用区域内居中，从而出现边框与棋盘之间的空隙。

解决方案 #

方案1：让棋盘填满边框空间 #

直接修改ChessBoard的对齐方式为Stretch，使其填充Border的全部区域：

<Grid>
    <Border BorderBrush="SaddleBrown" BorderThickness="2">
        <local:ChessBoard x:Name="chessBoard" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
    </Border>
</Grid>

方案2：让边框自适应棋盘大小 #

给外层Border添加居中对齐属性，使其仅包裹ChessBoard的实际大小：

<Grid>
    <Border BorderBrush="SaddleBrown" BorderThickness="2" HorizontalAlignment="Center" VerticalAlignment="Center">
        <local:ChessBoard x:Name="chessBoard"/>
    </Border>
</Grid>

方案3：检查棋盘自身内边距 #

如果ChessBoard内部设置了Padding属性，会导致棋盘与边框之间产生空隙。需要在ChessBoard的XAML定义中将Padding设为0：

<!-- 在ChessBoard的XAML中 -->
<Grid Padding="0">
    <!-- 棋盘内部元素 -->
</Grid>

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