代码之家 › 专栏 › 技术社区 › falukky

如何创建负角半径

progress border wpf

falukky · 技术社区 · 6 年前

Progress-Bar 右边很简单 Border 边框 我想把 Label (The) 位于左侧):

在这之后 100% :

Corner Radius 我想要我的 边框 拐角半径

风格:

<Style x:Key="{x:Type ProgressBar}" TargetType="{x:Type ProgressBar}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ProgressBar}">
                    <Grid MinHeight="14" MinWidth="200">
                        <Border Name="PART_Track"
                                CornerRadius="5,0,0,5"
                                Background="{DynamicResource ProgressBarBackgroundColor}"
                                BorderBrush="{DynamicResource ProgressBarBackgroundColor}"
                                BorderThickness="0" />
                        <Border Name="PART_Indicator"
                                CornerRadius="8" 
                                Background="{DynamicResource ProgressBarFillBackgroundColor}"
                                BorderBrush="{DynamicResource ProgressBarFillBackgroundColor}" 
                                BorderThickness="0" 
                                HorizontalAlignment="Left" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

XAML公司

<StackPanel Orientation="Horizontal">
    <ProgressBar Name="progressBar"
                 Height="20"
                 Width="700"
                 Minimum="0"
                 VerticalAlignment="Center"
                 Maximum="100"
                 HorizontalAlignment="Left"
                 Value="{Binding Progress, UpdateSourceTrigger=PropertyChanged}"                                                                                                                                                             
                 Style="{StaticResource {x:Type ProgressBar}}"
                 Margin="0,0,0,0"/>
    <Border Width="40"
            Height="19"
            VerticalAlignment="Center"
            HorizontalAlignment="Left"
            CornerRadius="0,5,5,0"
            Margin="0,0,0,0">
        <Border.Background>
            <SolidColorBrush Color="#FF343D46" Opacity="0.4"/>
        </Border.Background>
    </Border>
</StackPanel>

**UPDATE**

1 回复 | 直到 5 年前

aydjay Farhad Jabiyev 6 年前

本质上,当进度条值为100时,您希望应用一个不同的模板,也就是仅显示进度条时的模板。使用以下XAML:

 <Style x:Key="{x:Type ProgressBar}" TargetType="{x:Type ProgressBar}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ProgressBar}">
                    <Grid MinHeight="14" MinWidth="200">
                        <Border Name="PART_Track"
                                CornerRadius="5,0,0,5"
                                Background="{DynamicResource ProgressBarBackgroundColor}"
                                BorderBrush="{DynamicResource ProgressBarBackgroundColor}"
                                BorderThickness="0" />
                        <Border Name="PART_Indicator"
                                CornerRadius="5"
                                Background="{DynamicResource ProgressBarFillBackgroundColor}"
                                BorderBrush="{DynamicResource ProgressBarFillBackgroundColor}"
                                BorderThickness="0"
                                HorizontalAlignment="Left" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="Value" Value="100">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ProgressBar}">
                            <Grid MinHeight="14" MinWidth="200">
                                <Border Name="PART_Track"
                                        CornerRadius="5,0,0,5"
                                        Background="{DynamicResource ProgressBarBackgroundColor}"
                                        BorderBrush="{DynamicResource ProgressBarBackgroundColor}"
                                        BorderThickness="0" />
                                <Border Name="PART_Indicator"
                                        CornerRadius="5,0,0,5"
                                        Background="{DynamicResource ProgressBarFillBackgroundColor}"
                                        BorderBrush="{DynamicResource ProgressBarFillBackgroundColor}"
                                        BorderThickness="0"
                                        HorizontalAlignment="Left" />
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </Style.Triggers>