Wie kann ich eine GradientBrush auf mehrere aufeinander folgende Objekte in XAML anwenden?

Question

Ich habe einen Textblock und eine Linie sitzen nebeneinander in ihren eigenen exklusiven Stackpanel.

Ich brauche meine LinearGradientBrush über die beiden Objekte zu verteilen, anstatt sie einzeln schattieren.

Ihr Projekt sieht derzeit wie folgt aus:

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>

Wie gezeigt, wird der Gradient angelegt separat von der Linie TextBlock-. Ich muß einen Weg finden, um die Gradienten über den Textblock und die Linie in einem einzigen Durchgang gelten - als ob sie das gleiche Objekt vollständig waren. In diesem Beispiel sollte der Text sein, meist blau und die Linie sollte meist orange.

Answer 1

In WPF können Sie einen Visual Pinsel verwenden.

Fügen Sie eine Pinselressource zu Ihrem Fenster oder Kontrollressourcen:

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

Als nächstes gilt, dass die Bürste auf die OpacityMask eines rectange, zum Beispiel:

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

Sie können den Text in einen Pfad drehen, aber Sie werden die Fähigkeit verlieren, den Text zu ändern, als.

Answer 2

Ihr Problem ist, dass der Text nicht ein Vektor ist und so nicht mit der Linie (jede mögliche Weise, die ich kenne) kombiniert werden.

Ich glaube, dass es möglich ist, Text in einen Vektorpfad in Expression Blend zu ändern, und dann verwenden, um einen Beschneidungspfad über die Gradienten zu erstellen. Oder mit dem Textvektorpfad, wie Sie mit Ihrer Linie tun würden, verwenden Sie eine Hintergrundfarbe frei Höhe Rand und transparente Füllung auf dem Vektor selbst.

Scheint wie eine Menge Ärger zu gehen. Haben Sie sich Gedanken über eine dritte Farbe mit Hilfe der beiden zu verschmelzen? Zum Beispiel Textblock verblasst von Blau zu Orange, dann auf der Linie Orange Hintergrundfarbe. Sie könnten einen ähnlichen Effekt für viel weniger Aufwand erhalten können.