WPF，ScrollViewer的属性VerticalScrollBarVisibilityHorizontalScrollBarVisibility值的区别

Posted 2021-03-08 fanful

ScrollViewer.HorizontalScrollBarVisibility 属性

获取或设置一个值，该值指示是否显示水平方向的滚动条。

ScrollViewer.VerticalScrollBarVisibility 属性

获取或设置一个值，该值指示是否显示垂直方向的滚动条。

---

VerticalScrollBarVisibility与HorizontalScrollBarVisibility是ScrollBarVisibility枚举类型的值，默认值为Visible。

    //
    // 摘要:
    //     指定的可见性 System.Windows.Controls.Primitives.ScrollBar 的可滚动的内容。
    public enum ScrollBarVisibility
    {
        //
        // 摘要:
        //     一个 System.Windows.Controls.Primitives.ScrollBar 不即使不会出现在视区无法显示的所有内容。 内容的维度设置为相应的维度的
        //     System.Windows.Controls.ScrollViewer 父级。 对于水平 System.Windows.Controls.Primitives.ScrollBar,
        //     ，内容的宽度设置为 System.Windows.Controls.ScrollViewer.ViewportWidth 的 System.Windows.Controls.ScrollViewer。
        //     对于垂直 System.Windows.Controls.Primitives.ScrollBar, ，内容的高度设置为 System.Windows.Controls.ScrollViewer.ViewportHeight
        //     的 System.Windows.Controls.ScrollViewer。
        Disabled = 0,
        //
        // 摘要:
        //     一个 System.Windows.Controls.Primitives.ScrollBar 出现和维度的 System.Windows.Controls.ScrollViewer
        //     视区无法显示的所有内容时应用于内容。 对于水平 System.Windows.Controls.Primitives.ScrollBar, ，内容的宽度设置为
        //     System.Windows.Controls.ScrollViewer.ViewportWidth 的 System.Windows.Controls.ScrollViewer。
        //     对于垂直 System.Windows.Controls.Primitives.ScrollBar, ，内容的高度设置为 System.Windows.Controls.ScrollViewer.ViewportHeight
        //     的 System.Windows.Controls.ScrollViewer。
        Auto = 1,
        //
        // 摘要:
        //     一个 System.Windows.Controls.Primitives.ScrollBar 不即使不会出现在视区无法显示的所有内容。 维度的 System.Windows.Controls.ScrollViewer
        //     不应用于内容。
        Hidden = 2,
        //
        // 摘要:
        //     一个 System.Windows.Controls.Primitives.ScrollBar 始终显示。 维度的 System.Windows.Controls.ScrollViewer
        //     应用于内容。 对于水平 System.Windows.Controls.Primitives.ScrollBar, ，内容的宽度设置为 System.Windows.Controls.ScrollViewer.ViewportWidth
        //     的 System.Windows.Controls.ScrollViewer。 对于垂直 System.Windows.Controls.Primitives.ScrollBar,
        //     ，内容的高度设置为 System.Windows.Controls.ScrollViewer.ViewportHeight 的 System.Windows.Controls.ScrollViewer。
        Visible = 3
    }

通俗一点讲：

1. Disabled，禁用滚动条。表现在无论内容是否超过父容器大小，都不会显示滚动条，并且滚动鼠标滑轮也不会滑动内容。
2. Auto，自动。内容不超出父容器时，不显示滚动条，超出父容器时，显示滚动条。
3. Hidden，隐藏滚动条。与Disabled的区别在于，这里只是隐藏，当滚动鼠标滑轮时，依然可以滚动内容。
4. Visible，始终显示。不论内容是否超过父容器大小，都会显示滚动条。

可通过以下示例查看效果：

<Window x:Class="ScrollViewer.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:ScrollViewer"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">

    <Window.Resources>
        <Style x:Key="BorderStyle" TargetType="{x:Type Border}">
            <Setter Property="Background">
                <Setter.Value>
                    <LinearGradientBrush>
                        <LinearGradientBrush.GradientStops>
                            <GradientStop Color="AliceBlue" Offset="0"/>
                            <GradientStop Color="AntiqueWhite" Offset="0.2"/>
                            <GradientStop Color="Aqua" Offset="0.4"/>
                            <GradientStop Color="Aquamarine" Offset="0.6"/>
                            <GradientStop Color="Azure" Offset="0.8"/>
                            <GradientStop Color="Beige" Offset="1.0"/>
                        </LinearGradientBrush.GradientStops>
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>

        <ScrollViewer VerticalScrollBarVisibility="Auto">
            <Border Height="800" Style="{StaticResource BorderStyle}" ToolTip="Auto"/>
        </ScrollViewer>
        <ScrollViewer Grid.Column="1" VerticalScrollBarVisibility="Auto">
            <Border Height="300" Style="{StaticResource BorderStyle}" ToolTip="Auto"/>
        </ScrollViewer>

        <ScrollViewer Grid.Column="2" VerticalScrollBarVisibility="Disabled">
            <Border Height="800" Style="{StaticResource BorderStyle}" ToolTip="Disabled"/>
        </ScrollViewer>
        <ScrollViewer Grid.Column="3" VerticalScrollBarVisibility="Disabled">
            <Border Height="300" Style="{StaticResource BorderStyle}" ToolTip="Disabled"/>
        </ScrollViewer>

        <ScrollViewer Grid.Column="4" VerticalScrollBarVisibility="Hidden">
            <Border Height="800" Style="{StaticResource BorderStyle}" ToolTip="Hidden"/>
        </ScrollViewer>
        <ScrollViewer Grid.Column="5" VerticalScrollBarVisibility="Hidden">
            <Border Height="300" Style="{StaticResource BorderStyle}" ToolTip="Hidden"/>
        </ScrollViewer>

        <ScrollViewer Grid.Column="6" VerticalScrollBarVisibility="Visible">
            <Border Height="800" Style="{StaticResource BorderStyle}" ToolTip="Visible"/>
        </ScrollViewer>

        <ScrollViewer Grid.Column="7" VerticalScrollBarVisibility="Visible">
            <Border Height="300" Style="{StaticResource BorderStyle}" ToolTip="Visible"/>
        </ScrollViewer>
    </Grid>
</Window>

效果如下：