Customizing dialog modals on Android
By default, Nutrient styles all dialogs according to your theme without any additional work. This produces light dialogs with light application themes and dark dialogs with dark application themes.
If the default behavior is not enough, a large set of style attributes is available to alter the appearance to your needs. For a comprehensive usage example, take a look at DarkThemeExample and DarkThemeActivity inside the Catalog app.
Alert dialogs
Nutrient supports the standard alertDialogTheme attribute from appcompat-v7 for styling all AlertDialog instances:
<style name="MyApp.PSPDFKitTheme" parent="PSPDFKit.Theme.Default"> <item name="alertDialogTheme>@style/PSPDFKit.AlertDialog</item></style>Modal dialogs
Nutrient allows styling the appearance of common properties of custom modal dialogs, including sharing and printing dialogs, the annotation inspector, stamp and signature pickers, and new page dialogs:
<item name="pspdf__modalDialogStyle">@style/MyApp.ModalDialogStyle</item>Attributes
| Attribute | Description |
|---|---|
pspdf__titleBackground | Dialog title bar background color. |
pspdf__titleTextColor | Dialog title bar text color. |
pspdf__titleIconsColor | Dialog title bar icon color. |
pspdf__titleHeight | Dialog title height. |
pspdf__titleTextSize | Dialog title text size. |
pspdf__titlePadding | Dialog title padding. |
pspdf__cornerRadius | Dialog corner radius. |
To use different modal dialog styles, override the pspdf__modalDialogStyle theme attribute that is controlling your dialog theming in your styles.xml.
Sharing dialog
The sharing and printing options dialog style is controlled by the following theme attribute:
<item name="pspdf__sharingDialogStyle">@style/MyApp.SharingDialogStyle</item>Attributes
| Attribute | Description |
|---|---|
pspdf__backgroundColor | Sharing dialog background color. |
pspdf__errorColor | Error highlight color used in text fields. |
The style of controls inside the sharing dialog are controlled by existing theme attributes. For example:
| Attribute | Description |
|---|---|
android:colorBackground | Color used in spinner pop-ups. |
android:textColorPrimary | Text color inside dialog. |
android:textColorSecondary | Text color used for captions. |
New page dialog
To control the style of a new page dialog, just add the following attribute to your theme:
<item name="pspdf__newPageDialogStyle">@style/MyApp.NewPageDialogStyle</item>Attributes
| Attribute | Description |
|---|---|
pspdf__backgroundColor | Dialog background color. |
The style of controls inside the new page dialog are controlled by existing theme attributes. For example:
| Attribute | Description |
|---|---|
android:colorBackground | Color used in spinner pop-ups. |
android:textColorPrimary | Text color inside dialog. |
android:textColorSecondary | Text color used for captions. |
Stamp picker Dialog
The stamp picker dialog style is controlled by the following theme attribute:
<item name="pspdf__stampPickerStyle">@style/MyApp.StampPickerStyle</item>Attributes
| Attribute | Description |
|---|---|
pspdf__maxHeight | Maximum height of the stamp picker dialog. |
pspdf__maxWidth | Maximum width of the stamp picker dialog. |
pspdf__backgroundColor | Dialog background color. |
pspdf__textColor | Stamp picker text color. |
pspdf__hintColor | Stamp picker edit text hint color. |
pspdf__acceptCustomStampIcon | Icon for accepting a custom stamp when editing it. This will be displayed inside the FAB. This is a checkmark by default. |
pspdf__acceptCustomStampIconColor | Color for a custom stamp acceptance icon. |
pspdf__acceptCustomStampIconBackgroundColor | Color for a custom stamp acceptance icon background. |
Add signature dialog
The signature dialog style is controlled by the following theme attribute:
<item name="pspdf__signatureLayoutStyle">@style/MyApp.SignatureLayoutStyle</item>Attributes
| Attribute | Description |
|---|---|
pspdf__backgroundColor | Signature layout background color. |
pspdf__textColor | Signature layout foreground color. |
pspdf__addSignatureIcon | Icon for adding signature (displayed in FAB by default). |
pspdf__addSignatureIconColor | Color for the Add Signature icon. |
pspdf__addSignatureIconBackgroundColor | Background color for the Add Signature icon (the background of the FAB). |
pspdf__acceptSignatureIcon | Icon for accepting a signature when editing it. This will be displayed inside the FAB. This is a checkmark by default. |
pspdf__acceptSignatureIconColor | Color for the signature acceptance icon. |
pspdf__acceptSignatureIconBackgroundColor | Color for the signature acceptance icon background. |
pspdf__signatureListSelectedItemBackground | Color for the selected signature list item background. |
pspdf__deleteSelectedSignaturesIcon | Icon for deleting the selected signature. This will be displayed inside the FAB. This is a trash icon by default. |
pspdf__deleteSelectedSignaturesIconColor | Color for the signature deletion icon. |
pspdf__deleteSelectedSignaturesIconBackgroundColor | Background color for the signature deletion icon. |
pspdf__clearSignatureCanvasIcon | Signature layout icon for clearing the signature canvas. |
pspdf__clearSignatureCanvasIconColor | Color of the clear canvas icon. |
pspdf__colorIconsBorderColor | Color of the border for the signature ink color icons. |
pspdf__signatureInkColorPrimary | First color offered in the signature ink color picker. |
pspdf__signatureInkColorSecondary | Second color offered in the signature ink color picker. |
pspdf__signatureInkColorTertiary | Third color offered in the signature ink color picker. |
Annotation inspector
Use this to change the appearance of the annotation inspector:
<item name="pspdf__propertyInspectorStyle">@style/MyApp.PropertyInspectorStyle</item>Attributes
| Attribute | Description |
|---|---|
pspdf__backgroundColor | Inspector background color. |
pspdf__textColor | Inspector text color. |
pspdf__minHeight | Minimum height of the inspector when resized. |
pspdf__maxHeight | Maximum height of the inspector when resized. |
pspdf__maxWidth | Maximum width of the inspector. |
Action menu
The action menu style is controlled by the following theme attribute:
<item name="pspdf__actionMenuStyle">@style/MyApp.ActionMenuStyle</item>Attributes
| Attribute | Description |
|---|---|
pspdf__maxWidth | Maximum width of the action menu on tablets. |
pspdf__backgroundColor | Background color used in the action menu. |
pspdf__labelColor | Action labels text color. |
pspdf__fixedActionsPanelBackgroundColor | Fixed actions background color. |
pspdf__fixedActionsIconColor | Fixed actions icon color. |
pspdf__fixedActionsIconBackground | Fixed actions circular background color. |
Using light dialogs with dark themes
You may want to use a dark application theme like Theme.AppCompat.NoActionBar and still use light-themed dialogs. To achieve this, change the dialog style parent to Theme.AppCompat.Dialog.Light or ThemeOverlay.AppCompat.Light. The first variant will override all theme values like primaryColor and colorAccent, while the latter will simply overlay dark theme colors with their light variants.
For example, to produce a lightly colored sharing dialog, set the following as your pspdf__sharingDialogStyle:
<style name="MyApp.SharingDialogStyle" parent="ThemeOverlay.AppCompat.Light"> <item name="pspdf__backgroundColor">@color/pspdf__color_white</item> <item name="pspdf__errorColor">@color/pspdf__color_error</item></style>