2010-12-02 29 views
2

我已經使用MSDN中的this page將自定義樣式應用於我的滑塊控件。它可以在運行時完美工作,如下圖所示,但在設計時,整個滑塊控件不可見(隱藏/摺疊??)。我怎樣才能讓滑塊在設計時可見?爲什麼我的自定義滑塊在設計時不可見?

滑塊在運行時: alt text

的XAML顯示我的WPF窗口我的實現自定義滑塊:

<Slider Grid.Column="1" 
     Style="{StaticResource sldGradeability}" 
     Orientation="Vertical" 
     Name="sldGrade" Maximum="90" Minimum="0" 
     SmallChange="1" LargeChange="10" 
     Margin="5,20,10,20"/> 

爲我定製的滑蓋造型的XAML:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 

    <!--<SnippetSlider>--> 
    <Style x:Key="SliderButtonStyle" 
     TargetType="{x:Type RepeatButton}"> 
    <Setter Property="SnapsToDevicePixels" 
      Value="true" /> 
    <Setter Property="OverridesDefaultStyle" 
      Value="true" /> 
    <Setter Property="IsTabStop" 
      Value="false" /> 
    <Setter Property="Focusable" 
      Value="false" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
     <ControlTemplate TargetType="{x:Type RepeatButton}"> 
      <Border Background="Transparent" /> 
     </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
    </Style> 
<!--<SnippetThumb>--> 
    <Style x:Key="SliderThumbStyle" 
     TargetType="{x:Type Thumb}"> 
     <Setter Property="SnapsToDevicePixels" 
       Value="true" /> 
     <Setter Property="OverridesDefaultStyle" 
       Value="true" /> 
     <Setter Property="Height" 
       Value="16" /> 
     <Setter Property="Width" 
       Value="25" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Thumb}"> 
        <Polygon x:Name="polyThumb" 
          Cursor="Hand" 
          StrokeThickness="1" 
          Points="0,8 6,16 24,16 24,0 6,0" 
          Stroke="{StaticResource brsDarkGrayText}" 
          Fill="{StaticResource ButtonNormal}"/> 

        <ControlTemplate.Triggers> 
         <Trigger Property="IsMouseOver" 
           Value="True"> 
          <Setter TargetName="polyThumb" 
            Property="Fill" 
            Value="{StaticResource ButtonOver}" /> 
         </Trigger> 
         <Trigger Property="IsDragging" 
           Value="True"> 
          <Setter TargetName="polyThumb" 
            Property="Fill" 
            Value="{StaticResource ButtonDown}" /> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
    <!--Template when the orientation of the Slider is Vertical.--> 
    <ControlTemplate x:Key="VerticalSlider" 
        TargetType="{x:Type Slider}"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="Auto" /> 
       <ColumnDefinition Width="Auto" /> 
       <ColumnDefinition Width="Auto" /> 
       <ColumnDefinition Width="Auto" /> 
      </Grid.ColumnDefinitions> 
      <Grid Grid.Column="0"> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="1*"/> 
        <RowDefinition Height="1*"/> 
        <RowDefinition Height="1*"/> 
        <RowDefinition Height="1*"/> 
        <RowDefinition Height="1*"/> 
        <RowDefinition Height="1*"/> 
        <RowDefinition Height="1*"/> 
        <RowDefinition Height="1*"/> 
        <RowDefinition Height="1*"/> 
        <RowDefinition Height="1*"/> 
       </Grid.RowDefinitions> 
       <TextBlock Grid.Row="0" Text="90°" Style="{StaticResource SimpleTextRight}"/> 
       <TextBlock Grid.Row="1" Text="80°" Style="{StaticResource SimpleTextRight}"/> 
       <TextBlock Grid.Row="2" Text="70°" Style="{StaticResource SimpleTextRight}"/> 
       <TextBlock Grid.Row="3" Text="60°" Style="{StaticResource SimpleTextRight}"/> 
       <TextBlock Grid.Row="4" Text="50°" Style="{StaticResource SimpleTextRight}"/> 
       <TextBlock Grid.Row="5" Text="40°" Style="{StaticResource SimpleTextRight}"/> 
       <TextBlock Grid.Row="6" Text="30°" Style="{StaticResource SimpleTextRight}"/> 
       <TextBlock Grid.Row="7" Text="20°" Style="{StaticResource SimpleTextRight}"/> 
       <TextBlock Grid.Row="8" Text="10°" Style="{StaticResource SimpleTextRight}"/> 
       <TextBlock Grid.Row="9" Text="0°" Style="{StaticResource SimpleTextRight}"/> 
      </Grid> 
     <TickBar Grid.Column="1" x:Name="TopTick" 
       SnapsToDevicePixels="True" 
       Placement="Left" 
       Width="5" 
       Visibility="Visible" 
       TickFrequency="10" 
       Fill="{StaticResource brsDarkGrayText}"/> 
     <Border x:Name="TrackBackground" 
       Margin="0" 
       CornerRadius="2" 
       Width="5" 
       Grid.Column="2" 
       BorderThickness="0"> 
     <Border.Background> 
      <LinearGradientBrush EndPoint="1,0" 
           StartPoint="0,0"> 
         <GradientStop Color="{StaticResource LightGrayGradient}" 
          Offset="0" /> 
         <GradientStop Color="{StaticResource MediumGrayGradient}" 
          Offset="1" /> 
      </LinearGradientBrush> 
     </Border.Background> 
     </Border> 
     <Track Grid.Column="2" 
      x: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 x:Name="BottomTick" 
       SnapsToDevicePixels="True" 
       Grid.Column="3" 
       Fill="{StaticResource brsDarkGrayText}" 
       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> 
    <!--Slider Control--> 
    <Style x:Key="sldGradeability" 
      TargetType="{x:Type Slider}"> 
     <Setter Property="SnapsToDevicePixels" 
       Value="true" /> 
     <Setter Property="OverridesDefaultStyle" 
       Value="true" /> 
     <Setter Property="Visibility" 
       Value="Visible"/> 
     <Style.Triggers> 
      <Trigger Property="Orientation" 
        Value="Vertical"> 
       <Setter Property="MinWidth" 
         Value="21" /> 
       <Setter Property="MinHeight" 
         Value="104" /> 
       <Setter Property="Template" 
         Value="{StaticResource VerticalSlider}" /> 
      </Trigger> 
     </Style.Triggers> 
    </Style> 
    <!--</SnippetSlider>--> 
