Question

当您不在ScrollViewer上时，我将滚动条设置为隐藏，仅在您将鼠标悬停在

上时显示

这是我正在使用的代码 - 它很棒

<ControlTemplate.Triggers>
    <Trigger Property="IsMouseOver" Value="False">
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden"/>
    </Trigger>

    <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Visible"/>
    </Trigger>
</ControlTemplate.Triggers>

我的问题是，如何让滚动条淡入淡出而不是立即显示/隐藏？

Answer 1

使用视觉状态（参见http://msdn.microsoft.com/en-us/library/system.windows.visualstatemanager.aspx）。这允许您直接从xaml动画

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="HideScrollbar">
        <VisualState x:Name="Invisible">                                    
            <Storyboard>
                <DoubleAnimation Storyboard.TargetName="scrollBar" Storyboard.TargetProperty="Opacity"                                              
                    To="0"
                    Duration="0:0:0.25"/>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="Visible">
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="scrollBar" Storyboard.TargetProperty="Opacity" 
                        To="1"
                        Duration="0:0:0.25"/>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
   </VisualStateManager.VisualStateGroups>

将此与xaml.cs文件中的状态更改相结合

public void OnMouseOver(...)
{
    VisualStateManager.GoToState(this, "Visible", true);
}

public void OnMouseLeave(...)
{
    VisualStateManager.GoToState(this, "Invisible", true);
}

使滚动条淡入/淡出

1 个答案: