--- title: "Compose Navigation" canonical_url: "https://www.nutrient.io/guides/android/samples/compose-navigation-kotlin/" md_url: "https://www.nutrient.io/guides/android/samples/compose-navigation-kotlin.md" last_updated: "2026-05-15T19:10:04.916Z" description: "Use the DocumentView composable within a Jetpack Compose NavHost." --- # Compose Navigation Use the DocumentView composable within a Jetpack Compose NavHost. [Get Started](https://www.nutrient.io/sdk/android/getting-started.md) [All Samples](https://www.nutrient.io/guides/android/samples.md) [Download](https://www.nutrient.io/guides/android/downloads.md) [Launch Demo](https://www.nutrient.io/demo/) --- ```kotlin /* * Copyright © 2023-2026 PSPDFKit GmbH. All rights reserved. * * The PSPDFKit Sample applications are licensed with a modified BSD license. * Please see License for details. This notice may not be removed from this file. */ package com.pspdfkit.catalog.examples.kotlin import android.content.Context import android.content.Intent import android.graphics.RectF import android.os.Bundle import android.widget.Toast import androidx.activity.compose.setContent import androidx.activity.enableEdgeToEdge import androidx.appcompat.app.AppCompatActivity import androidx.compose.foundation.background import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.statusBarsPadding import androidx.compose.material.icons.Icons import androidx.compose.material.icons.automirrored.filled.ArrowBack import androidx.compose.material3.ElevatedButton import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.Icon import androidx.compose.material3.IconButton import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Scaffold import androidx.compose.material3.Text import androidx.compose.material3.TopAppBar import androidx.compose.runtime.Composable import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.core.net.toUri import androidx.navigation.compose.NavHost import androidx.navigation.compose.composable import androidx.navigation.compose.rememberNavController import com.pspdfkit.catalog.R import com.pspdfkit.catalog.SdkExample import com.pspdfkit.catalog.tasks.ExtractAssetTask import com.pspdfkit.configuration.activity.PdfActivityConfiguration import com.pspdfkit.configuration.activity.UserInterfaceViewMode import com.pspdfkit.configuration.page.PageFitMode import com.pspdfkit.configuration.page.PageLayoutMode import com.pspdfkit.configuration.page.PageScrollDirection import com.pspdfkit.configuration.page.PageScrollMode import com.pspdfkit.forms.TextFormConfiguration import com.pspdfkit.jetpack.compose.interactors.DefaultListeners import com.pspdfkit.jetpack.compose.interactors.getDefaultDocumentManager import com.pspdfkit.jetpack.compose.interactors.rememberDocumentState import com.pspdfkit.jetpack.compose.views.DocumentView private const val URL_PARAM = "url_param" /** * This activity shows how DocumentView can be used with Navigation Component. */ class NavHostExample(context: Context) : SdkExample(context, R.string.navHostExampleTitle, R.string.navHostExampleDescription) { override fun launchExample(context: Context, configuration: PdfActivityConfiguration.Builder) { // Extract the document from the assets. ExtractAssetTask.extract(WELCOME_DOC, title, context) { url -> context.startActivity( Intent(context, NavHostActivity::class.java).apply { putExtra(URL_PARAM, url.toUri().toString()) }, ) } } } /** * This activity will create a simple navigation flow between two screens, each containing a DocumentView. */ class NavHostActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) val path = intent.getStringExtra(URL_PARAM)?: "" enableEdgeToEdge() setContent { MaterialTheme { Scaffold { val navController = rememberNavController() NavHost( navController = navController, startDestination = "ScreenOne", modifier = Modifier.fillMaxSize().padding(it), ) { composable("ScreenOne") { ScreenOne(path) { navController.navigate("ScreenTwo") } } composable("ScreenTwo") { ScreenTwo(path) { navController.popBackStack() } } } } } } } } /** * ScreenOne contains a DocumentView */ @Composable fun ScreenOne(path: String, navigate: () -> Unit) { Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.BottomCenter) { val context = androidx.compose.ui.platform.LocalContext.current val pdfActivityConfiguration = remember { PdfActivityConfiguration.Builder(context).layoutMode(PageLayoutMode.AUTO).scrollMode(PageScrollMode.CONTINUOUS).fitMode(PageFitMode.FIT_TO_WIDTH).pagePadding(8).scrollDirection(PageScrollDirection.VERTICAL).setUserInterfaceViewMode(UserInterfaceViewMode.USER_INTERFACE_VIEW_MODE_HIDDEN).autosaveEnabled(false).formEditingEnabled(false).build() } val documentState = rememberDocumentState(documentUri = path.toUri(), configuration = pdfActivityConfiguration) DocumentView( documentState = documentState, documentManager = getDefaultDocumentManager( documentListener = DefaultListeners.documentListeners( onDocumentLoaded = { i -> i.formProvider.addFormElementToPage( "text-field-1", TextFormConfiguration.Builder(0, RectF(30f, 750f, 200f, 720f)).setText("Hello new Text").build(), ) Toast.makeText(context, "Document loaded!", Toast.LENGTH_SHORT).show() }, ), ), ) ElevatedButton(navigate, modifier = Modifier) { Text("Navigate by NavController") } } } /** * ScreenTwo contains a DocumentView with a slightly different configuration. */ @OptIn(ExperimentalMaterial3Api::class) @Composable fun ScreenTwo(path: String, navigate: () -> Unit) { Box(modifier = Modifier.fillMaxSize()) { val context = androidx.compose.ui.platform.LocalContext.current val pdfActivityConfiguration = remember { PdfActivityConfiguration.Builder(context).layoutMode(PageLayoutMode.AUTO).scrollMode(PageScrollMode.PER_PAGE).fitMode(PageFitMode.FIT_TO_WIDTH).pagePadding(8).scrollDirection(PageScrollDirection.VERTICAL).setUserInterfaceViewMode(UserInterfaceViewMode.USER_INTERFACE_VIEW_MODE_HIDDEN).autosaveEnabled(false).formEditingEnabled(true).build() } val documentState = rememberDocumentState(documentUri = path.toUri(), configuration = pdfActivityConfiguration) DocumentView( documentState = documentState, documentManager = getDefaultDocumentManager( documentListener = DefaultListeners.documentListeners( onDocumentLoaded = { i -> i.formProvider.addFormElementToPage( "text-field-editable", TextFormConfiguration.Builder(0, RectF(30f, 750f, 200f, 720f)).setText("Hello new Text").build(), ) Toast.makeText(context, "Document loaded!", Toast.LENGTH_SHORT).show() }, ), ), ) Box(modifier = Modifier.background(MaterialTheme.colorScheme.surface)) { TopAppBar( title = { Text("${documentState.getTitle()}") }, navigationIcon = { IconButton(navigate) { Icon(Icons.AutoMirrored.Default.ArrowBack, contentDescription = "Back") } }, modifier = Modifier.statusBarsPadding(), ) } } } ``` This code sample is an example that illustrates how to use our SDK. Please adapt it to your specific use case. --- ## Related pages - [Application Policy](/guides/android/samples/application-policy-kotlin.md) - [Custom Form Highlight Color](/guides/android/samples/custom-form-highlight-color-java.md) - [Custom Page Templates](/guides/android/samples/custom-page-templates-java.md) - [Digital Signature (Basic)](/guides/android/samples/digital-signature-basic-kotlin.md) - [Disabled Annotation Property](/guides/android/samples/disabled-annotation-property-java.md) - [Image Document](/guides/android/samples/image-document-kotlin.md) - [Compose Image Document](/guides/android/samples/compose-image-document-kotlin.md) - [Inline Multimedia](/guides/android/samples/inline-multimedia-kotlin.md) - [JavaScript Form Filling](/guides/android/samples/javascript-form-filling-kotlin.md) - [Overlay Visibility](/guides/android/samples/overlay-visibility-kotlin.md) - [PdfFragment](/guides/android/samples/pdffragment-kotlin.md) - [Reader View](/guides/android/samples/reader-view-kotlin.md) - [Playground](/guides/android/samples/playground-kotlin.md) - [JavaScript Calculator](/guides/android/samples/javascript-calculator-kotlin.md) - [Text Field Suggestions](/guides/android/samples/text-field-suggestions-kotlin.md) - [Thumbnail Bar Modes](/guides/android/samples/thumbnail-bar-modes-kotlin.md) - [Signature Storage Database](/guides/android/samples/signature-storage-database-kotlin.md) - [Selection Customization](/guides/android/samples/selection-customization-java.md) - [Password Protected PDF](/guides/android/samples/password-protected-pdf-kotlin.md) - [Scientific Paper](/guides/android/samples/scientific-paper-kotlin.md) - [Try Instant](/guides/android/samples/try-instant-kotlin.md) - [Merge Documents](/guides/android/samples/merge-documents-kotlin.md) - [Annotation Rendering](/guides/android/samples/annotation-rendering-kotlin.md) - [Custom Data Provider](/guides/android/samples/custom-data-provider-kotlin.md) - [Annotations with Transparency](/guides/android/samples/annotations-with-transparency-kotlin.md) - [Annotation Flags](/guides/android/samples/annotation-flags-kotlin.md) - [AI Assistant (Multiple Documents, ViewPager)](/guides/android/samples/ai-assistant-multiple-documents-viewpager-kotlin.md) - [Custom Sharing Menu](/guides/android/samples/custom-sharing-menu-java.md) - [Add LTV to Existing Signature](/guides/android/samples/add-ltv-to-existing-signature-kotlin.md) - [Custom Toolbar Grouping](/guides/android/samples/custom-toolbar-grouping-java.md) - [Custom Layout](/guides/android/samples/custom-layout-kotlin.md) - [Custom ActionBar Actions](/guides/android/samples/custom-actionbar-actions-kotlin.md) - [Custom Activity Toolbars](/guides/android/samples/custom-activity-toolbars-java.md) - [Custom Note Hinter](/guides/android/samples/custom-note-hinter-kotlin.md) - [Custom Main Toolbar](/guides/android/samples/custom-main-toolbar-kotlin.md) - [Annotation Configuration](/guides/android/samples/annotation-configuration-kotlin.md) - [Annotation Selection Styling](/guides/android/samples/annotation-selection-styling-kotlin.md) - [Custom Search UI (Compose)](/guides/android/samples/custom-search-ui-compose-kotlin.md) - [Document Switcher](/guides/android/samples/document-switcher-java.md) - [File Annotation Creation](/guides/android/samples/file-annotation-creation-kotlin.md) - [Dynamic Pages on Scroll](/guides/android/samples/dynamic-pages-on-scroll-kotlin.md) - [Custom Activity Form Editing](/guides/android/samples/custom-activity-form-editing-java.md) - [Custom Stamp Annotations](/guides/android/samples/custom-stamp-annotations-java.md) - [Custom Outline Provider](/guides/android/samples/custom-outline-provider-kotlin.md) - [Fragment Runtime Configuration](/guides/android/samples/fragment-runtime-configuration-kotlin.md) - [Annotation Overlay](/guides/android/samples/annotation-overlay-java.md) - [Instant Document JSON](/guides/android/samples/instant-document-json-kotlin.md) - [DocumentView Composable](/guides/android/samples/documentview-composable-kotlin.md) - [Form Creation](/guides/android/samples/form-creation-kotlin.md) - [Document Download](/guides/android/samples/document-download-kotlin.md) - [JavaScript Actions](/guides/android/samples/javascript-actions-kotlin.md) - [Instant JSON Attachment](/guides/android/samples/instant-json-attachment-kotlin.md) - [Digital Signature (Manual)](/guides/android/samples/digital-signature-manual-kotlin.md) - [Digital Signature (Third-Party)](/guides/android/samples/digital-signature-third-party-kotlin.md) - [Inline Search](/guides/android/samples/inline-search-java.md) - [Form Filling](/guides/android/samples/form-filling-kotlin.md) - [Form Click Intercept (Compose)](/guides/android/samples/form-click-intercept-compose-kotlin.md) - [Document Sharing](/guides/android/samples/document-sharing-java.md) - [Custom Download Dialog](/guides/android/samples/custom-download-dialog-java.md) - [Download Progress](/guides/android/samples/download-progress-kotlin.md) - [Popup Toolbar Customization](/guides/android/samples/popup-toolbar-customization-kotlin.md) - [Custom Sharing Dialog](/guides/android/samples/custom-sharing-dialog-java.md) - [PDF from Image](/guides/android/samples/pdf-from-image-kotlin.md) - [Digital Signature (Two-Step)](/guides/android/samples/digital-signature-two-step-kotlin.md) - [Remote URL](/guides/android/samples/remote-url-kotlin.md) - [PdfUiFragment](/guides/android/samples/pdfuifragment-kotlin.md) - [Runtime Configuration](/guides/android/samples/runtime-configuration-kotlin.md) - [Sound Extraction](/guides/android/samples/sound-extraction-kotlin.md) - [Document from Canvas](/guides/android/samples/document-from-canvas-kotlin.md) - [Tabbed Documents](/guides/android/samples/tabbed-documents-kotlin.md) - [Watermarks](/guides/android/samples/watermarks-kotlin.md) - [Programmatic Zoom](/guides/android/samples/programmatic-zoom-kotlin.md) - [Signature Parcelize](/guides/android/samples/signature-parcelize-kotlin.md) - [OCR](/guides/android/samples/ocr-kotlin.md) - [Vertical Scrollbar](/guides/android/samples/vertical-scrollbar-java.md) - [Split View](/guides/android/samples/split-view-java.md) - [XFDF Import/Export](/guides/android/samples/xfdf-import-export-kotlin.md) - [UI View Modes](/guides/android/samples/ui-view-modes-kotlin.md) - [LTV Signature](/guides/android/samples/ltv-signature-kotlin.md) - [Bookmark Highlighting](/guides/android/samples/bookmark-highlighting-kotlin.md) - [Custom Annotation Inspector](/guides/android/samples/custom-annotation-inspector-java.md) - [Annotation Sidebar](/guides/android/samples/annotation-sidebar-kotlin.md) - [AI Assistant (Single Document)](/guides/android/samples/ai-assistant-single-document-kotlin.md) - [AI Assistant (Multiple Documents, Compose)](/guides/android/samples/ai-assistant-multiple-documents-compose-kotlin.md) - [Document Comparison](/guides/android/samples/document-comparison-kotlin.md) - [Document Processing](/guides/android/samples/document-processing-kotlin.md) - [Custom Annotation Creation Toolbar](/guides/android/samples/custom-annotation-creation-toolbar-java.md) - [Custom Electronic Signature](/guides/android/samples/custom-electronic-signature-java.md) - [E-Learning](/guides/android/samples/e-learning-kotlin.md) - [Electronic + Digital Signing](/guides/android/samples/electronic-digital-signing-kotlin.md) - [Generate PDF Report](/guides/android/samples/generate-pdf-report-kotlin.md) - [Multimedia Annotations](/guides/android/samples/multimedia-annotations-kotlin.md) - [Forms with JavaScript](/guides/android/samples/forms-with-javascript-kotlin.md) - [External Document](/guides/android/samples/external-document-kotlin.md) - [Overlay Views](/guides/android/samples/overlay-views-kotlin.md) - [Kiosk Grid](/guides/android/samples/kiosk-grid-kotlin.md) - [Search Indexing](/guides/android/samples/search-indexing-kotlin.md) - [Annotation Creation](/guides/android/samples/annotation-creation-kotlin.md) - [Filterable Thumbnail Grid](/guides/android/samples/filterable-thumbnail-grid-kotlin.md) - [Tabbed Documents (Persistent)](/guides/android/samples/tabbed-documents-persistent-kotlin.md) - [Measurement Tools](/guides/android/samples/measurement-tools-kotlin.md) - [HTML-to-PDF Conversion](/guides/android/samples/html-to-pdf-conversion-kotlin.md) - [AES Encrypted File](/guides/android/samples/aes-encrypted-file-java.md) - [Construction Floor Plan](/guides/android/samples/construction-floor-plan-kotlin.md) - [Hide and Reveal Areas](/guides/android/samples/hide-and-reveal-areas-kotlin.md) - [Multiple Documents (Compose Pager)](/guides/android/samples/multiple-documents-compose-pager-kotlin.md) - [Screen Reader](/guides/android/samples/screen-reader-java.md) - [Custom Search UI (Views)](/guides/android/samples/custom-search-ui-views-java.md)