Document outline in our MAUI PDF viewer

The document outline sidebar displays an expandable content tree with selectable items, allowing users to navigate to different parts of a document.

The document-outline sidebar can be shown by the user by selecting the document-outline sidebar icon from the sidebar dropdown in the toolbar.

It can also be shown programmatically with the API:

<!--View-->
<pspdfkit:PDFView x:Name="PDFView" SidebarMode="{Binding SelectedSidebarMode}" />

// ViewModel
public SidebarMode? SelectedSidebarMode
{
	get => _selectedSidebarMode;
  set => SetField(ref _selectedSidebarMode, value);
}

public void OpenDocumentOutlineSidebar() {
	SelectedSidebarMode = SidebarMode.DocumentOutline;	
}

If you don’t want users to be able to open the document-outline sidebar, you can hide the corresponding toolbar button by filtering it out from the default toolbar items:

// Find the item to remove.
var sidebarDocumentOutlineToggleButton = 
  PSPDFKitController.MainToolbar.ToolbarItems.First(
    item => item.GetType() == typeof(SidebarDocumentOutlineToggleButton));

// Remove the item.
PSPDFKitController.MainToolbar.ToolbarItems.Remove(
  sidebarDocumentOutlineToggleButton);

The document outline view toolbar button can be styled with CSS using the public CSS class .PSPDFKit-Toolbar-Button-Sidebar-Document-Outline.

The document outline sidebar itself can also be customized with CSS by modifying the corresponding public CSS classes:

• .PSPDFKit-Sidebar-Document-Outline

• .PSPDFKit-Sidebar-Document-Outline-Heading