---
title: "Jetpack Compose PDF viewer: Read and display PDFs"
canonical_url: "https://www.nutrient.io/guides/android/jetpack-compose/viewer/"
md_url: "https://www.nutrient.io/guides/android/jetpack-compose/viewer.md"
last_updated: "2026-06-08T09:14:14.289Z"
description: "Since Nutrient Android SDK version 8, our SDK exposes Jetpack Compose-specific APIs out of the box, enabling PDF viewing and editing."
---

# Jetpack Compose PDF viewer

Since Nutrient Android SDK version 8, our SDK exposes [Jetpack Compose](https://developer.android.com/jetpack/compose)-specific APIs out of the box, enabling PDF viewing and editing. This makes dealing with Nutrient in a Jetpack Compose app easier, and it doesn’t require you to wrap [`PdfFragment`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.ui/-pdf-fragment/index.html) yourself if you want to go the Compose route.

The main entry point is the [`DocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#DocumentView(android.net.Uri,androidx.compose.ui.Modifier)) composable. [`DocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#DocumentView(android.net.Uri,androidx.compose.ui.Modifier)) wraps the functionality of [`PdfUiFragment`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.ui/-pdf-ui-fragment/index.html) using the [`AndroidView`](https://developer.android.com/reference/kotlin/androidx/compose/ui/viewinterop/package-summary#AndroidView(kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Function1)) composable.

## Displaying a document

To display a document, use the [`DocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#DocumentView(android.net.Uri,androidx.compose.ui.Modifier)) composable function that expects a [`Uri`](https://developer.android.com/reference/android/net/Uri) parameter:

```kotlin

setContent {
    Surface {
        val documentUri = remember { getDocumentUri() }
        DocumentView(
            documentUri = documentUri,
            modifier = Modifier.height(100.dp).padding(16.dp)
        )
    }
}

```

## Displaying an image

To display an image, use the [`ImageDocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#ImageDocumentView(android.net.Uri,androidx.compose.ui.Modifier)) composable function that expects a [`Uri`](https://developer.android.com/reference/android/net/Uri) parameter:

```kotlin

setContent {
    Surface {
        val imageUri = remember { getDocumentUri() }
        ImageDocumentView(
            imageUri = imageUri,
            modifier = Modifier.height(100.dp).padding(16.dp)
        )
    }
}

```

## Advanced use

The [`DocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#DocumentView(android.net.Uri,androidx.compose.ui.Modifier)) and [`ImageDocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#ImageDocumentView(android.net.Uri,androidx.compose.ui.Modifier)) composables both have the expected [`Modifier`](https://developer.android.com/reference/kotlin/androidx/compose/ui/Modifier) parameter, which allows you to control how these composables will be displayed inside your layout. You can also provide a [`DocumentState`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.interactors/-document-state/index.html) object, which is a wrapper that allows you to modify the [`PdfActivityConfiguration`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.configuration.activity/-pdf-activity-configuration/index.html) used to display the document. It also exposes operations for verifying and updating the current page of the displayed document.

The correct way of instantiating a [`DocumentState`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.interactors/-document-state/index.html) is via the [`rememberDocumentState`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.interactors/index.html#rememberDocumentState(android.net.Uri,com.pspdfkit.configuration.activity.PdfActivityConfiguration,Int)) method. Here’s how to use the [`DocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#DocumentView(android.net.Uri,androidx.compose.ui.Modifier)) composable after hoisting the [`DocumentState`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.interactors/-document-state/index.html) to control the [`UserInterfaceViewMode`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.configuration.activity/-user-interface-view-mode/index.html), and how to ensure the [`DocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#DocumentView(android.net.Uri,androidx.compose.ui.Modifier)) only recomposes when another property changes:

```kotlin

setContent {
    Surface {
        var hideInterfaceElements by remember { mutableStateOf(false) }

        // Configuration to hide the interface.
        val pdfActivityConfiguration = remember(hideInterfaceElements) {

            val userInterfaceViewMode =
                if (hideInterfaceElements) UserInterfaceViewMode.USER_INTERFACE_VIEW_MODE_HIDDEN
                else UserInterfaceViewMode.USER_INTERFACE_VIEW_MODE_AUTOMATIC

            PdfActivityConfiguration.Builder(this).setUserInterfaceViewMode(userInterfaceViewMode).build()
        }

        val documentState = rememberDocumentState(documentUri, pdfActivityConfiguration)
        DocumentView(
            documentState = documentState,
            modifier = Modifier.height(100.dp).padding(16.dp),
            documentManager = getDefaultDocumentManager()
        )
    }
}

```

In addition to the [`Uri`](https://developer.android.com/reference/android/net/Uri) parameter, you can use [`DocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#DocumentView(android.net.Uri,androidx.compose.ui.Modifier)) and [`ImageDocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#ImageDocumentView(android.net.Uri,androidx.compose.ui.Modifier)) composables with [`DataProvider`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.document.providers/-data-provider/index.html) as well.
Below is an example of [`DocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#DocumentView(android.net.Uri,androidx.compose.ui.Modifier)) using a resource from the assets folder via [`AssetDataProvider`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.document.providers/-asset-data-provider/index.html):

```kotlin

val dataProvider: DataProvider by remember { mutableStateOf(AssetDataProvider("demo.pdf")) }
val documentState = rememberDocumentState(dataProvider, pdfActivityConfiguration)

DocumentView(
    documentState,
    modifier = Modifier.fillMaxSize()
)

```

## Interacting with DocumentView

To make interactions easier, [`DocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#DocumentView(android.net.Uri,androidx.compose.ui.Modifier)) provides [`DocumentManager`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.interactors/-document-manager/index.html), which provides all the lifecycle and annotation callbacks from the Nutrient SDK.
Along with this, to perform any action, [`DocumentConnection`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.interactors/-document-connection/index.html) is provided in [`documentState`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.interactors/-document-state/index.html).

Learn more about `DocumentManager` and `DocumentConnection` [here](https://www.nutrient.io/guides/android/jetpack-compose/interactions.md).

## File type support

- PDF

- PNG, JPEG, JPG, TIFF, TIF

## Exploring further

We have a dedicated [GitHub public repository](https://github.com/PSPDFKit/pspdfkit-android-compose-example) demonstrating everything related to [`DocumentView`](https://www.nutrient.io/api/android/nutrient/com.pspdfkit.jetpack.compose.views/index.html#DocumentView(android.net.Uri,androidx.compose.ui.Modifier)) and the `com.pspdfkit.jetpack.compose` package.
---

## Related pages

- [Jetpack Compose PDF library](/guides/android/jetpack-compose.md)
- [Interacting with DocumentView](/guides/android/jetpack-compose/interactions.md)