2013-03-13 2 views
1

현재 해당 티커의 레이블뿐만 아니라 티커가있는 사용자 정의 세로 슬라이더를 해당 값으로 가져 오려고합니다. 다음과 같이 이미 온라인 내가 지금 내 솔루션에 사용하고가는거야 수평 슬라이더에 대한 몇 가지 흥미로운 코드를 발견티커의 레이블이있는 세로 슬라이더

XAML :

public class MyTickBar : TickBar 
{ 
    protected override void OnRender(DrawingContext dc) 
    { 
     Size size = new Size(base.ActualWidth, base.ActualHeight); 
     int tickCount = (int)((this.Maximum - this.Minimum)/this.TickFrequency) + 1; 
     if ((this.Maximum - this.Minimum) % this.TickFrequency == 0) 
      tickCount -= 1; 
     Double tickFrequencySize; 
     // Calculate tick's setting 
     tickFrequencySize = (size.Width * this.TickFrequency/(this.Maximum - this.Minimum)); 
     string text = ""; 
     FormattedText formattedText = null; 
     double num = this.Maximum - this.Minimum; 
     int i = 0; 
     // Draw each tick text 
     for (i = 0; i <= tickCount; i++) 
     { 
      text = Convert.ToString(Convert.ToInt32(this.Minimum + this.TickFrequency * i), 10); 
      formattedText = new FormattedText(text, CultureInfo.GetCultureInfo("en-us"), FlowDirection.LeftToRight, new Typeface("Verdana"), 16, Brushes.Black); 
      dc.DrawText(formattedText, new Point((tickFrequencySize * i), 30)); 
     } 
    } 
} 
: MyTickBar과 같이 정의 된 클래스 인으로

<ControlTemplate x:Key="HorizontalSlider" TargetType="{x:Type Slider}"> 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="Auto"/> 
       <RowDefinition Height="Auto" MinHeight="{TemplateBinding Slider.MinHeight}"/> 
       <RowDefinition Height="Auto"/> 
      </Grid.RowDefinitions> 
      <local:MyTickBar Margin="5,0,10,0" x:Name="TopTick" SnapsToDevicePixels="True" Placement="Top" Fill="{StaticResource GlyphDarkBrush}" Height="5" /> 
      <Border Name="TrackBackground" Margin="0" CornerRadius="2" Height="4" Grid.Row="1" Background="{StaticResource GlyphLightBrush}" BorderBrush="{StaticResource ButtonNormal}" BorderThickness="1" /> 
      <Track Grid.Row="1" Name="PART_Track"> 
       <Track.DecreaseRepeatButton> 
        <RepeatButton Style="{StaticResource SliderButtonStyle}" Command="Slider.DecreaseLarge" /> 
       </Track.DecreaseRepeatButton> 
       <Track.Thumb> 
        <Thumb Style="{StaticResource SliderThumbStyle}" /> 
       </Track.Thumb> 
       <Track.IncreaseRepeatButton> 
        <RepeatButton Style="{StaticResource SliderButtonStyle}" Command="Slider.IncreaseLarge" /> 
       </Track.IncreaseRepeatButton> 
      </Track> 
      <TickBar Name="BottomTick" SnapsToDevicePixels="True" Grid.Row="2" Fill="Black" Placement="Bottom" Height="10" Visibility="Collapsed" /> 
     </Grid> 
     <ControlTemplate.Triggers> 
      <Trigger Property="TickPlacement" Value="TopLeft"> 
       <Setter TargetName="TopTick" Property="Visibility" Value="Visible"/> 
      </Trigger> 
      <Trigger Property="TickPlacement" Value="BottomRight"> 
       <Setter TargetName="BottomTick" Property="Visibility" Value="Visible"/> 
      </Trigger> 
      <Trigger Property="TickPlacement" Value="Both"> 
       <Setter TargetName="TopTick" Property="Visibility" Value="Visible"/> 
       <Setter TargetName="BottomTick" Property="Visibility" Value="Visible"/> 
      </Trigger> 
     </ControlTemplate.Triggers> 
    </ControlTemplate> 

가로 슬라이더로도 제대로 작동하지만 수직으로 가장하여 두 가지 솔루션을 시도했지만 성공하지 못했습니다. 첫째, 세로 슬라이더에 대해 비슷한 XAML을 만드는 것이었지만 WPF를 처음 접했을 때 의도 한 솔루션을 얻을 수 없었습니다 (기본적으로 열과 높이 속성을 기본적으로 열과 함께 변경했지만 가능성은 조금 있습니다). 더 복잡한). http://s22.postimage.org/sophl10wh/Incorrect.jpg

나는 DrawingContext에 회전을 적용하려고 다음 이미지가 보여처럼 그리고 내 두 번째 시도는 잘못된 위치에 라벨 슬라이더를 받고, 거짓된 슬라이더에

<Slider.LayoutTransform> 
      <RotateTransform Angle="270"/> 
     </Slider.LayoutTransform> 

