Images.

Avatars

Avatars(circular image representing a person) which is a more user friendly way to present an image.

Rounded image view

Creating a ciruclar avatar in android studio programatically.

Java code to create ciruclar icons.

Overlaying text or icons on an Image.

Example:

Example of text and icon ion top of an image.

The text and icon is clearly visible for dark images but if lighter images are used the text and icons won’t be legible.

Therefore for the icon we can use a subtle shadow to separate it from the background even when background image is the same color as the text.

For the text, we use a scrim (a semi-transparent layer between the image and the text which then provides contrast and legibility.

It will fade from 30% black to completey transparent to the center and the top.

We now declare the xml and stack the three views in a frame layout as illustrated in the image below.

This wil ensure legibility of text you place on top of your image