Como posso aplicar um GradientBrush a vários objetos consecutivos em XAML?

Question

Eu tenho um TextBlock e uma linha sentado ao lado do outro em sua própria StackPanel exclusivo.

Eu preciso espalhar meu LinearGradientBrush através dos dois objetos, em vez de sombreamento-los individualmente.

Meu projeto atualmente se parece com isso:

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>

Como se mostra, o gradiente é aplicado a TextBlock separadamente a partir da linha. Eu preciso encontrar uma maneira de aplicar o gradiente através do TextBlock ea Linha em uma única passagem - como se fossem o mesmo objeto inteiramente. Neste exemplo, o texto deve ser na maior parte azul e a linha deve ser principalmente de laranja.

Answer 1

Em WPF você pode usar um Visual Brush.

Adicionar um recurso de pincel para seus recursos de janela ou de controle:

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

Em seguida, aplicar o pincel para o OpacityMask de um rectange, por exemplo:

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

Você pode transformar o texto em um caminho muito, mas você vai perder a capacidade de alterar o texto de.

Answer 2

Seu problema é que o texto não é um vetor e assim não pode ser combinada com a linha (qualquer forma que eu saiba).

Eu acredito que é possível alterar o texto em um caminho de vetor no Expression Blend e, em seguida, usar isso para criar um caminho de recorte ao longo do gradiente. Ou, usando o caminho texto vetor como você faria com a sua linha, use uma borda cor de fundo irrestrito-altura e preenchimento transparente no próprio vector.

Parece que um monte de problemas para ir. Você já pensou em usar uma terceira cor para fundir os dois? Por exemplo bloco de texto de fade do azul para o laranja, em seguida, na linha laranja a cor de fundo. Você pode ser capaz de obter um efeito semelhante por muito menos esforço.