Skip to content

Styling the dialog

maltaisn edited this page Jan 5, 2020 · 2 revisions

Many attributes are provided to style the dialog's views, colors, dimensions and styles.

Changing an attribute

You can change attribute in your app's styles.xml

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
    <item name="icdStyle">@style/CustomIconDialogStyle</item>
</style>

<!-- Your custom dialog style, don't forget to specify the parent style! -->
<style name="CustomIconDialogStyle" parent="IcdStyle">
    <item name="icdIconSize">72dp</item>
    <item name="icdIconColor">#FF0000</item>
    <item name="icdListHeaderStyle">@style/CustomHeaderStyle</item>
</style>

<!-- Custom style for the list headers, again don't forget the parent! -->
<style name="CustomHeaderStyle" parent="IcdListHeaderStyle">
    <item name="android:textAllCaps">true</item>
    <item name="android:typeface">monospace</item>
</style>

Parent style name is always the same as the attribute name, but starts with a capital letter. It's important to specify the parent, because the parent style might define some attributes that you don't.

Available attributes

Icon appearance attributes

  • icdIconSize: Icon size. Default is 50dp.
  • icdIconColor: Icon color when not selected. Default is @color/material_on_background_emphasis_medium.
  • icdSelectedIconColor: Icon color when selected. Default is ?attr/colorPrimary.
  • icdIconStyle: Style for the icon ImageViews.

Dialog attributes

  • icdMaxWidth: Dialog max width. Default is 400dp.
  • icdMaxHeight: Dialog max height. Default is 500dp.

View style attributes

  • icdListHeaderStyle: Style for category list headers. Sticky headers style should also be changed if this is changed.
  • icdListStickyHeaderStyle: Style for sticky headers. Unlike normal headers, they have no padding relative to the dialog, so the default style is only a wrapper around normal header style with extra padding.
  • icdSearchBarStyle: Style for the search EditText.
  • icdSearchIconStyle: Style for the search icon.
  • icdCancelSearchIconStyle: Style for the cancel search button.
  • icdNoResultLabelStyle: Style for the TextView shown when there are no results for search.
  • icdDialogButtonStyle: Style for the dialog's button.
  • icdDialogTitleStyle: Style for the dialog's title.
  • icdDialogListStyle: Style for the icon RecyclerView.
  • icdDividerDrawable: Drawable used as a divider for search, sticky headers and button bar.

Default values for styles can be found in styles.xml.