Google is committed to advancing racial equity for Black communities. See how.

ImageCardView

open class ImageCardView : BaseCardView
kotlin.Any
   ↳ android.view.View
   ↳ android.view.ViewGroup
   ↳ android.widget.FrameLayout
   ↳ androidx.leanback.widget.BaseCardView
   ↳ androidx.leanback.widget.ImageCardView

A subclass of BaseCardView with an ImageView as its main region. The ImageCardView is highly customizable and can be used for various use-cases by adjusting the ImageViewCard's type to any combination of Title, Content, Badge or ImageOnly.

Styling

There are two different ways to style the ImageCardView.
No matter what way you use, all your styles applied to an ImageCardView have to extend the style R.style#Widget_Leanback_ImageCardViewStyle.

Example:

<code>&lt;style name="CustomImageCardViewStyle" parent="Widget.Leanback.ImageCardViewStyle"&gt;
        &lt;item name="cardBackground"&gt;#F0F&lt;/item&gt;
        &lt;item name="lbImageCardViewType"&gt;Title|Content&lt;/item&gt;
   &lt;/style&gt;
   &lt;style name="CustomImageCardTheme" parent="Theme.Leanback"&gt;
        &lt;item name="imageCardViewStyle"&gt;@style/CustomImageCardViewStyle&lt;/item&gt;
        &lt;item name="imageCardViewInfoAreaStyle"&gt;@style/ImageCardViewColoredInfoArea&lt;/item&gt;
        &lt;item name="imageCardViewTitleStyle"&gt;@style/ImageCardViewColoredTitle&lt;/item&gt;
    &lt;/style&gt;</code>

The first possibility is to set custom Styles in the Leanback Theme's attributes imageCardViewStyle, imageCardViewTitleStyle etc. The styles set here, is the default style for all ImageCardViews.

The second possibility allows you to style a particular ImageCardView. This is useful if you want to create multiple types of cards. E.g. you might want to display a card with only a title and another one with title and content. Thus you need to define two different ImageCardViewStyles and two different themes and apply them to the ImageCardViews. You can do this by using a the ImageCardView(Context) constructor and passing a ContextThemeWrapper with the custom ImageCardView theme id.

Example (using constructor):

<code>new ImageCardView(new ContextThemeWrapper(context, R.style.CustomImageCardTheme));
  </code>

You can style all ImageCardView's components such as the title, content, badge, infoArea and the image itself by extending the corresponding style and overriding the specific attribute in your custom ImageCardView theme.

Components

The ImageCardView contains three components which can be combined in any combination:
  • Title: The card's title
  • Content: A short description
  • Badge: An icon which can be displayed on the right or left side of the card.
In order to choose the components you want to use in your ImageCardView, you have to specify them in the lbImageCardViewType attribute of your custom ImageCardViewStyle. You can combine the following values: Title, Content, IconOnRight, IconOnLeft, ImageOnly.

Examples:

<code>&lt;style name="CustomImageCardViewStyle" parent="Widget.Leanback.ImageCardViewStyle"&gt;
        ...
        &lt;item name="lbImageCardViewType"&gt;Title|Content|IconOnLeft&lt;/item&gt;
        ...
    &lt;/style&gt;</code>
<code>&lt;style name="CustomImageCardViewStyle" parent="Widget.Leanback.ImageCardViewStyle"&gt;
        ...
        &lt;item name="lbImageCardViewType"&gt;ImageOnly&lt;/item&gt;
        ...
    &lt;/style&gt;</code>
androidx.leanback.R.attr#imageCardViewStyle androidx.leanback.R.attr#lbImageCardViewType androidx.leanback.R.attr#imageCardViewTitleStyle androidx.leanback.R.attr#imageCardViewContentStyle androidx.leanback.R.attr#imageCardViewBadgeStyle androidx.leanback.R.attr#imageCardViewImageStyle androidx.leanback.R.attr#imageCardViewInfoAreaStyle

Summary

Constants
static Int

static Int

static Int

static Int

static Int

Inherited constants
Public constructors
<init>(context: Context!, themeResId: Int)

Create an ImageCardView using a given theme for customization.

<init>(context: Context!, attrs: AttributeSet!, defStyleAttr: Int)

<init>(context: Context!)

<init>(context: Context!, attrs: AttributeSet!)

Public methods
open Drawable!

Returns the badge image drawable.

open CharSequence!

Returns the content text.

open Drawable!

Returns the info area background drawable.

open Drawable!

Returns the ImageView drawable.

ImageView!

Returns the main image view.

open CharSequence!

Returns the title text.

open Boolean

open Unit
setBadgeImage(drawable: Drawable!)

Sets the badge image drawable.

open Unit

Sets the content text.

open Unit

Sets the info area background drawable.

open Unit
setInfoAreaBackgroundColor(@ColorInt color: Int)

Sets the info area background color.

open Unit
setMainImage(drawable: Drawable!)

Sets the image drawable with fade-in animation.

open Unit
setMainImage(drawable: Drawable!, fade: Boolean)

Sets the image drawable with optional fade-in animation.

open Unit

Enables or disables adjustment of view bounds on the main image.

open Unit
setMainImageDimensions(width: Int, height: Int)

Sets the layout dimensions of the ImageView.

open Unit

Sets the ScaleType of the main image.

open Unit

Sets the title text.

Protected methods
open Unit

open Unit

Inherited functions