Image
Drop-in replacement for the standard React Native Image component that displays images with a placeholder and smooth image load transitioning.
Usage
import { ActivityIndicator } from 'react-native';
import { Image } from 'react-native-elements';
// Standard Image
<Image
source={{ uri: image }}
style={{ width: 200, height: 200 }}
/>
// Image with custom placeholder content
<Image
source={{ uri: image }}
style={{ width: 200, height: 200 }}
PlaceholderContent={<ActivityIndicator />}
/>
Props
Also receives all React Native Image props
Contains all React Native Image methods.
Reference
onLongPress
Callback function when long pressing component
Type | Default |
---|---|
function | none |
onPress
Callback function when pressing component
Type | Default |
---|---|
function | none |
containerStyle
Additional styling for the container (optional)
Type | Default |
---|---|
View style (object) | none |
placeholderStyle
Additional styling for the placeholder container (optional)
Type | Default |
---|---|
View style (object) | none |
transition
Perform fade transition on image load
Type | Default |
---|---|
boolean | true |
ImageComponent
Specify a different component as the Image component.
Type | Default |
---|---|
React Native Component | Image |
PlaceholderContent
Content to render when image is loading.
Type | Default |
---|---|
component | none |