根据网格布局的椭圆位置

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。

但是您的椭圆从 Canvas 的顶部偏移了 10 个像素，因此它总共需要 110 个（10 个偏移 + 100 个像素的椭圆高度）才能完整显示。如果你的最后一行 space 的像素少于 110，那么它会被 t运行处理，看起来确实如此。

根据网格布局的椭圆位置

Ellipse position according to grid layout

c#

xaml

responsive-design

windows-phone-8.1

ellipse