WPF Progressbar Rectangle -

WPF Progressbar Rectangle -

i using next progressbar style:

<style targettype="{x:type progressbar}"> <setter property="template"> <setter.value> <controltemplate targettype="{x:type progressbar}"> <grid minheight="14" minwidth="400" background="{templatebinding background}"> <border x:name="part_track" cornerradius="2" borderthickness="1"> <border.borderbrush> <solidcolorbrush color="#ffffff" /> </border.borderbrush> </border> <border x:name="part_indicator" cornerradius="2" borderthickness="1" horizontalalignment="left" background="{templatebinding foreground}" margin="0,-1,0,1"> <grid cliptobounds="true" x:name="animation"> <rectangle x:name="part_glowrect" width="200" horizontalalignment="left" fill="#3399ff" margin="0,0,0,0" /> </grid> </border> </grid> </controltemplate> </setter.value> </setter> <setter property="foreground" value="#404040"/> </style>

it's working fine want display 3 rectangles different colors @ time (left, center, right) indicator part, how can accomplish this?

you should alter part_glowrect border instead of rectangle, , add together desired rectangles within that:

<border x:name="part_indicator" cornerradius="2" borderthickness="1" horizontalalignment="left" background="{templatebinding foreground}" margin="0,-1,0,1"> <grid cliptobounds="true" x:name="animation"> <border x:name="part_glowrect" width="150" horizontalalignment="left" background="transparent" margin="0,0,0,0" > <grid> <grid.columndefinitions> <columndefinition width="*" /> <columndefinition width="*" /> <columndefinition width="*" /> </grid.columndefinitions> <rectangle grid.column="0" fill="red" /> <rectangle grid.column="1" fill="green" /> <rectangle grid.column="2" fill="blue" /> </grid> </border> </grid> </border>

this how like:

wpf