2010-10-27 13 views
23

Sto provando ad applicare uno sfondo sfumato a una sola riga in una griglia XAML Silverlight che ho creato.Applicazione di un colore di sfondo a un'intera riga della griglia in XAML Silverlight

posso fare qualcosa di simile senza alcuna difficoltà:

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

Purtroppo questo vale il gradiente per l'intera griglia.

Sembra che non sia possibile applicare una sfumatura (o anche un colore) a una singola definizione di riga nella griglia. È possibile?

Grazie!

risposta

46

Utilizzare un Border e quindi utilizzare Grid.Row e Grid.ColumnSpan per inserirlo nella riga specifica di Grid desiderata.

<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

È da uomo , amico. –

+0

Contento di aver potuto aiutare. – Donut

+0

Grazie! Ho applicato questo a un caso simile in cui avevo uno sfondo di immagine che doveva essere applicato a più di una riga, ma le righe sono state ridimensionate automaticamente, quindi l'utilizzo di un'immagine non lo avrebbe tagliato, il Border funziona perfettamente! – jv42

0

Se si desidera simulare due colori in ordine verticale, è anche possibile utilizzare la proprietà Offset. Se si imposta questi due sullo stesso valore, si ottiene questa simulazione:

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

Si può fare ancora di più :)

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

Problemi correlati