在XAML中創建自定義填充畫筆

Question

如何在XAML中創建以下形狀？

alt text http://mtx.dk/ellipse.png

<Ellipse Height="100" Width="100"> 
    <Ellipse.Fill> 
     ??? 
    </Ellipse.Fill> 
</Ellipse> 

一個LinearGradientBrush不能以這種方式轉化？ RadialGradientBrush也不適合。

任何想法？

Answer 1

你不能用橢圓和內置的筆刷來做，但是你自己寫這樣的形狀並不難。

您可以繪製大量「扇形」形狀，並將不同的線性漸變刷應用到每個切片。

這將讓你開始：

class GradiantEllipse : FrameworkElement 
{ 
    private const double N = 100; 

    protected override void OnRender(System.Windows.Media.DrawingContext drawingContext) 
    { 
     var radius = Math.Min(ActualWidth/2,ActualHeight/2); 
     var center = new Point(ActualWidth/2,ActualHeight/2); 
     for (int i = 0; i < N; ++i) 
     { 
      var startAngle = (Math.PI*2/N)*i; 
      var endAngle = (Math.PI*2/N)*(i+1)+2*(Math.PI/radius)+1/(2*Math.PI+radius); // + 1px to avoid gap 
      var start = new Point(Math.Cos(startAngle)*radius+center.X, 
       Math.Sin(startAngle)*radius+center.Y); 
      var end = new Point(Math.Cos(endAngle)*radius+center.X, 
       Math.Sin(endAngle)*radius+center.Y); 
      var figure = new PathFigure(); 
      figure.StartPoint = center; 
      figure.Segments.Add(new LineSegment(start,false)); 
      figure.Segments.Add(new LineSegment(end,false)); 
      figure.IsClosed = true; 
      var geo = new PathGeometry(); 
      geo.Figures.Add(figure); 

      var gradiant = new LinearGradientBrush(
       Color.FromArgb(255, (byte)((255.0/N) * i), (byte)((255.0/N) * i), (byte)((255.0/N) * i)), 
       Color.FromArgb(255, (byte)((255.0/N) * (i + 1)), (byte)((255.0/N) * (i + 1)), (byte)((255.0/N) * (i + 1))), 
       Math.Atan2(end.Y - start.Y, end.X - start.X) * 180/Math.PI); 

      drawingContext.DrawGeometry(gradiant, null, geo); 
     } 
    } 
} 

Answer 2

最好的辦法是創建一個帶有一些自定義繪圖說明的DrawingBrush，也許將橢圓劃分爲四個部分並填充每個不同的RadialGradientBrush。