를 사용했다 MyTicker 중 하나이지만 값이있는 레이블 대신 전체 시세 표시기가 회전합니다. 그래서, 제 질문은 어떻게 척 솔루션을 얻을 수 있습니까? 사용자 지정 세로 슬라이더에 필요한 새 XAML을 변경하거나 두 번째 솔루션에서 레이블을 회전하기 만하면됩니다.

+0

방금 ​​슬라이더 컨트롤을 위해 msdn에서 Slider ControlTemplate 예제를 얻을 수 있으므로 (실제로는 바보 같음) 깨달았습니다. – Santux

답변

5

이제 내 자신의 질문에 대답 할 수 있으며 미래에 어떤 사람을 도울 수 있습니다. 내 질문에 대한 언급에서 말했듯이, 나중에 나는 MSDN에 가서 수평 슬라이더를 적용하려고 시도하는 대신 적절한 수직 슬라이더 템플릿을 얻을 수 있다는 것을 깨달았다.

<ControlTemplate x:Key="VerticalSlider" TargetType="{x:Type Slider}"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="Auto"/> 
       <ColumnDefinition Width="Auto" MinWidth="{TemplateBinding Slider.MinWidth}"/> 
       <ColumnDefinition Width="Auto"/> 
      </Grid.ColumnDefinitions> 
      <local:MyTickBarVertical Margin="0,0,0,10" x:Name="TopTick" SnapsToDevicePixels="True" Placement="Left" Fill="{StaticResource GlyphDarkBrush}" Width="4" /> 
      <Track Grid.Column="1" Name="PART_Track"> 
       <Track.DecreaseRepeatButton> 
        <RepeatButton 
     Style="{StaticResource SliderButtonStyle}" 
     Command="Slider.DecreaseLarge" /> 
       </Track.DecreaseRepeatButton> 
       <Track.Thumb> 
        <Thumb Style="{StaticResource SliderThumbStyle}" /> 
       </Track.Thumb> 
       <Track.IncreaseRepeatButton> 
        <RepeatButton 
     Style="{StaticResource SliderButtonStyle}" 
     Command="Slider.IncreaseLarge" /> 
       </Track.IncreaseRepeatButton> 
      </Track> 
      <TickBar 
    Name="BottomTick" 
    SnapsToDevicePixels="True" 
    Grid.Column="2" 
    Fill="Black" 
    Placement="Right" 
    Width="4" 
    Visibility="Collapsed" /> 
     </Grid> 
     <ControlTemplate.Triggers> 
      <Trigger Property="TickPlacement" Value="TopLeft"> 
       <Setter TargetName="TopTick" Property="Visibility" Value="Visible"/> 
      </Trigger> 
      <Trigger Property="TickPlacement" Value="BottomRight"> 
       <Setter TargetName="BottomTick" Property="Visibility" Value="Visible"/> 
      </Trigger> 
      <Trigger Property="TickPlacement" Value="Both"> 
       <Setter TargetName="TopTick" Property="Visibility" Value="Visible"/> 
       <Setter TargetName="BottomTick" Property="Visibility" Value="Visible"/> 
      </Trigger> 
     </ControlTemplate.Triggers> 
    </ControlTemplate> 

내가 적절한 수직 슬라이더를 사용하고 지금부터 내가 할 일, 내 수업에 몇 가지 작은 변화를 확인했다 :

나의 현재 XAML은 지금

public class MyTickBarVertical : TickBar 
{ 
    protected override void OnRender(DrawingContext dc) 
    { 
     Size size = new Size(base.ActualWidth, base.ActualHeight); 
     int tickCount = (int)((this.Maximum - this.Minimum)/this.TickFrequency) + 1; 
     if ((this.Maximum - this.Minimum) % this.TickFrequency == 0) 
      tickCount -= 1; 
     Double tickFrequencySize; 
     // Calculate tick's setting 
     //width to height 
     tickFrequencySize = (size.Height * this.TickFrequency/(this.Maximum - this.Minimum)); 
     string text = ""; 
     FormattedText formattedText = null; 
     double num = this.Maximum - this.Minimum; 
     int i = 0; 
     // Draw each tick text 
     for (i = 0; i <= tickCount; i++) 
     { 
      text = Convert.ToString(Convert.ToInt32(this.Maximum) - Convert.ToInt32(this.Minimum + this.TickFrequency * i), 10); 
      formattedText = new FormattedText(text, CultureInfo.GetCultureInfo("en-us"), FlowDirection.RightToLeft, new Typeface("Verdana"), 16, Brushes.Black); 
      dc.DrawText(formattedText, new Point(0, (tickFrequencySize * i))); 
     } 
    } 
} 

이제 점점 다음 : http://s4.postimage.org/d0q6dpxvx/Correct.jpg

건배!

+0

구현하려고합니다. 비슷한 것. 슬라이더 자체에 사용한 XAML은 무엇입니까? –

+0

http://msdn.microsoft.com/en-us/library/ms753256(v=vs.85).aspx에있는 슬라이더 컨트롤 템플릿을 사용해야하고 틱바 중 하나를 MyTickBarVertical 클래스 : TickBar는 대답에있는 것과 같습니다. – Santux

+0

그리고 나서 무엇이 :''그리고 또 뭐야? –

관련 문제