> 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/annotation/customize-color-picker.md).
# Customize annotation style editor in Android
Learn how to customize the AnnotationStyleDialogFragment in Android using styles and ToolManagerBuilder. Customize color picker, preset annotations, and icon picker with Android styles. Follow step-by
The [`AnnotationStyleDialogFragment`](/android/annotation/style-editor-dialog.md) can be customized using Android styles or with `ToolManagerBuilder`, depending on the specific property that needs to be customized.
Android styles are used to [customize the color picker](https://docs.apryse.com), [preset annotations](https://docs.apryse.com), and [icon picker](https://docs.apryse.com).
`ToolManagerBuilder` is used to [customize the annotation style dialog properties](https://docs.apryse.com).
## Customize standard colors in color picker
Standard colors are colors presented in the grid layout of the color picker.
To change these colors, you can override the standard color list as follows:
1. In the `res/values/arrays.xml` file of your project, define a `string-array` containing your custom color list:
{% tabs %}
{% tab title="XML" %}
{% code lineNumbers="true" %}
```xml
- #f1a099
- #ffc67b
- #ffe6a2
- #80e5b1
- #92e8e8
- #a6a1e6
- #e2a1e6
```
{% endcode %}
{% endtab %}
{% endtabs %}
1. In your `res/values/styles.xml` file, define your own style and inherit `PresetColorGridViewStyle`, then set your color list `custom_standard_colors` to the `color_list` attribute:
{% tabs %}
{% tab title="XML" %}
{% code lineNumbers="true" %}
```xml
```
{% endcode %}
{% endtab %}
{% endtabs %}
1. Finally, set your customized style `CustomPresetColorGridStyle` to the `preset_colors_style` attribute in your application's theme:
{% tabs %}
{% tab title="XML" %}
{% code lineNumbers="true" %}
```xml
```
{% endcode %}
{% endtab %}
{% endtabs %}
{% hint style="info" %}
**To learn more about applying your custom theme to an application, see: Styles and Themes.**
{% endhint %}
## Customize the annotation preset styles
An annotation preset style defines a group of annotation style attributes. Presets allow users to conveniently change the annotation's appearance with only one tap. You can override existing annotation presets and define your own in your app.
In this tutorial you will implement custom annotation presets for `Text`(sticky note) annotations.
1. In the `res/values/styles.xml` file of your project, create a series of customized annotation styles. For more detail on annotation style attributes, see tool style attributes.
{% tabs %}
{% tab title="XML" %}
{% code lineNumbers="true" %}
```xml
```
{% endcode %}
{% endtab %}
{% endtabs %}
1. In the `res/values/arrays.xml` file of your project, define an `array` containing your customized presets:
{% tabs %}
{% tab title="XML" %}
{% code lineNumbers="true" %}
```xml
- @style/CustomPresetStyle1
- @style/CustomPresetStyle2
- @style/CustomPresetStyle3
- @style/CustomPresetStyle4
```
{% endcode %}
{% endtab %}
{% endtabs %}
1. In the application theme, set your `custom_presets` array to the `sticky_note_presets` attribute:If you want to change the presets for a different annotation type, refer to the [attribute presets table](https://docs.apryse.com) to find the appropriate attribute.
{% tabs %}
{% tab title="XML" %}
{% code lineNumbers="true" %}
```xml
```
{% endcode %}
{% endtab %}
{% endtabs %}
### Attribute presets table
| Preset attribute | Annotation type | Default presets preview |
| --------------------------------- | ---------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `R.attr.free_text_presets` | `FreeText` |  |
| `R.attr.freehand_presets` | `Ink` |  |
| `R.attr.line_presets` | `Line` and `Arrow` |  |
| `R.attr.link_presets` | `Link` |  |
| `R.attr.oval_presets` | `Circle` |  |
| `R.attr.rect_presets` | `Square` |  |
| `R.attr.signature_presets` | `Signature` |  |
| `R.attr.highlight_presets` | `Highlight` |  |
| `R.attr.squiggly_presets` | `Squiggly` |  |
| `R.attr.strikeout_presets` | `StrikeOut` |  |
| `R.attr.underline_presets` | `Underline` |  |
| `R.attr.sticky_note_presets` | `Text`(sticky note) |  |
| `R.attr.callout_presets` | `Callout` |  |
| `R.attr.ruler_presets` | `Ruler` |  |
| `R.attr.polyline_presets` | `Polyline` |  |
| `R.attr.polygon_presets` | `Polygon` |  |
| `R.attr.cloud_presets` | `Cloud` |  |
| `R.attr.free_highlighter_presets` | `Free Highlighter` |  |
| `R.attr.widget_presets` | `Widget` |  |
| `R.attr.other_presets` | other annotation types |  |
## Customize the icon picker
The icon picker for `Text`(sticky note) annotations allows users to choose their own icon:
Below is the list of icons available for `Text`(sticky note) annotations:
### Default icons table
| Icon name | Icon |
| ------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Comment |  |
| Help |  |
| InsertCaret |  |
| Star |  |
| LightBulb |  |
| NewParagraph |  |
| CrossMark |  |
| CheckMark |  |
| LocationPin |  |
| ThumbsUp |  |
You can also create your own list by using the icons above:
1. To change the icon list, first define a string array list in your `res/values/arrays.xml` file. Each item in the list represents the icon name defined in the table above.
{% tabs %}
{% tab title="XML" %}
{% code lineNumbers="true" %}
```xml
- Help
- InsertCaret
```
{% endcode %}
{% endtab %}
{% endtabs %}
1. Then, set your `custom_icons` array to the `sticky_note_icons` attribute in your application theme:
{% tabs %}
{% tab title="XML" %}
{% code lineNumbers="true" %}
```xml
```
{% endcode %}
{% endtab %}
{% endtabs %}
If you want to add a custom icon to the sticky note icon picker, please refer to \[this guide]\(/android/guides/cookbook/customize-sticky-note-icon) for more details.
Hide properties in the annotation style dialog By default, each annotation type will contain it's own set of annotation style properties. You can hide these defined properties by using \`ToolManagerBuilder\` as follows:
{% tabs %}
{% tab title="Java" %}
{% code lineNumbers="true" %}
```java
ToolManagerBuilder tmBuilder = ToolManagerBuilder.from()
// Hide font and preset properties in the annotation
// style dialog for Free Text annotation
.addAnnotStyleProperty(new AnnotStyleProperty(Annot.e_FreeText)
.setCanShowFont(false) .setCanShowPreset(false) )
.setUseDigitalSignature(false)
.setAutoResizeFreeText(false);
```
{% endcode %}
{% endtab %}
{% endtabs %}
If the property is not defined for a annotation type (for example font property is not defined for rectangle annotations), setting the `CanShow` property will not do anything.
---
# 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/annotation/customize-color-picker.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.