¿Cómo diseñar correctamente una ProgressBar vertical elegante?

Question

Estoy tratando de hacer una barra de progreso con estilo, pero estoy teniendo un problema con su versión vertical. Una imagen vale más que mil palabras:

http://img402.imageshack.us/img402/2033/progressq.gif

Todo lo que he intentado hasta el momento ha dado como resultado incorrecto. ¿Cómo logro lo correcto? Preferiría una solución solo XAML a menos que sea lenta o que produzca parpadeos cuando la barra de progreso se actualiza muchas veces por segundo.

Answer 1

Aquí hay una alternativa:

<Border BorderBrush="Black" BorderThickness="2" CornerRadius="3" Padding="3"> 
    <Grid Width="20" Height="100"> 
     <Grid Height="{Binding ProgressValue}" VerticalAlignment="Bottom"> 
      <Grid Height="100" VerticalAlignment="Bottom"> 
       <Grid.Background> 
        <LinearGradientBrush StartPoint="0,0" EndPoint="1,1"> 
         <GradientStop Color="Yellow" Offset="0.0" /> 
         <GradientStop Color="Red" Offset="0.25" /> 
         <GradientStop Color="Blue" Offset="0.75" /> 
         <GradientStop Color="LimeGreen" Offset="1.0" /> 
        </LinearGradientBrush> 
       </Grid.Background> 
      </Grid> 
     </Grid> 
    </Grid> 
</Border> 

Nota de la tercera línea de la parte superior, que es donde se enlaza el valor de su progreso.