WPF徑向進度條與徑向梯度

在this question and answer的幫助下，我設法創建了徑向進度條。這實現了弧線與起始角度和結束角度相結合的弧線繪製概念。WPF徑向進度條與徑向梯度

我現在的問題是我希望進度條從圓弧中心有徑向漸變。這爲進度條提供了從弧內到弧外的「線性漸變」。我試圖在弧的筆畫上應用徑向漸變（ProgressBar的Foreground屬性），但是這將在弧形筆畫的中心應用徑向漸變，而不是弧對象的中心（如下所示）。

當電弧爲100％（或75％以上的任何東西），行程的中心是在電弧，從而產生所期望的結果的中心。

如何使所需梯度在所有施加的填充百分比可予調整一致徑向漸變到圓弧的中心的中心？還是有更好的解決方案/方法來解決這個問題？

來源

2016-05-26 jeff17237

由於您使用的RadialGradient最有可能爲Relative，它將根據實際弧的大小改變其中心。

當電弧在75％或更高，由Arc產生的Geometry處於其最大Width和Height，因此穩定和覆蓋整個控制。

你想要做的是繪製整個圓圈並遮罩「原始」圓弧之外的部分。在你的情況下，Easies的方法是用下面的方法替換Arc.OnRender方法：

Arc。CS

protected override void OnRender(DrawingContext drawingContext) 
{ 
    // half the width and height of the Arc 
    double radiusX = RenderSize.Width/2; 
    double radiusY = RenderSize.Height/2; 

    // the outlines of the "original" Arc geometry 
    PathGeometry clip = GetArcGeometry().GetWidenedPathGeometry(
     new Pen(Stroke, StrokeThickness)); 

    // draw only in the area of the original arc 
    drawingContext.PushClip(clip); 
    drawingContext.DrawEllipse(Stroke, null, new Point(radiusX, radiusY), radiusX, radiusY); 
    drawingContext.Pop(); 
}

說明

獲取未修改Geometry由原始代碼計算（GetArcGeometry）
與先前用於繪製弧形的Pen擴展它（GetWidenedPathGeometry）
指示DrawingContext忽略該區域以外的任何內容（Push(clip) ）
繪製漸變（DrawEllipse）
一個完整的圓責成DrawingContext從現在開始（Pop）

結果

來源

2016-05-26 12:46:21

這個工作完全忽略clip ，謝謝 – jeff17237

我們怎樣才能把邊緣變成圓角？ – dnxit

@dnxit實際上這很容易。簡單地將線帽設置爲圓形，例如使用這個Pen：'新筆（Stroke，StrokeThickness）{StartLineCap = PenLineCap.Round，EndLineCap = PenLineCap.Round}'。請記住，這將如何尋找非常低或高角度。 –

一個不是很好，但易於實施的解決方案。您需要對xaml進行調整，以便隨着進度的增加，而不是隨着徑向漸變角度的增加而產生弧線，而是在具有灰色的弧線後面具有所需漸變的弧線。灰色圓弧的角度減小，以正確的徑向梯度揭示背景弧。

來源

2016-05-26 12:27:28

WPF徑向進度條與徑向梯度

回答

相關問題