59 votes

Problème de gradient XAML dans UWP pour certains périphériques

Je suis à l'aide d' Page d'atterrissage de l'écran de mon application. XAML ressemble à ceci:

<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>

J'ai 3 appareils sur lesquels je suis à l'exécution de l'application:

  • Microsoft Lumia 950 XL [M]
  • Custom build PC [PC]
  • Lenovo ThinkPad Tablet 2 [T]

Lors de l'exécution de l'application de cette page s'affiche bien sur la M et PC mais sur T Gradient et deux Buttons au fond ne sont pas rendus à tous. Je ne les vois pas mais je peux appuyez sur Buttons et leurs appuyez sur un événement hadlers va frapper. Mais si je commente Rectangle avec un dégradé tout va bien sur tous les appareils.

C'est la façon dont l'application a l'air sur T lors de l'utilisation de gradient. Pas de boutons. Et le dégradé est pas visible. With gradient

C'est la façon dont l'application a l'air sur T sans gradient. Les boutons sont en place. Without gradient

Et c'est comment il devrait ressembler en cours d'exécution sur le PC. Boutons et de dégradé sont visibles. This is how it should look

Je ne vois pas d'erreurs dans la sortie lors de l'exécution de l'application. Je ne sais pas pourquoi cela se produit uniquement sur des appareils spécifiques. Peut-être que c'est le genre de problème connu?

Mise à JOUR 1

À partir de la rétroaction des utilisateurs, je peux dire que ce bug uniquement les hits Atome d'appareils électriques. Mais je ne suis pas sûr si cela est vrai à 100% pour tous Atome d'appareils électriques.

Mise à JOUR 2

J'avais mis à jour T avec W10 d'Initiés Aperçu Rapide de l'Anneau. Le Bug est en place. Ce n'est donc pas relié à l'OS s'appuie.

Mise à JOUR 3

Swithing Buttons Style retour à la normale ne permet pas de résoudre ce problème. Donc, Style est bon, ce n'est pas la cause.

1voto

Yoav Aharoni Points 1713

Essayez de supprimer l' Grid.RowSpan="2" de la Rectangle (ou ajouter un RowDefinition), vous disposez de 4 lignes (4 RowDefinition), mais avec l' Rectangle avoir Grid.RowSpan=2 il ajoute jusqu'à 5 lignes, de sorte qu'il pourrait vous causer des ennuis.

EDIT: My bad, Rectangle réellement s'étend sur les lignes 2 et 3 (Grid.Row="2"), donc c'est ok.

Puisque vous êtes juste de l'empilement <StackPanel> sur <Grid> (avec rien de compliqué), vous pouvez essayer de remplacer la racine de la mise en page <Grid x:Name="LayoutRoot"> avec <Canvas x:Name="LayoutRoot"> et voir si cela fait une différence.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X