v1.0.63

Image

Wrapper around Image of react-native

See it on Snack

Copy
import { Image } from "react-native-magnus";

<Image
  h={100}
  w={100}
  m={10}
  rounded="circle"
  source={{
    uri:
      "https://images.unsplash.com/photo-1593642532400-2682810df593?ixid=MXwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60",
  }}
/>;

Props


All props of Image of react-native are available for this component.

Property Description Type Default
m margin string | number -
mt margin top string | number -
mr margin right string | number -
mb margin bottom string | number -
ml margin margin left string | number -
mx margin horizonal string | number -
my margin vertical string | number -
p padding string | number -
pt padding top string | number -
pr padding right string | number -
pb padding bottom string | number -
pl padding margin left string | number -
px padding horizonal string | number -
py padding vertical string | number
h height number -
w width number -
minH minimum width number -
minW minimum height number -
rounded border radius string | number none
roundedTop border radius top string | number none
roundedBottom border radius bottom string | number none
roundedLeft border radius left string | number none
roundedRight border radius right string | number none
borderColor color for border string -
borderTopColor color for border top string -
borderRightColor color for border right string -
borderLeftColor color for border left string -
borderBottomColor color for border bottom string -
borderWidth width for border number -
borderTopWidth width for border top number -
borderRightWidth width for border right number -
borderLeftWidth width for border left number -
borderBottomWidth width for border bottom number -
rounded border radius any -