【问题标题】:WPF ScrollBar opacity based on Thumb visibility基于 Thumb 可见性的 WPF ScrollBar 不透明度
【发布时间】:2012-06-23 14:20:41
【问题描述】:

当不再需要拇指时,我无法弄清楚如何更改 ScrollBar Opactity。

换句话说:我想拥有像 Auto 一样的 ScrollViewer 的属性 VerticalScrollBarVisibility,但 ScrollViewer 的内容应该保持其大小。我必须考虑到 ScrollBar 的样式必须应用于具有内部 ScrollViewers 的 3rd 方控件。

这是我的代码。我试图对 Thumb 的 IsVisible 触发器做出反应,但没有成功。

<Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}">
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type Thumb}">
            <Border x:Name="ScrollBarThumbBorder" CornerRadius="4" />
        </ControlTemplate>
    </Setter.Value>
</Setter>
<!--<Style.Triggers>
    <Trigger Property="IsVisible" Value="False">
        <Setter Property="Opacity" Value="0.3" />
    </Trigger>
</Style.Triggers>-->

<ControlTemplate x:Key="VerticalScrollBar" TargetType="{x:Type ScrollBar}">
<Border CornerRadius="4">
    <Track
        Name="PART_Track"
        IsDirectionReversed="true">
        <Track.DecreaseRepeatButton>
            <RepeatButton 
                Style="{StaticResource ScrollBarPageButton}"
                Command="ScrollBar.PageUpCommand" />
        </Track.DecreaseRepeatButton>
        <Track.Thumb>
            <Thumb Style="{StaticResource ScrollBarThumb}" />
        </Track.Thumb>
        <Track.IncreaseRepeatButton>
            <RepeatButton 
                Style="{StaticResource ScrollBarPageButton}"
                Command="ScrollBar.PageDownCommand" />
                    </Track.IncreaseRepeatButton>
    </Track>
</Border>

<Style x:Key="{x:Type ScrollBar}" TargetType="{x:Type ScrollBar}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Style.Triggers>
    <Trigger Property="Orientation" Value="Vertical">
        <Setter Property="Width" Value="10"/>
        <Setter Property="Height" Value="Auto" />
        <Setter Property="Template" Value="{StaticResource VerticalScrollBar}" />
    </Trigger>
</Style.Triggers>

【问题讨论】:

    标签: wpf styles slider scrollbar visibility


    【解决方案1】:

    我做到了:)

    诀窍是在 ControlTemplate 触发器中使用 SourceName。

    现在 ScrollBar 的 ControlTemplate 看起来像这样:

        <ControlTemplate x:Key="VerticalScrollBar" TargetType="{x:Type ScrollBar}">
        <Border
            Background="{StaticResource ScrollBarBackgroundBrush}"
            CornerRadius="4">
            <Track
                Name="PART_Track"
                IsDirectionReversed="true">
                <Track.DecreaseRepeatButton>
                    <RepeatButton 
                        Style="{StaticResource ScrollBarPageButton}"
                        Command="ScrollBar.PageUpCommand" />
                </Track.DecreaseRepeatButton>
                <Track.Thumb>
                    <Thumb Name="Thumb" Style="{StaticResource ScrollBarThumb}" />
                </Track.Thumb>
                <Track.IncreaseRepeatButton>
                    <RepeatButton 
                        Style="{StaticResource ScrollBarPageButton}"
                        Command="ScrollBar.PageDownCommand" />
                            </Track.IncreaseRepeatButton>
            </Track>
        </Border>
        <ControlTemplate.Triggers>
            <Trigger SourceName="Thumb" Property="IsVisible" Value="False">
                <Setter Property="Opacity" Value="0" />
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    

    【讨论】:

      猜你喜欢
      • 2012-09-15
      • 2012-08-31
      • 2020-06-23
      • 1970-01-01
      • 1970-01-01
      • 2012-07-12
      • 2011-11-24
      • 2020-06-10
      • 2021-05-07
      相关资源
      最近更新 更多