Skip to content

dondoko-susumu/react-native-card-media

Repository files navigation

react-native-card-media

Card Media component for React Native. Also supports multiple image layout.

single & double

single & double

three & four

three & four

five

five

Installation

npm install react-native-card-media --save

Examples

CardMediaExample

Usage

const files5 = [
  `${path}kids_play_640.jpeg`,
  `${path}road_640.jpg`,
  `${path}women_640.jpeg`,
  `${path}sea_kids_640.jpeg`,
  `${path}temple_640.jpeg`,
];

<CardMedia
  files={files5}
  style={{ height: 200 }}
  title="Title"
  showTitle={false}
  titleStyle={{ fontSize: 24, fontWeight: '400', lineHeight: 32, color: '#fafafa' }}
  onPress={(fileIndex) => this.onPress(fileIndex)}
  imageIconView={this.renderImageIconView}
  imageCountStyle={{ fontSize: 20, fontWeight: '500', lineHeight: 28, color: '#fafafa' }}
  imageTouchable={false}
/>

Props

Prop Description Type Default
files Media lists Array Required
style CardView style View Style Object undefined
title Title text is shown at below part of card String undefined
showTitle Title is shown or not Boolean true
titleStyle Title style View Style Object undefined
onPress Action is called when click in card
you can pass the file index as an argument
Function undefined
imageIconView Icon is shown near title Component undefined
imageCountStyle Icon style View Style Object undefined
imageTouchable Images in card is clickable or not Boolean true

License

MIT