Question

我对扩展进度控制的通用模板有点困难。基本上，模板由网格，一些文本信息和实际进度条组成。

除了当我想切换到垂直方向时，它工作正常。一切似乎都正确旋转，但我没有进度指示器。我希望它的东西很傻，我忽略了，只需要第二眼就能看到......

以下是模板：

<ControlTemplate TargetType="{x:Type local:MyProgressControl}">
    <Grid x:Name="gridLayout"
          Background="{TemplateBinding Background}"
          HorizontalAlignment="Stretch"
          VerticalAlignment="Stretch">

        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" MinHeight="20" />
        </Grid.RowDefinitions>

        <StackPanel x:Name="stackLabels"
                    Grid.Row="0"
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Orientation="Horizontal">
            <TextBlock x:Name="txtProgress"
                       Style="{Binding TextBlockStyle, 
                                       RelativeSource={RelativeSource TemplatedParent}}"
                       Margin="3,1"
                       Text="{Binding IndicationText,
                                      RelativeSource={RelativeSource TemplatedParent}}"
                       Visibility="{Binding ShowIndicationText,
                                            RelativeSource={RelativeSource TemplatedParent},
                                            Converter={StaticResource booleanToVisibility}}" />
            <TextBlock x:Name="txtValue"
                       Style="{Binding TextBlockStyle, RelativeSource={RelativeSource TemplatedParent}}"
                       Margin="3,1"
                       Text="{Binding RoundedValue, RelativeSource={RelativeSource TemplatedParent}}"
                       Visibility="{Binding ShowProgressText,
                                    RelativeSource={RelativeSource TemplatedParent},
                                    Converter={StaticResource booleanToVisibility}}" />

            <TextBlock x:Name="txtOf"
                       Style="{Binding TextBlockStyle, RelativeSource={RelativeSource TemplatedParent}}"
                       Margin="3,1"
                       Text="/"
                       Visibility="{Binding ShowProgressText,
                                            RelativeSource={RelativeSource TemplatedParent},
                                            Converter={StaticResource booleanToVisibility}}" />

            <TextBlock x:Name="txtMaximum"
                       Style="{Binding TextBlockStyle, RelativeSource={RelativeSource TemplatedParent}}"
                       Margin="3,1"
                       Text="{Binding RoundedMaximum,
                                      RelativeSource={RelativeSource TemplatedParent}}"
                       Visibility="{Binding ShowProgressText,
                                            RelativeSource={RelativeSource TemplatedParent},
                                            Converter={StaticResource booleanToVisibility}}" />

        </StackPanel>

        <Border x:Name="PART_Track"
                Grid.Row="1"
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}"
                CornerRadius="8">
            <Border.Background>
                <LinearGradientBrush x:Name="trackBrush" StartPoint="0.5, 0" EndPoint="0.5, 1">
                    <GradientStop Offset="0.0" Color="#6A6A6A" />
                    <GradientStop Offset="0.2" Color="#949494" />
                    <GradientStop Offset="0.35" Color="#A9A9A9"  />
                    <GradientStop Offset="0.55" Color="#D3D3D3" />
                    <GradientStop Offset="0.65" Color="#949494" />
                    <GradientStop Offset="1.0" Color="#3F3F3F" />
                </LinearGradientBrush>
            </Border.Background>
            <Decorator x:Name="PART_Indicator"
                       Margin="1"
                       HorizontalAlignment="Left"
                       VerticalAlignment="Stretch">
                <Border x:Name="borderIndicator"
                        Background="{TemplateBinding BackgroundBrush}"   
                        CornerRadius="{Binding ElementName=PART_Track, Path=CornerRadius}" />
            </Decorator>
        </Border>
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="Orientation" Value="Vertical">
            <Setter Property="LayoutTransform" TargetName="gridLayout">
                <Setter.Value>
                    <RotateTransform Angle="90" />
                </Setter.Value>
            </Setter>
            <Setter Property="LayoutTransform" TargetName="PART_Track">
                <Setter.Value>
                    <RotateTransform Angle="-90" />
                </Setter.Value>
            </Setter>                
            <Setter Property="HorizontalAlignment" TargetName="PART_Indicator" Value="Stretch" />
            <Setter Property="VerticalAlignment" TargetName="PART_Indicator" Value="Bottom" />
            <Setter Property="LayoutTransform" TargetName="PART_Indicator">
                <Setter.Value>
                    <RotateTransform Angle="-90" />
                </Setter.Value>
            </Setter>
            <Setter Property="HorizontalAlignment" TargetName="borderIndicator" Value="Stretch" />
            <Setter Property="VerticalAlignment" TargetName="borderIndicator" Value="Bottom" />
            <Setter Property="LayoutTransform" TargetName="borderIndicator">
                <Setter.Value>
                    <RotateTransform Angle="-90" />
                </Setter.Value>
            </Setter>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

谢谢， WTS

Answer 1

我无法弄清楚你想要达到的结果。您使用四个嵌套级别的旋转似乎很奇怪。例如，你的borderIndicator将颠倒，因为它将受到所有四个LayoutTransforms的影响：gridLayout将旋转它+90而PART_Track，PART_Indicator和borderIndicator都将它旋转-90。因此总旋转将为+ 90-90-90-90 = -180。这是你的意图吗？

另一个令人意想不到的是你在装饰器中使用Border的方式。显然，你的代码隐藏设计会以某种方式影响PART_Track和PART_Indicator，但是你不清楚你正在对Decorator做什么阻止它实际上成为一个Border并完成当前在其中的Border的工作。

说了这么多，我认为这就是问题所在：

<Setter Property="VerticalAlignment" TargetName="borderIndicator" Value="Bottom" />

由于Border没有自然大小，因此“Bottom”的VerticalAlignment将导致它的高度为零。

我肯定会建议你找到一种方法来减少你应用的LayoutTransforms的数量。事实上，在我看来，只有外部两个实际上是必要的。我也会考虑合并装饰器和边框。

自定义ProgressBar ControlTemplate

1 个答案: