2010-10-27 2 views
23

J'essaie d'appliquer un arrière-plan dégradé à une seule ligne d'une grille XAML Silverlight que j'ai créée.Application d'une couleur d'arrière-plan à une ligne de grille entière dans XAML Silverlight

Je peux faire quelque chose comme ça, sans aucun problème:

<Grid> 
    <Grid.Background> 
     <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
      <GradientStop Color="Black" Offset="0" /> 
      <GradientStop Color="White" Offset="1" /> 
     </LinearGradientBrush> 
    </Grid.Background> 

    <Grid.ColumnDefinitions> 
     <ColumnDefinition/> 
     <ColumnDefinition/> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition/> 
     <RowDefinition/> 
    </Grid.RowDefinitions> 

    <!-- components and various stuffs --> 
</Grid> 

Malheureusement, cela applique le gradient à l'ensemble du réseau.

Il semble que je ne puisse pas appliquer un dégradé (ou même une couleur) à une définition de ligne individuelle dans la grille. C'est possible?

Merci!

Répondre

46

Utilisez un Border, puis utilisez Grid.Row et Grid.ColumnSpan pour le placer dans la ligne spécifique du Grid que vous souhaitez.

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition/> 
     <ColumnDefinition/> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition/> 
     <RowDefinition/> 
    </Grid.RowDefinitions> 

    <Border Grid.Row="1" Grid.ColumnSpan="2"> 
     <Border.Background> 
     <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
      <GradientStop Color="Black" Offset="0" /> 
      <GradientStop Color="White" Offset="1" /> 
     </LinearGradientBrush> 
     </Border.Background> 
    </Border> 

    <!-- other controls in the grid --> 
</Grid> 
+1

Vous da l'homme , mec. –

+0

Content de pouvoir aider. – Donut

+0

Merci! J'ai appliqué ceci à un cas similaire où j'avais un fond d'image qui devait être appliqué à plus d'une rangée, mais les rangées étaient autosized, ainsi employer une image n'allait pas le couper, la frontière fonctionne parfait! – jv42

0

Si vous souhaitez simuler deux couleurs dans l'ordre vertical, vous pouvez également utiliser la propriété Décalage. Si vous réglez ces deux sur la même valeur, vous obtenez cette simulation:

<Border.Background> 
 
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
 
       <GradientStop Color="Green" Offset="0.366" /> 
 
       <GradientStop Color="Red" Offset="0.366" /> 
 
      </LinearGradientBrush> 
 
</Border.Background>

Vous pouvez faire encore plus :)

<Border.Background> 
 
    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
 
    <GradientStop Color="Green" Offset="0.3" /> 
 
    <GradientStop Color="Red" Offset="0.3" /> 
 
    <GradientStop Color="Red" Offset="0.7" /> 
 
    <GradientStop Color="Yellow" Offset="0.7" /> 
 
    <GradientStop Color="Yellow" Offset="0.9" /> 
 
    <GradientStop Color="Blue" Offset="0.9" /> 
 
    </LinearGradientBrush> 
 
</Border.Background>

Questions connexes