2017-12-11 23 views
1

안녕하세요, WPF 애플리케이션을 처음 사용했습니다. Indeterminate progress bar design에 문제가 있습니다. 온라인을 통해 진행률 막대 관련 주제를 많이 연구했지만 진행률 막대 스타일링 개념에 대해 아직 명확하지 않습니다.WPF 미정의 둥근 모서리, 표시기 중첩 부모

코너 반경의 값을 변경하려고 시도했지만 코너 반경 (PART_Indicator, PART_Track, 표시기, 애니메이션)에 영향을 미칠 수있는 모든 가능한 요소의 클립에 대해 true로 설정했지만 여전히 이와 관련한 행운은 없습니다.

자식 테두리는 항상 부모와 겹칩니다. 나는 아래와 같이 진행 표시 줄에 달성하고자하는 어떤 Current Display

아래로 표시.

<Window x:Class="MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="MainWindow" Height="350" Width="150"> 
    <Grid> 
     <StackPanel Orientation="Vertical"> 
      <ProgressBar Height="36" Name="progBar" VerticalAlignment="Top" IsIndeterminate="True" Foreground="Orange" BorderBrush="Gray" BorderThickness="1" > 
       <ProgressBar.Style> 
        <Style TargetType="{x:Type ProgressBar}"> 
         <Setter Property="Template"> 
          <Setter.Value> 
           <ControlTemplate TargetType="ProgressBar" > 
            <Grid Name="TemplateRoot" SnapsToDevicePixels="True"> 
             <Rectangle RadiusX="2" RadiusY="2" Fill="Transparent" /> 
             <Border CornerRadius="10" Margin="1,1,1,1"> 
              <Border.Background> 
               <SolidColorBrush Color="Transparent"/> 
              </Border.Background> 
             </Border> 
             <Border BorderThickness="1" BorderBrush="gray" Margin="1,1,1,1" CornerRadius="10"> 
              <Border.Background> 
               <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
                <GradientStop Color="White" Offset="0.0" /> 
                <GradientStop Color="WhiteSmoke" Offset="1" /> 
               </LinearGradientBrush> 
              </Border.Background> 
             </Border> 
             <Rectangle Name="PART_Track" Margin="1,1,1,1" ClipToBounds="True"/> 
             <Decorator Name="PART_Indicator" Margin="3,2,3,2" HorizontalAlignment="Left" ClipToBounds="True"> 
              <Grid Name="Foreground" ClipToBounds="True"> 
               <Rectangle RadiusX="10" RadiusY="10" Name="Indicator" ClipToBounds="True"/> 
               <Grid Name="Animation" ClipToBounds="True"> 
                <Border Name="PART_GlowRect" Width="50" Margin="1" HorizontalAlignment="Left" Background="Orange" CornerRadius="10" /> 
               </Grid> 
               <Grid Name="Overlay"> 
               </Grid> 
              </Grid> 
             </Decorator> 
             <Border BorderThickness="0" CornerRadius="0" BorderBrush="Transparent" /> 
            </Grid> 
           </ControlTemplate> 
          </Setter.Value> 
         </Setter> 
        </Style> 
       </ProgressBar.Style> 
      </ProgressBar> 
     </StackPanel> 

    </Grid> 
</Window> 

내가 코드에 잘못된 무슨 짓을했다 : 아래

Expected Display

내 코드? 이 문제와 관련하여 안내를 받으십시오.

감사합니다.

답변

0

체크 아웃 클립 속성 : 당신은 클립 속성 내부에 형상을 넣을 수 있습니다

<Image 
    Source="sampleImages\Waterlilies.jpg" 
    Width="200" Height="150" HorizontalAlignment="Left"> 
    <Image.Clip> 
    <EllipseGeometry 
     RadiusX="100" 
     RadiusY="75" 
     Center="100,75"/> 
    </Image.Clip> 
</Image> 

enter image description here

. 귀하의 경우에는 및 RadiusY 속성이 설정된 RectangleGeometry이 될 수 있습니다.

상세 정보 : Mikolaytis의 대답을, 나는 현재 RectangleGeometry를 사용하고 https://msdn.microsoft.com/ru-ru/library/system.windows.uielement.clip(v=vs.110).aspx

0

감사합니다.

Rect RectangleGeometry에서 Rect가 너비를 부모 너비로부터 상속받지 않는다고 생각합니다. 다른 해상도의 rect를 다시 계산하려면 코드를 사용해야합니다.

나는 동일한 문제에 직면했을 때 아래 코드를 공유하고 있습니다.

<Window x:Class="MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="MainWindow" Height="350" Width="400"> 
    <ProgressBar Height="36" Width="358" Name="progBar" VerticalAlignment="Top" IsIndeterminate="True" Foreground="Orange" BorderBrush="Gray" BorderThickness="1" > 
     <ProgressBar.Style> 
      <Style TargetType="{x:Type ProgressBar}"> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="ProgressBar" > 
          <Grid Name="TemplateRoot" SnapsToDevicePixels="True"> 
           <Rectangle RadiusX="2" RadiusY="2" Fill="Transparent" /> 
           <Border CornerRadius="10" Margin="1,1,1,1"> 
            <Border.Background> 
             <SolidColorBrush Color="Transparent"/> 
            </Border.Background> 
           </Border> 
           <Border BorderThickness="1" BorderBrush="Blue" Margin="1,1,1,1" CornerRadius="10"> 
            <Border.Background> 
             <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
              <GradientStop Color="Red" Offset="0.0" /> 
              <GradientStop Color="Red" Offset="1" /> 
             </LinearGradientBrush> 
            </Border.Background> 
           </Border> 
           <Rectangle Name="PART_Track" Margin="0" ClipToBounds="True" /> 
           <Border Background="black" Name="PART_Indicator" Margin="0" HorizontalAlignment="Left" ClipToBounds="True"> 
            <Border.Clip> 
             <RectangleGeometry Rect="2,2,354,32" RadiusX="9" RadiusY="9.5" /> 
            </Border.Clip> 
            <Grid Name="Foreground"> 
             <Rectangle RadiusX="10" RadiusY="10" Name="Indicator" ClipToBounds="True"/> 
             <Grid Name="Animation" ClipToBounds="True"> 
              <Border Name="PART_GlowRect" Width="50" Margin="1" HorizontalAlignment="Left" Background="Orange" CornerRadius="10" /> 
             </Grid> 
             <Grid Name="Overlay"> 
             </Grid> 
            </Grid> 
           </Border> 
           <Border BorderThickness="0" CornerRadius="0" BorderBrush="Transparent" /> 
          </Grid> 
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
      </Style> 
     </ProgressBar.Style> 
    </ProgressBar> 
</Window>