Skip to content

Avatar Primitive

An image component featuring an alternative representation for depicting the user.

Installation

Install the component via your command line.

Terminal window
npx expo install @rn-primitives/avatar

Usage

import * as AvatarPrimitive from '@rn-primitives/avatar';
const GITHUB_AVATAR_URI = 'https://github.com/mrzachnugent.png';
function Example() {
return (
<AvatarPrimitive.Root alt="Zach Nugent's Avatar">
<AvatarPrimitive.Image source={{ uri: GITHUB_AVATAR_URI }} />
<AvatarPrimitive.Fallback>
<Text>ZN</Text>
</AvatarPrimitive.Fallback>
</AvatarPrimitive.Root>
);
}

Props

Root

Extends View props

PropTypeNote
alt *string
asChildboolean(optional)

Image

Extends Image props except alt

PropTypeNote
asChildboolean(optional)

Fallback

Extends View props

PropTypeNote
asChildboolean(optional)