根据网格布局的椭圆位置

Question

我在我的 wp 8.1 应用程序 (XAML/C#) 中遇到了一些元素的定位问题。我已经读过要创建灵活的布局，我应该使用网格控件。 好吧，这是我在页面元素中的 XAML：

<Grid  Style="{StaticResource LayoutGridCreateProfilStyle}">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <Rectangle Grid.Row="0" Height="60" Fill="#F3A8E4F9" ></Rectangle>
    <Rectangle Grid.Row="1" Height="40" Fill="Gray"></Rectangle>
    <ListBox Grid.Row="2" Height="420" Background="Transparent"/>
    <Canvas Grid.Row="3">
        <Ellipse Height="100" Margin="0,0,0,0" Width="100" Fill="Black" Canvas.Left="152" Canvas.Top="10"></Ellipse>
    </Canvas>

</Grid>

在 XAML 设计器中，我实际上看到了我想要的内容，如下所示：

这是在我的诺基亚 Lumia 925 上的外观：

如您所见，椭圆被切割了，我真的不知道如何按应有的方式放置它，并且实际出现在设计器视图中。 也许有人可以帮助我？

提前致谢！

Answer 1

问题是您的高度不足以显示网格的所有元素。前三行占用了 540 像素的累积高度。如果运行时高度为 640，那么网格的最后一行只剩下 100 个。

但是你的 Ellipse 从 Canvas 的顶部偏移了 10 像素，所以它总共需要 110（10 偏移 + 100 像素椭圆高度）才能完全显示。如果您的最后一行的空间小于 110 像素，那么它将被截断，看起来确实如此。