WPF Coins arrondis - est-ce qu'un gradient cohérent autour du coin est possible?

Question

J'ai fait un dégradé que j'aime bien dans le mélange d'expression, et j'essaye de travailler si je peux faire la courbe de dégradé autour d'un coin, pour me donner un effet de bordure arrondie avec le dégradé.

Le problème est que je ne peux pas utiliser une bordure normale, car le dégradé ne sera pas cohérent.

je suis venu avec les éléments suivants qui devrait aider à démontrer ce que je pense: rounded corner with gradient http://img232.imageshack.us/img232/9899/roundedcornerrg0.th.jpg

<Grid x:Name="grid" > 
    <Border 
     BorderThickness="0,0,40,40" 
     CornerRadius="0,0,40,0" 
     Padding="2" Height="60" VerticalAlignment="Bottom" Width="65" HorizontalAlignment="Right" > 
     <Border.BorderBrush> 
      <RadialGradientBrush> 
       <RadialGradientBrush.RelativeTransform> 
        <TransformGroup> 
         <ScaleTransform CenterX="0.5" CenterY="0.5" ScaleX="2.058" ScaleY="2.177"/> 
         <SkewTransform AngleX="0" AngleY="0" CenterX="0.5" CenterY="0.5"/> 
         <RotateTransform Angle="-119.481" CenterX="0.5" CenterY="0.5"/> 
         <TranslateTransform X="0.209" Y="0.52"/> 
        </TransformGroup> 
       </RadialGradientBrush.RelativeTransform> 
       <GradientStop Color="#FF000000" Offset="0"/> 
       <GradientStop Color="#000A0A0A" Offset="1"/> 
       <GradientStop Color="#6B050505" Offset="0.829"/> 
       <GradientStop Color="#BB020202" Offset="0.763"/> 
      </RadialGradientBrush> 
     </Border.BorderBrush> 
    </Border> 
    <Rectangle VerticalAlignment="Stretch" Height="100" Width="40" HorizontalAlignment="Right" Margin="0,0,0,60" StrokeThickness="0" Panel.ZIndex="0"> 
     <Rectangle.Fill> 
      <LinearGradientBrush EndPoint="-0.025,0.5" StartPoint="1,0.5"> 
       <GradientStop Color="#FF000000" Offset="0"/> 
       <GradientStop Color="#000A0A0A" Offset="1"/> 
       <GradientStop Color="#6B050505" Offset="0.829"/> 
       <GradientStop Color="#BB020202" Offset="0.763"/> 
      </LinearGradientBrush> 
     </Rectangle.Fill> 
    </Rectangle> 
    <Rectangle VerticalAlignment="Bottom" Height="40" Width="100" HorizontalAlignment="Stretch" Margin="0,0,65,0"> 
     <Rectangle.Fill> 
      <LinearGradientBrush EndPoint="0.5,0" StartPoint="0.5,1"> 
       <GradientStop Color="#FF000000" Offset="0"/> 
       <GradientStop Color="#000A0A0A" Offset="1"/> 
       <GradientStop Color="#6B050505" Offset="0.829"/> 
       <GradientStop Color="#BB020202" Offset="0.763"/> 
      </LinearGradientBrush> 
     </Rectangle.Fill> 
    </Rectangle> 
</Grid> 

Est-il possible d'obtenir un gradient de flexion autour d'un coin comme je pense? J'ai vu une suggestion en ligne pour imbriquer des bordures les unes dans les autres, mais ce n'est pas bon pour moi non plus, car le dégradé rend la vie difficile.

Answer 1

Vous voudrez peut-être vérifier Charles Petzolds article on Graphical Paths with Gradient Colors dans lequel il discute d'un problème similaire à la vôtre.

Answer 2

