.net - 垂直进度条模板.net

Question

我尝试使用以下代码自定义 .Net 垂直进度条(使用 Visual 2010):

<ProgressBar Name="VolumeMeter" Orientation="Vertical" Margin="4,30,0,0" Value="50" HorizontalAlignment="Left" VerticalAlignment="Top" Height="300" Width="10">
        <ProgressBar.Template>
            <ControlTemplate TargetType="ProgressBar">
                <Border BorderBrush="Green" BorderThickness="1">
                    <Grid Name="PART_Track" Background="Red">
                        <Rectangle Name="PART_Indicator" Fill="Blue"/>                            
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="Orientation" Value="Horizontal">
                        <Setter TargetName="PART_Indicator" Property="VerticalAlignment" Value="Stretch"/>
                        <Setter TargetName="PART_Indicator" Property="HorizontalAlignment" Value="Left"/>
                    </Trigger>
                    <Trigger Property="Orientation" Value="Vertical">
                        <Setter TargetName="PART_Indicator" Property="VerticalAlignment" Value="Bottom"/>
                        <Setter TargetName="PART_Indicator" Property="HorizontalAlignment" Value="Stretch"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </ProgressBar.Template>
    </ProgressBar>

但是，它没有显示进度，怎么了？

Answer 1

您可能遇到的问题是 .Net 4.0 中的重大更改的结果，该更改是尝试提高 WPF ProgressBar 控件的性能的结果。 (不可否认，它非常需要。)引用 http://connect.microsoft.com/VisualStudio/feedback/details/571674/issue-with-vertical-progress-bar-on-4-0-framework

简短版本:在 .Net 3.5 及更早版本中，您可以创作进度条，并且它足够智能，可以自行调整垂直或水平方向。在 .Net 4.0 中，您必须像水平方向一样创作进度条，然后在方向为垂直时使用触发器和变换将其旋转为垂直方向。如果您使用的是 .Net 4.0(我怀疑您是)，这就是为什么您无法让进度条按照您期望的方式运行的原因。

可悲的是，这在 MSDN 中的记录非常少。值得注意的是 http://msdn.microsoft.com/en-us/library/ms750638.aspx 处的示例没有提到这一点，或以任何方式解决它。同样，ProgressBar 文档本身 ( http://msdn.microsoft.com/en-us/library/system.windows.controls.progressbar.aspx ) 没有记录与演示基础的先前版本相比的这一重大更改。谢天谢地，提交的错误，否则我(也)会认为我疯了。

执行此操作的正确方法现在类似于以下内容:

<ControlTemplate TargetType="ProgressBar">

  <Border x:Name="Root">
    <!-- Visual tree goes here, be sure to include PART_Indicator and PART_Track -->
  </Border>

  <!-- Triggers must come after the Visual Tree so we can reference names. -->
  <ControlTemplate.Triggers>
    <Trigger Property="Orientation" Value="Vertical">

      <!-- Rotate the progressbar so the left edge is the bottom edge -->
      <Setter TargetName="Root" Property="LayoutTransform">
        <Setter.Value>
          <RotateTransform Angle="270" />
        </Setter.Value>
      </Setter>

      <!-- 
      Fix the render dimensions b/c what was the width is now height and vice-versa. 
      Note that we have to use {RelativeSource TemplatedParent} b/c {TemplateBinding}
      can't be used in a setter's value.
      -->
      <Setter TargetName="Root" Property="Width"
       Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Height}"
       />
      <Setter TargetName="Root" Property="Height"
       Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Width}"
       />
    </Trigger>
  </ControlTemplate.Triggers>
</ControlTemplate>