> For the complete documentation index, see [llms.txt](https://docs.apryse.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.apryse.com/android/ui-customization/list-container.md). # Display & customize list container in Android Discover how to use the list container in your Android app to showcase annotation, document outline, and user-defined bookmark tabs with BookmarksDialogFragment. Customize your display with ease! The The list container provides a horizontal layout to display the following items in separate tabs: * [Annotation list](/android/annotation/annotation-list-a.md) * [Document outline](/android/bookmarks/outline.md#ui-component) * [User-defined bookmark list](/android/bookmarks/user-bookmarks-a.md) ![](https://226546913-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0QItsdFBmuuL9ezHimHy%2Fuploads%2Fgit-blob-3769c92bdcad1d5b53edbb5cd4dc409efcd4329a%2F408eaa5f033c0bd4620b5e20efcea346589a7c84-600x1200.gif?alt=media) ## Show list container The list container is implemented by the `BookmarksDialogFragment` class. To show this fragment in your activity, create a new instance of `BookmarksDialogFragment` by calling `newInstance()`. Afterwards, initialize your fragment by setting the [`PDFViewCtrl`](https://sdk.apryse.com/api/android/javadoc/reference/com/pdftron/pdf/PDFViewCtrl.html) and an `ArrayList` of `DialogFragmentTab`: {% tabs %} {% tab title="Java" %} {% code lineNumbers="true" %} ```java private PDFViewCtrl mPdfViewCtrl; // ... public void showBookmarksDialog(ArrayList dialogFragmentTabs, FragmentManager fragmentManager) { BookmarksDialogFragment fragment = BookmarksDialogFragment.newInstance(); fragment.setPdfViewCtrl(mPdfViewCtrl) .setDialogFragmentTabs(dialogFragmentTabs); // Set a custom style for this fragment fragment.setStyle(DialogFragment.STYLE_NO_TITLE, R.style.PDFTronAppTheme); // Show the dialog fragment.show(fragmentManager, "bookmarks_dialog"); } ``` {% endcode %} {% endtab %} {% tab title="Kotlin" %} {% code lineNumbers="true" %} ```kotlin private var mPdfViewCtrl: PDFViewCtrl? = null // ... fun showBookmarksDialog(dialogFragmentTabs: ArrayList, fragmentManager: FragmentManager) { val fragment = BookmarksDialogFragment.newInstance() fragment.setPdfViewCtrl(mPdfViewCtrl!!) .setDialogFragmentTabs(dialogFragmentTabs) // Set a custom style for this fragment fragment.setStyle(DialogFragment.STYLE_NO_TITLE, R.style.PDFTronAppTheme) // Show the dialog fragment.show(fragmentManager, "bookmarks_dialog") } ``` {% endcode %} {% endtab %} {% endtabs %} `DialogFragmentTab` specifies the information about each tab including the type of class and the tab tag. You can create an instance of `DialogFragmentTab` using \[`DialogFragmentTab(Class, String)`]\(\, java.lang.String)). Currently the following dialogs can be displayed within the bookmarks dialog: | Dialog | Type of class | Tab tag | | ------------------ | -------------------------------- | -------------------- | | Annotation list | AnnotationDialogFragment.class | TAG\_TAB\_ANNOTATION | | Document outline | OutlineDialogFragment.class | TAG\_TAB\_OUTLINE | | User bookmark list | UserBookmarkDialogFragment.class | TAG\_TAB\_BOOKMARK | The following example shows how to display an annotations list, a document outline, and a user-defined bookmark list tabs in `BookmarksDialogFragment`: {% tabs %} {% tab title="Java" %} {% code lineNumbers="true" %} ```java BookmarksDialogFragment showBookmarksDialog(FragmentManager fragmentManager, PDFViewCtrl pdfViewCtrl) { DialogFragmentTab annotationsDialog = new DialogFragmentTab( AnnotationDialogFragment.class, BookmarksTabLayout.TAG_TAB_ANNOTATION, null, "Annotations", "Bookmarks Dialog", null); DialogFragmentTab outlineDialog = new DialogFragmentTab( UserBookmarkDialogFragment.class, BookmarksTabLayout.TAG_TAB_OUTLINE, null, "Outline", "Bookmarks Dialog", null); DialogFragmentTab userBookmarksDialog = new DialogFragmentTab( UserBookmarkDialogFragment.class, BookmarksTabLayout.TAG_TAB_BOOKMARK, null, "User Bookmarks", "Bookmarks Dialog", null); ArrayList dialogFragmentTabs = new ArrayList<>(); dialogFragmentTabs.add(annotationsDialog); dialogFragmentTabs.add(outlineDialog); dialogFragmentTabs.add(userBookmarksDialog); BookmarksDialogFragment bookmarksDialog = BookmarksDialogFragment.newInstance(); bookmarksDialog.setPdfViewCtrl(pdfViewCtrl) .setDialogFragmentTabs(dialogFragmentTabs); bookmarksDialog.setBookmarksDialogListener(this) bookmarksDialog.setBookmarksTabsListener(this); bookmarksDialog.setStyle(DialogFragment.STYLE_NO_TITLE, R.style.PDFTronAppTheme); bookmarksDialog.show(fragmentManager, "bookmarks_dialog"); return bookmarksDialog; } @Override public void onBookmarksDialogDismissed(int tabIndex) { // the bookmarks dialog was dismissed } @Override public void onUserBookmarkClick(int pageNum) { // a user bookmark was clicked } @Override public void onOutlineClicked(Bookmark parent, Bookmark bookmark) { // an outline was clicked } @Override public void onAnnotationClicked(Annot annotation, int pageNum) { // an annotation was clicked } @Override public void onExportAnnotationsClicked() { // the export annotation button was clicked } ``` {% endcode %} {% endtab %} {% tab title="Kotlin" %} {% code lineNumbers="true" %} ```kotlin fun showBookmarksDialog(fragmentManager: FragmentManager, pdfViewCtrl: PDFViewCtrl): BookmarksDialogFragment { val annotationsDialog = DialogFragmentTab( AnnotationDialogFragment::class.java!!, BookmarksTabLayout.TAG_TAB_ANNOTATION, null, "Annotations", "Bookmarks Dialog", null) val outlineDialog = DialogFragmentTab( UserBookmarkDialogFragment::class.java!!, BookmarksTabLayout.TAG_TAB_OUTLINE, null, "Outline", "Bookmarks Dialog", null) val userBookmarksDialog = DialogFragmentTab( UserBookmarkDialogFragment::class.java!!, BookmarksTabLayout.TAG_TAB_BOOKMARK, null, "User Bookmarks", "Bookmarks Dialog", null) val dialogFragmentTabs = ArrayList() dialogFragmentTabs.add(annotationsDialog) dialogFragmentTabs.add(outlineDialog) dialogFragmentTabs.add(userBookmarksDialog) val bookmarksDialog = BookmarksDialogFragment.newInstance() bookmarksDialog.setPdfViewCtrl(pdfViewCtrl) .setDialogFragmentTabs(dialogFragmentTabs) bookmarksDialog.setBookmarksDialogListener(this) bookmarksDialog.setBookmarksTabsListener(this) bookmarksDialog.setStyle(DialogFragment.STYLE_NO_TITLE, R.style.PDFTronAppTheme) bookmarksDialog.show(fragmentManager, "bookmarks_dialog") return bookmarksDialog } override fun onBookmarksDialogDismissed(tabIndex: Int) { // the bookmarks dialog was dismissed } override fun onUserBookmarkClick(pageNum: Int) { // a user bookmark was clicked } override fun onOutlineClicked(parent: Bookmark, bookmark: Bookmark) { // an outline was clicked } override fun onAnnotationClicked(annotation: Annot, pageNum: Int) { // an annotation was clicked } fun onExportAnnotationsClicked() { // the export annotation button was clicked } ``` {% endcode %} {% endtab %} {% endtabs %} ## Customization The `BookmarksDialogFragment` provides a flexible API for displaying only the desired child view. Any of the annotation list, document outline, or user-defined bookmark list view can be removed by omitting them from the `DialogFragmentTabs`. --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://docs.apryse.com/android/ui-customization/list-container.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.