Customize the Scrollbar in UWP PDF Viewer

13 Jul 20261 minute to read

This section explains how to customize the scrollbar appearance and width in the SfPdfViewer control.

Customize the color of the scrollbar thumb

The PDF Viewer uses the ScrollViewer control to scroll the pages of a PDF. The color of the vertical and horizontal scrollbar thumbs can be customized using the following code.

<sf:SfPdfViewerControl x:Name = “pdfViewer”>
<sf:SfPdfViewerControl.Resources>
        <SolidColorBrush x:Key="ScrollBarThumbFill" Color="Gold"/>
        <SolidColorBrush x:Key="ScrollBarThumbFillPointerOver" Color="Orange"/>
        <SolidColorBrush x:Key="ScrollBarThumbFillPressed" Color="Red"/>
        <SolidColorBrush x:Key="ScrollBarThumbFillDisabled" Color="Pink"/>
</sf:SfPdfViewerControl.Resources>
</sf:SfPdfViewerControl>

Customize the width of the vertical scrollbar

The width of the vertical scrollbar of the ScrollViewer can be modified by using the VerticalScrollBarWidth property. The default value of this property matches the default width of the vertical scrollbar of the ScrollViewer control.

// Sets the width of the vertical scrollbar in the PDF Viewer.
pdfViewerControl.VerticalScrollBarWidth = 100;
// Gets the width of the vertical scrollbar in the PDF Viewer.
double verticalScrollBarWidth = pdfViewerControl.VerticalScrollBarWidth;

See Also