UWP中如何让ListView滚动条始终显示并自定义样式

一、让滚动条始终显示 #

你设置ScrollViewer.VerticalScrollBarVisibility="Visible"后滚动条仍自动隐藏，是因为WPF默认的ScrollBar样式带有鼠标悬停才显示的触发器（尤其是Windows 10及以上的系统主题）。要让它始终可见，有两种可行方法：

方法1：局部覆盖ScrollBar样式 #

在ListView的资源中定义ScrollBar样式，移除控制可见性的触发器，强制滚动条始终显示：

<ListView ScrollViewer.VerticalScrollBarVisibility="Visible">
    <ListView.Resources>
        <Style TargetType="{x:Type ScrollBar}" BasedOn="{StaticResource {x:Type ScrollBar}}">
            <Setter Property="Visibility" Value="Visible"/>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="False">
                    <Setter Property="Visibility" Value="Visible"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </ListView.Resources>
    <!-- 你的列表项内容 -->
</ListView>

方法2：修改ListView的ControlTemplate #

如果方法1不生效，直接修改ListView的模板，确保内部ScrollViewer的滚动条强制可见：

<ListView>
    <ListView.Template>
        <ControlTemplate TargetType="{x:Type ListView}">
            <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="1">
                <ScrollViewer x:Name="ScrollViewer" Focusable="False" Padding="{TemplateBinding Padding}" 
                              VerticalScrollBarVisibility="Visible">
                    <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                </ScrollViewer>
            </Border>
        </ControlTemplate>
    </ListView.Template>
    <!-- 列表项内容 -->
</ListView>

二、自定义滚动条样式 #

当然可以自定义滚动条的外观，比如修改宽度、滑块颜色、轨道背景等。以下是一个简单的自定义示例：

<ListView ScrollViewer.VerticalScrollBarVisibility="Visible">
    <ListView.Resources>
        <Style x:Key="CustomVerticalScrollBar" TargetType="{x:Type ScrollBar}">
            <Setter Property="Width" Value="18"/>
            <Setter Property="Background" Value="#F0F0F0"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ScrollBar}">
                        <Grid Background="{TemplateBinding Background}">
                            <!-- 滚动轨道 -->
                            <Rectangle x:Name="Track" Fill="#E0E0E0" Margin="4,0"/>
                            <!-- 滚动滑块 -->
                            <Thumb x:Name="Thumb" Background="#808080" Margin="4,2">
                                <Thumb.Style>
                                    <Style TargetType="{x:Type Thumb}">
                                        <Setter Property="Template">
                                            <Setter.Value>
                                                <ControlTemplate TargetType="{x:Type Thumb}">
                                                    <Rectangle RadiusX="4" RadiusY="4" Fill="{TemplateBinding Background}"/>
                                                </ControlTemplate>
                                            </Setter.Value>
                                        </Setter>
                                    </Style>
                                </Thumb.Style>
                            </Thumb>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <!-- 应用自定义样式到垂直滚动条 -->
        <Style TargetType="{x:Type ScrollBar}" BasedOn="{StaticResource CustomVerticalScrollBar}" />
    </ListView.Resources>
    <!-- 列表项内容 -->
</ListView>

你可以根据需求调整颜色、尺寸、形状等属性，完全定制滚动条的外观。

内容的提问来源于stack exchange，提问作者ricky rocky