2013-10-15 101 views
2

請考慮以下LinearGadientBrush,'A'。通常,如果將該筆刷指定爲矩形的背景,則無論大小如何,都會使用整個漸變填充整個區域。 (見B)。是否有可能只渲染一個GradientBrush的百分比?

我們試圖說'對於這個特定的控件,只能使用刷子的第一個xx%來填充',所以我們可以實現基於百分比的漸變填充,如'C'。

enter image description here

注:我們知道我們將負責展示其百分比,因爲沒有辦法讓系統自動計算什麼的百分比表示。

我們目前正在做這件事的方式顯示在'D'中。我們以100%的大小定義一個矩形(所以填充爲100%),然後將其放置在另一個控件中並左對齊。然後,我們將外部控件的ClipsToBounds設置爲true,並將其寬度設置爲內矩形寬度的所需百分比。 (見D)這種方法很有效,但在視覺樹中添加了額外的元素,如果可能的話,我們試圖消除這些元素。

回答

1

使用LinearGradientBrush的EndPoint屬性。在你的情況下,如果你設置EndPoint="2,0"你應該得到你想要的結果。

如果您需要做更動態的事情,您可以將點對象綁定到EndPoint屬性。如果將該值設置爲1,0,則它將顯示100%的梯度,或者2,0顯示梯度的前50%。

StartPoint允許您在漸變的另一側做同樣的事情。

+0

關閉,但這裏有一個問題。由於StartPoint和EndPoint是筆刷本身的屬性,因此每個渲染值需要一個筆刷實例。儘管如此,它還是不適合你的信息,因爲它引導了我剛剛發佈的使用MappingMode達到同樣效果的答案。 – MarqueIV

1

找到它。這是畫筆的MappingMode。如果將其設置爲絕對值,則它以實際座標呈現,而不是以控件本身的百分比呈現,這意味着如果「完整」寬度爲240單位,則將終點設置爲240.(請注意,GradientStop偏移始終在StartPoint和EndPoint之間的距離的百分比。)

下面是你需要一個刷子,每個'寬度'的控制你想渲染,這意味着如果你有10個條形圖在200單位寬和六個更多在150個單位寬,你需要兩個刷子,每個寬度一個。

下面是從MSDN的例子...

<!-- The MappingMode property is set to "Absolute" which specifies that the coordinate 
    system used for the StartPoint and EndPoint properties is not relative to the 
    Brush output area. Values are interpreted directly in local space. --> 

<!-- Create a brush that is absolutely 200 units wide --> 
<LinearGradientBrush MappingMode="Absolute" 
    StartPoint="0,0" EndPoint="200,0"> 

    <GradientStop Color="Yellow" Offset="0" /> 
    <GradientStop Color="Red"  Offset="0.25" /> 
    <GradientStop Color="Blue"  Offset="0.75" /> 
    <GradientStop Color="LimeGreen" Offset="1" /> 

</LinearGradientBrush> 
相關問題