Nativebase logo
NativeBase
Data Display
Typography
Disclosure
Media and Icons
Others
Image
Generic Image components from .
Show Code
Playground
Implements
You can use all props of React native Image.
Examples
Basic
Playground
Sizes
Playground
Border Radius
Playground
Fallback
Playground
Basic (With Ref)
Playground
Props
source
specify a source for image.
alt
The alt text that describes the image. This will be added as accessibilityLabel in android/iOS and alt on web
Type: string
fallbackSource
In event there was an error loading the src, specify a fallback source.
ignoreFallback
Opt out of the fallbackSource logic and show alternative text
Type: boolean
_alt
Text styling for alt.
fallbackElement
In event there was an error loading the src, specify a fallback JSX Element.
Type: Element | Element[]
src
specify a source for image.
Type: string
Note
With Next's require statement
When using require statement from next for image keep this in mind.
Copy
const img = require('/public/me.jpg');
// DO ✔
<Image
source={{ uri: img.default.src }}
width={500}
height={500}
/>
// DON'T ✘
<Image
source={img}
width={500}
height={500}
/>
Nativebase logo
MadeWithNativeBase