在 XAML Silverlight 中将背景颜色应用于整个网格行答案

【问题标题】：Applying a background color to an entire Grid row in XAML Silverlight在 XAML Silverlight 中将背景颜色应用于整个网格行
【发布时间】：2010-10-27 19:56:35
【问题描述】：

我正在尝试将渐变背景应用到我创建的 XAML Silverlight 网格中的一行。

我可以毫无困难地做这样的事情：

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

不幸的是，这会将渐变应用于整个网格。

似乎我无法将渐变（甚至颜色）应用于网格中的单个行定义。有可能吗？

谢谢！

【问题讨论】：

标签： silverlight xaml background gradient

【解决方案1】：

使用Border，然后使用Grid.Row 和Grid.ColumnSpan 将其放在您想要的Grid 的特定行中。

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

【讨论】：

谢谢！我将此应用于类似的情况，其中我有一个要应用于多行的图像背景，但行是自动调整的，因此使用图像不会剪切它，边框完美！

【解决方案2】：

如果要按垂直顺序模拟两种颜色，也可以使用 Offset 属性。如果你将这两个设置为相同的值，你会得到这个模拟：

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

你可以做更多:)

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

【讨论】：