</ResourceDictionary> 
+0

在定義中添加高度/寬度... – 2010-12-02 16:47:24

+0

@Aaron,將高度/寬度屬性添加到樣式定義並沒有幫助。在實現中也沒有添加高度/寬度屬性。 – Stewbob 2010-12-02 16:54:24

回答

4

它在Blend 4中顯示得很好,所以我認爲這是VS2010設計器中的一個錯誤。無論如何,問題似乎是方向是垂直觸發。

<Style x:Key="sldGradeability" TargetType="{x:Type Slider}"> 
    <!-- ... --> 
    <Style.Triggers> 
     <!-- ... --> 
     <Trigger Property="Orientation" Value="Vertical"> 
      <Setter Property="Template" Value="{StaticResource VerticalSlider}" /> 
     </Trigger> 
    </Style.Triggers> 
</Style> 

動模板二傳手了二傳手之間以及滑塊顯示了在設計

<Style x:Key="sldGradeability" TargetType="{x:Type Slider}"> 
    <Setter Property="SnapsToDevicePixels" Value="true" /> 
    <Setter Property="OverridesDefaultStyle" Value="true" /> 
    <Setter Property="Visibility" Value="Visible"/> 
    <Setter Property="Template" Value="{StaticResource VerticalSlider}"/> 
    <Style.Triggers> 
     <Trigger Property="Orientation" Value="Vertical"> 
      <Setter Property="MinWidth" Value="21" /> 
      <Setter Property="MinHeight" Value="104" /> 
     </Trigger> 
    </Style.Triggers> 
</Style> 

移動制定者可能不是你想要在這裏做什麼,但也許你可以利用它在某種程度上