Transparent Bar Backgrounds

By default, toolbars on iOS have transparent backgrounds unless a scroll view is scrolled underneath the bar. This applies to navigation bars, bottom toolbars, and tab bars.

However, to provide a more immersive viewing experience, PDFView and PDFViewController show content underneath bars and allow the user to tap to hide the navigation bar. Therefore, using bars with transparent backgrounds isn’t supported.

Internally, PDFView uses the toolbarBackground(_:for:) modifier to set a visible background for navigation bars and tab bars on iOS 16 and later.

PDFViewController will automatically enable visible bar backgrounds in these simpler setups:

With other setups, you may see missing bar backgrounds, resulting in document content being displayed underneath bars like what’s shown below.

Screenshot showing the title and buttons in bars overlapping document content, which makes everything hard to read.

To fix a transparent bottom toolbar in SwiftUI, use the .toolbarBackground(_:for:) modifier. In the iOS 18 SDK, this has been renamed to toolbarBackgroundVisibility(_:for:):

PDFView(document: document)
    .toolbarBackground(.visible, for: .bottomBar)

To fix transparent bars with UIKit, disable transparent bar backgrounds by setting scrollEdgeAppearance and compactScrollEdgeAppearance to be the same as standardAppearance and compactAppearance on the navigation bar, toolbar, or tab bar.

Screenshot showing bars with filled backgrounds, which makes the title and buttons in the bars easier to read.

If your PDFViewController is a descendant of a UINavigationController with two or more intermediate view controllers, then you can change the appearance properties of the navigation item of the direct child of the UINavigationController. This will mean the appearance only applies when this particular view controller is the topViewController on the navigation stack:

navigationItem.scrollEdgeAppearance = navigationItem.standardAppearance
navigationItem.compactScrollEdgeAppearance = navigationItem.compactAppearance

Alternatively, you can change the appearance properties of the navigation bar itself. This will apply regardless of which view controller is at the top of the navigation stack:

navigationController.navigationBar.scrollEdgeAppearance = navigationController.navigationBar.standardAppearance
navigationController.navigationBar.compactScrollEdgeAppearance = navigationController.navigationBar.compactAppearance

If your PDFViewController is a descendant of — but not a direct child of — a UITabBarController, then you can change the appearance properties of the tab bar item of the direct child of the UITabBarController, so that this appearance only applies when this particular tab is selected:

tabBarItem.scrollEdgeAppearance = tabBarItem.standardAppearance

Alternatively, you can change the appearance properties of the tab bar itself. This will apply regardless of which tab is selected:

tabBarController.tabBar.scrollEdgeAppearance = tabBarController.tabBar.standardAppearance

If you’re using the UIToolbar of a UINavigationController (a bar shown at the bottom of the screen), then you must change the appearance properties of the toolbar:

navigationController.toolbar.scrollEdgeAppearance = navigationController.toolbar.standardAppearance
navigationController.toolbar.compactScrollEdgeAppearance = navigationController.toolbar.compactAppearance