@muhzi/react-native-user-avatar
v1.0.7
React native user avatar component with progressive loading and text fallback support
0/weekUpdated 3 years agoMITUnpacked: 10.7 KB
Published by Muhsin.k
npm install @muhzi/react-native-user-avatar
react-native-user-avatar
A react native user avatar component with progressive loading and text fallback support.
$3
You can find Snack expo example here
$3
``sh`
npm install @muhzi/react-native-user-avatar
#OR
yarn add @muhzi/react-native-user-avatar
$3
`js`
import UserAvatar from "@muhzi/react-native-user-avatar";
Simply place a component.
`js``
size={80}
backgroundColor="#0be881"
src="https://images.pexels.com/photos/4403924/pexels-photo-4403924.jpeg"
active
/>
$3
| Name | Default | Type | Description |
|---|---|---|---|
| userName | - | String | The user name that will be used to compute user initials. |
| initialName | - | String | Force the displayed initials by overriding the computed ones. |
| src | - | String | Path of image. |
| active | false | Boolean | Whether the user is active or not.(Show active circle around avatar) |
| textColor | #FFFF | String | The font color used to render the user initials |
| activeCircleColor | #27ae60 | String | Background color active circle |
| size | 64 | Number | The avatar size |
| rounded | true | Boolean | True if the avatar must be rounded. |
| loaderColor | #aaa69d | String | The color of loader |
| backgroundColor | - | String | The avatar background color to use if no image is provided |
| backgroundColors | ['#575fcf', '#ef5777', '#0be881'] | Array | Array of background colors to choose from, if no background color is specified |