Customizing the Toolbar in Our Flutter Viewer

The main toolbar in PSPDFKit is designed to be flexible and configurable. This guide details how to customize the main toolbar.

PSPDFKit provides several preconfigured buttons that can be used for actions such as annotation editing, sharing a document, searching, opening the bookmarks view, etc. These buttons can be configured to be shown or hidden on the main toolbar, according to your use case. The way to customize these buttons is slightly different on Android and iOS.

Here’s an example showing how to customize the main toolbar:

// First copy the document from assets to the temporary directory.
await Pspdfkit.present(document.path, {

    // Common options:
    enableAnnotationEditing: true, // Annotation item on the main toolbar.
    toolbarTitle: 'Custom Title',
    iOSAllowToolbarTitleChange: false,

    // iOS-specific options:
    iOSRightBarButtonItems: [ // List of buttons to show on the right side of the main toolbar.
        'thumbnailsButtonItem',
        'activityButtonItem',
        'annotationButtonItem',
        'searchButtonItem'
    ],
    iOSLeftBarButtonItems: [ // List of buttons to show on the left side of the main toolbar. (Only one item supported.)
        'settingsButtonItem'
    ],

    // Android-specific options:
    androidShowSearchAction: true, // Search action on the main toolbar.
    androidShowThumbnailGridAction: true, // Document editor action on the main toolbar.
    androidShowShareAction: true, // Share action on the main toolbar.
    androidShowPrintAction: true, // Print item on the main toolbar and inside the sharing sheet.
    androidEnableDocumentEditor: true, // Enable document editing in thumbnail view.
});

This is how the toolbar looks after customization:

Android
iOS