如何将GradientBrush应用于XAML中的多个连续对象?

时间:2009-09-20 03:11:00

标签: .net xaml .net-3.5 panel gradient

我有一个TextBlock和一条线在他们自己的独家StackPanel中彼此相邻。

我需要在两个对象上传播我的LinearGradientBrush,而不是单独着色它们。

我的项目目前看起来像这样:

http://img188.imageshack.us/img188/1268/seperategradients.png

<StackPanel Orientation="Horizontal">

    <TextBlock VerticalAlignment="Bottom">
        SomeTextContent
        <TextBlock.Foreground>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                <GradientStop Offset="0" Color="Blue" />
                <GradientStop Offset="1" Color="Orange" />
            </LinearGradientBrush>
        </TextBlock.Foreground>
    </TextBlock>

    <Line VerticalAlignment="Bottom" X2="100">
        <Line.Stroke>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                <GradientStop Offset="0" Color="Blue" />
                <GradientStop Offset="1" Color="Orange" />
            </LinearGradientBrush>
        </Line.Stroke>
    </Line>

</StackPanel>

如图所示,渐变从Line单独应用于TextBlock。我需要找到一种方法在一次传递中跨TextBlock和Line应用渐变 - 就好像它们完全是同一个对象一样。在此示例中,文本应该主要是蓝色,并且该行应该主要是橙色。

2 个答案:

答案 0 :(得分:2)

您的问题是文本不是矢量,因此无法与线条结合(我知道的任何方式)。

我相信可以在Expression Blend中将文本更改为矢量路径,然后使用它在渐变上创建剪切路径。或者,使用文本向量路径,就像使用线条一样,使用背景颜色无限制高度边框和矢量本身的透明填充。

似乎很麻烦。你有没有想过用第三种颜色合并两者?例如,文本块从蓝色变为橙色,然后在橙色线上淡入背景色。您可以通过更少的努力获得类似的效果。

答案 1 :(得分:2)

在WPF中,您可以使用Visual Brush。

将画笔资源添加到窗口或控制资源:

<Window.Resources>      
  <VisualBrush x:Key="stackPanel">
    <VisualBrush.Visual>
      <StackPanel Orientation="Horizontal">  
        <TextBlock VerticalAlignment="Bottom"> 
          SomeTextContent        
        </TextBlock>   
        <Line VerticalAlignment="Bottom" X2="100" Stroke="black"/>     
      </StackPanel>
    </VisualBrush.Visual>
  </VisualBrush>
</Window.Resources>

接下来,将该画笔应用于rectange的opacitymask,例如:

  <Rectangle OpacityMask="{DynamicResource stackPanel}">
    <Rectangle.Fill>
      <LinearGradientBrush EndPoint="1.0,0.5" StartPoint="0,0.5">
        <GradientStop Color="Blue" Offset="0"/>
        <GradientStop Color="Orange" Offset="1"/>
      </LinearGradientBrush>
     </Rectangle.Fill>
  </Rectangle>

您也可以将文本转换为路径,但是您将无法更改文本。