这是银光虫还是我做错了什么？网格对齐

Question

我有一个有14列的网格。如果我在第一个网格的第一列中放置另一个28列的网格并将其跨越14，则将每列分成两部分。但是如果我创建42列（3x14）的网格，它不会在三个部分上分割每一列。

这个有效：

这不起作用（不等分）：

<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="SilverlightApplication1.MainPage"
Width="640" Height="480">
<Grid x:Name="LayoutRoot" Background="White">
    <Grid x:Name="AllWhiteKeys" Margin="0,0,0,200">         
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <Rectangle Name="WhiteKey1" Grid.RowSpan="3" Grid.Column="0" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey2" Grid.RowSpan="3" Grid.Column="1" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey3" Grid.RowSpan="3" Grid.Column="2" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey4" Grid.RowSpan="3" Grid.Column="3" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey5" Grid.RowSpan="3" Grid.Column="4" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey6" Grid.RowSpan="3" Grid.Column="5" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey7" Grid.RowSpan="3" Grid.Column="6" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey8" Grid.RowSpan="3" Grid.Column="7" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey9" Grid.RowSpan="3" Grid.Column="8" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey10" Grid.RowSpan="3" Grid.Column="9" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey11" Grid.RowSpan="3" Grid.Column="10" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey12" Grid.RowSpan="3" Grid.Column="11" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey13" Grid.RowSpan="3" Grid.Column="12" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>
        <Rectangle Name="WhiteKey14" Grid.RowSpan="3" Grid.Column="13" Fill="White" StrokeThickness="1" Stroke="Black" RadiusX="8" RadiusY="8"/>

        <Grid Grid.RowSpan="2" Grid.Column="0" Grid.ColumnSpan="14">
            <Grid.ColumnDefinitions>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>

                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>

                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
            </Grid.ColumnDefinitions>
        </Grid>
    </Grid>
    </Grid>

Answer 1

这只是一个舍入错误。

您的总宽度为640，分为42列，每列15.23像素，但是当它们计数时，列会四舍五入到最近的像素，因此列会来回微动。

如果将设计宽度更改为42的倍数（例如630），它就会消失。见下面的样本（630 * 480）：

正如@Joe White提到的那样你可以使用UseLayoutRounding来关闭舍入，但是你想要它清晰明了，你需要开始思考基于像素的维度（比如早期视频游戏开发的好日子） ）。

Answer 2

正如@HiTechMagic所说，这很可能是一个舍入错误。默认情况下，Silverlight将所有位置舍入为最接近的整数。

如果您希望事情准确排列，可以在外部Grid上将UseLayoutRounding设置为False。

如果你这样做，请注意某些东西将位于小数像素位置，因此图像看起来会模糊，背景无法无缝匹配（这可能是默认情况下布局舍入的原因）。但是，如果您正在尝试制作钢琴键盘，那么您可能会很好 - 有背景的唯一元素就是黑键，其中没有两个相邻。