某些设备的UWP中的XAML梯度问题

Question

我Page在我的应用中使用登陆屏幕.XAML看起来像这样:

<Grid x:Name="LayoutRoot">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="3*"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="7*"/>
        </Grid.RowDefinitions>

        <Rectangle StrokeThickness="0" Fill="#FF79D2F4" Margin="0,0,0,-10" Grid.RowSpan="2"/>

        <Rectangle StrokeThickness="0" Fill="#FF1F8CC5" Margin="0,-10,0,0" Grid.Row="2" Grid.RowSpan="2"/>

        <Image Source="ms-appx:///Assets/ViewMedia/Banners/Banner_Light_Big.jpg" Grid.Row="1" Grid.RowSpan="2"/>

        <Rectangle StrokeThickness="0" Grid.Row="2" Grid.RowSpan="2">
            <Rectangle.Fill>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Offset="0"/>
                    <GradientStop Color="#7F000000" Offset="1"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>

    </Grid>

    <StackPanel MaxWidth="300" Margin="20,35"
                HorizontalAlignment="Stretch" VerticalAlignment="Bottom">

        <Button x:Name="LoginButton" x:Uid="LoginButton" Style="{StaticResource BrandButtonStyle}" Margin="0,5"
                Click="LoginButton_Click"/>

        <Button x:Name="RegisterButton" x:Uid="RegisterButton" Style="{StaticResource BrandButtonStyle}" Margin="0,5"
                Click="RegisterButton_Click"/>

    </StackPanel>

</Grid>

我有3个设备在运行应用程序:

• 微软Lumia 950 XL [ M ]
• 定制构建PC [ PC ]
• 联想ThinkPad平板电脑2 [ T ]

在运行应用程序时,此页面在M和PC上呈现良好,但在T 上,底部的Gradient两个Buttons根本不呈现.我没有看到他们,但是我可以按下Buttons并且他们的tap事件将会打击.但如果我Rectangle用渐变评论一切都在所有设备上都很好.

这是应用程序在使用渐变时在T上的外观.没有按钮.并且渐变也不可见.

这是应用程序在没有渐变的情况下在T上的外观.按钮到位.

这就是它应该如何在PC上运行.按钮和渐变是可见的.

运行应用程序时,我没有看到输出中的任何错误.我不知道为什么只在特定设备上发生这种情况.也许这是一个众所周知的问题？

更新1

根据用户的反馈,我可以说这个bug只能攻击Atom驱动的设备.但我不确定这对于所有Atom供电设备是否100%真实.

更新2

我用Insider Preview Fast Ring的W10 更新了T. Bug到位了.因此,这与OS构建无关.

更新3

将Buttons Style恢复正常并不能解决这个问题.那么Style好,它不是原因.

Answer 1

Grid.RowSpan="2"尝试从Rectangle(或添加) 中删除(或添加RowDefinition)，您有 4 行 (4 RowDefinition)，但有了 ，Rectangle它Grid.RowSpan=2总共增加了 5 行，所以它可能会给您带来麻烦。

编辑：我的错，Rectangle实际上跨越了第 2 行和第 3 行（Grid.Row="2"），所以没关系。

由于您只是堆叠<StackPanel>（<Grid>没有什么花哨的），因此您可以尝试替换根布局<Grid x:Name="LayoutRoot">，<Canvas x:Name="LayoutRoot">看看是否会产生影响。