2010-10-27 27 views
23

Tôi đang cố gắng áp dụng nền màu gradient cho một hàng trong lưới XAML Silverlight mà tôi đã tạo.Áp dụng màu nền cho toàn bộ hàng Grid trong XAML Silverlight

tôi có thể làm một cái gì đó như thế này mà không cần bất kỳ rắc rối:

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

Thật không may này áp dụng gradient cho toàn bộ lưới điện.

Dường như tôi không thể áp dụng độ dốc (hoặc thậm chí là màu) cho định nghĩa hàng riêng lẻ trong lưới. Có thể không?

Cảm ơn!

Trả lời

46

Sử dụng Border và sau đó sử dụng Grid.RowGrid.ColumnSpan để đặt nó vào hàng cụ thể của Grid mà bạn muốn.

<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

Bạn da người đàn ông , Đàn ông. –

+0

Vui vì tôi có thể giúp. – Donut

+0

Cảm ơn! Tôi đã áp dụng điều này cho một trường hợp tương tự, nơi tôi có một nền hình ảnh được áp dụng cho nhiều hàng, nhưng các hàng được tự động, vì vậy sử dụng một hình ảnh sẽ không cắt nó, biên giới hoạt động hoàn hảo! – jv42

0

Nếu bạn muốn mô phỏng hai màu theo thứ tự dọc, bạn cũng có thể sử dụng thuộc tính Bù đắp. Nếu bạn đặt hai trên cùng một giá trị, bạn sẽ có được mô phỏng này:

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

Bạn có thể làm nhiều hơn :)

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

Các vấn đề liên quan