<Grid x:Name="grid" VerticalAlignment="Top" HorizontalAlignment="Left" Width="100" Height="100" Margin="200,200,0,0"> 
     <Rectangle VerticalAlignment="Stretch" Width="20" HorizontalAlignment="Right" Margin="0,20,0,20" StrokeThickness="0" Panel.ZIndex="0"> 
      <Rectangle.Fill> 
       <LinearGradientBrush EndPoint="1,0" StartPoint="0,0"> 
        <GradientStop Color="#00FFFFFF" Offset="0"/> 
        <GradientStop Color="#FFFFFFFF" Offset="1"/> 
        <GradientStop Color="#22FFFFFF" Offset="0.5"/> 
        <GradientStop Color="#11FFFFFF" Offset="0.3"/> 
       </LinearGradientBrush> 
      </Rectangle.Fill> 
     </Rectangle> 
     <Rectangle VerticalAlignment="Bottom" Height="20" HorizontalAlignment="Stretch" Margin="20,0,20,0"> 
      <Rectangle.Fill> 
       <LinearGradientBrush EndPoint="1,1" StartPoint="1,0"> 
        <GradientStop Color="#00FFFFFF" Offset="0"/> 
        <GradientStop Color="#FFFFFFFF" Offset="1"/> 
        <GradientStop Color="#22FFFFFF" Offset="0.5"/> 
        <GradientStop Color="#11FFFFFF" Offset="0.3"/> 
       </LinearGradientBrush> 
      </Rectangle.Fill> 
     </Rectangle> 
     <Rectangle VerticalAlignment="Stretch" Width="20" HorizontalAlignment="Left" Margin="0,20,0,20" StrokeThickness="0" Panel.ZIndex="0"> 
      <Rectangle.Fill> 
       <LinearGradientBrush EndPoint="0,0" StartPoint="1,0"> 
        <GradientStop Color="#00FFFFFF" Offset="0"/> 
        <GradientStop Color="#FFFFFFFF" Offset="1"/> 
        <GradientStop Color="#22FFFFFF" Offset="0.5"/> 
        <GradientStop Color="#11FFFFFF" Offset="0.3"/> 
       </LinearGradientBrush> 
      </Rectangle.Fill> 
     </Rectangle> 
     <Rectangle VerticalAlignment="Top" Height="20" HorizontalAlignment="Stretch" Margin="20,0,20,0"> 
      <Rectangle.Fill> 
       <LinearGradientBrush EndPoint="1,0" StartPoint="1,1"> 
        <GradientStop Color="#00FFFFFF" Offset="0"/> 
        <GradientStop Color="#FFFFFFFF" Offset="1"/> 
        <GradientStop Color="#22FFFFFF" Offset="0.5"/> 
        <GradientStop Color="#11FFFFFF" Offset="0.3"/> 
       </LinearGradientBrush> 
      </Rectangle.Fill> 
     </Rectangle> 
     <Rectangle VerticalAlignment="Top" Height="20" Width="20" HorizontalAlignment="Left" Margin="0,0,0,0"> 
      <Rectangle.Fill> 
       <RadialGradientBrush Center=".9,.9" GradientOrigin="1,1" RadiusX=".85" RadiusY=".85"> 
        <GradientStop Color="#00FFFFFF" Offset="0"/> 
        <GradientStop Color="#FFFFFFFF" Offset="1"/> 
        <GradientStop Color="#22FFFFFF" Offset="0.5"/> 
        <GradientStop Color="#11FFFFFF" Offset="0.3"/> 
       </RadialGradientBrush> 
      </Rectangle.Fill> 
     </Rectangle> 
     <Rectangle VerticalAlignment="Bottom" Height="20" Width="20" HorizontalAlignment="Right" Margin="0,0,0,0"> 
      <Rectangle.Fill> 
       <RadialGradientBrush Center=".1,.1" GradientOrigin="0,0" RadiusX=".85" RadiusY=".85"> 
        <GradientStop Color="#00FFFFFF" Offset="0"/> 
        <GradientStop Color="#FFFFFFFF" Offset="1"/> 
        <GradientStop Color="#22FFFFFF" Offset="0.5"/> 
        <GradientStop Color="#11FFFFFF" Offset="0.3"/> 
       </RadialGradientBrush> 
      </Rectangle.Fill> 
     </Rectangle> 
     <Rectangle VerticalAlignment="Top" Height="20" Width="20" HorizontalAlignment="Right" Margin="0,0,0,0"> 
      <Rectangle.Fill> 
       <RadialGradientBrush Center=".1,.9" GradientOrigin="0,1" RadiusX=".85" RadiusY=".85"> 
        <GradientStop Color="#00FFFFFF" Offset="0"/> 
        <GradientStop Color="#FFFFFFFF" Offset="1"/> 
        <GradientStop Color="#22FFFFFF" Offset="0.5"/> 
        <GradientStop Color="#11FFFFFF" Offset="0.3"/> 
       </RadialGradientBrush> 
      </Rectangle.Fill> 
     </Rectangle> 
     <Rectangle VerticalAlignment="Bottom" Height="20" Width="20" HorizontalAlignment="Left" Margin="0,0,0,0"> 
      <Rectangle.Fill> 
       <RadialGradientBrush Center=".9,.1" GradientOrigin="1,0" RadiusX=".85" RadiusY=".85"> 
        <GradientStop Color="#00FFFFFF" Offset="0"/> 
        <GradientStop Color="#FFFFFFFF" Offset="1"/> 
        <GradientStop Color="#22FFFFFF" Offset="0.5"/> 
        <GradientStop Color="#11FFFFFF" Offset="0.3"/> 
       </RadialGradientBrush> 
      </Rectangle.Fill> 
     </Rectangle> 
    </Grid>