How to scroll PDF pages in WPF PDF Viewer using keyboard?

3 mins read

In the WPF PDF Viewer, there is no direct support for scrolling through the pages of the document using arrow keys or other keys. However, it is possible to achieve this functionality by utilizing the ScrollTo API within the key down event of the WPF PDF Viewer.

We have accomplished this by setting default scroll values of 200 for vertical scrolling and 100 for horizontal scrolling. To scroll through the pages when pressing keyboard keys such as H, J, K, L keys, we adjust the VerticalOffset and HorizontalOffset using the ScrollTo method and the defined scroll values within this KeyDown event.

Steps to scroll PDF pages in WPF PDF Viewer using keyboard in C#

The below steps illustrate how to scroll PDF pages in WPF PDF Viewer using keyboard.

Step 1: Get the keyboard key action from the KeyDown event

Wire the KeyDown event in the constructor class of the main window.

//Wire the KeyDown event.
pdfViewer.KeyDown += PdfViewer_KeyDown;

To prevent navigation conflicts when entering text into the search text box or performing toolbar actions, we’ve created a boolean variable named keyFromTextBoxes and initialized it to false. This variable purpose is explained further in step 2 for better understanding.
Get the keyboard key indices from the KeyEventArgs and store it as a keyboard keys. This below code enables custom keyboard navigation for a PDF viewer. It responds to key presses (J, K, L, H) as alternatives to arrow keys for scrolling. It adjusts scrolling based on zoom level and prevents conflicts with text input fields.

//Handle the KeyDown Event
private void PdfViewer_KeyDown(object sender, KeyEventArgs e)
{
 if (! keyFromTextBoxes)
 {
   double zoomFactor = (double)pdfViewer.ZoomPercentage / 100;
   double scroll = 200;
   double hScroll = 100;
   double offset = pdfViewer.VerticalOffset / zoomFactor;
   double hOffset = pdfViewer.HorizontalOffset / zoomFactor;
   if (e.Key == Key.J) // Instead of down arrow
   {
     pdfViewer.ScrollTo(offset + scroll);
   }
   else if (e.Key == Key.K) // Instead of up arrow
   {
     pdfViewer.ScrollTo(offset - scroll);
   }
   else if (e.Key == Key.L) // Instead of right arrow
   {
     pdfViewer.ScrollTo(hOffset + hScroll, offset);
   }
   else if (e.Key == Key.H) // Instead of left arrow
   {
     pdfViewer.ScrollTo(hOffset - hScroll, offset);
   }
  }
}

Step 2: Restrict navigation when entering text into the search text box and during any toolbar actions.

Obtain DocumentToolbar instance: The method retrieves an instance of the DocumentToolbar control named “PART_Toolbar” from the loaded PDF viewer control (pdfViewer). This allows for direct manipulation and access to the toolbar functionalities.
Attach event handlers: Various event handlers are attached to elements within the toolbar and text search bar. This ensures that specific actions are triggered when events such as key presses or button clicks occur. For instance, the PreviewKeyDown event of the text search bar is linked to TextSearch_Toolbar_PreviewKeyDown method, and the Click event of the close button within the text search bar is linked to CloseButton_Click method.
Handle focus events: Focus-related events for certain UI elements are managed. When the current page text box (currentPageTextBox) gains or loses focus, respective methods (CurrentPageTextBox_GotFocus and CurrentPageTextBox_LostFocus) are invoked. Similarly, focus events for the combo box (comboBox) are handled by ComboBox_GotFocus and ComboBox_LostFocus methods.

private void Window_Loaded(object sender, RoutedEventArgs e)
{
 DocumentToolbar toolbar = pdfViewer.Template.FindName("PART_Toolbar", pdfViewer) as DocumentToolbar;
 TextSearchBar textSearch_Toolbar = pdfViewer.Template.FindName("PART_TextSearchBar", pdfViewer) as TextSearchBar;
 textSearch_Toolbar.PreviewKeyDown += TextSearch_Toolbar_PreviewKeyDown;
 Button closeButton = (Button)textSearch_Toolbar.Template.FindName("PART_ButtonClose", textSearch_Toolbar);
 closeButton.Click += CloseButton_Click;
 TextBox currentPageTextBox = (TextBox)toolbar.Template.FindName("PART_TextCurrentPageIndex", toolbar);
 currentPageTextBox.GotFocus += CurrentPageTextBox_GotFocus;
 currentPageTextBox.LostFocus += CurrentPageTextBox_LostFocus;
 ComboBox comboBox = (ComboBox)toolbar.Template.FindName("PART_ComboBoxCurrentZoomLevel", toolbar);
 comboBox.GotFocus += ComboBox_GotFocus;
 comboBox.LostFocus += ComboBox_LostFocus;
}

Focus management: Methods set keyFromTextBoxes true when combo box or current page text box gains focus, false when they lose focus.
Close button click: Method sets keyFromTextBoxes false when close button in text search toolbar is clicked.
Text search toolbar key events: Method sets keyFromTextBoxes true when key pressed in text search toolbar, false if Escape key is pressed.

private void ComboBox_LostFocus(object sender, RoutedEventArgs e)
{
 keyFromTextBoxes = false;
}
private void ComboBox_GotFocus(object sender, RoutedEventArgs e)
{
 keyFromTextBoxes = true;
}
private void CurrentPageTextBox_LostFocus(object sender, RoutedEventArgs e)
{
 keyFromTextBoxes = false;
}
private void CurrentPageTextBox_GotFocus(object sender, RoutedEventArgs e)
{
 keyFromTextBoxes = true;
}
private void CloseButton_Click(object sender, RoutedEventArgs e)
{
 keyFromTextBoxes = false;
}
private void TextSearch_Toolbar_PreviewKeyDown(object sender, KeyEventArgs e)
{
 keyFromTextBoxes = true;
 if (e.Key == Key.Escape)
 {
   keyFromTextBoxes = false;
 }
}

A complete working sample to scroll PDF pages in WPF PDF Viewer using keyboard in C# can be downloaded from GitHub.

How to scroll PDF pages in WPF PDF Viewer using keyboard?

Steps to scroll PDF pages in WPF PDF Viewer using keyboard in C#

See Also:

Access denied