React Native Card View
Only tested in IOS, but I think should works in Android too.
Install
npm install --save react-native-card-view
Example
Detailed example
Quick example here
import React, {Component} from 'react'; import { StyleSheet } from 'react-native'; import { Card, CardImage, CardTitle, CardContent, CardAction } from 'react-native-card-view'; import Button from 'react-native-button'; Class Example extends Component { render () { return ( <Card> <CardTitle> <Text style={styles.title}>Card Title</Text> </CardTitle> <CardContent> <Text>Content</Text> </CardContent> <CardAction > <Button style={styles.button} onPress={() => {}}> Button 1 </Button> <Button style={styles.button} onPress={() => {}}> Button 2 </Button> </CardAction> </Card> ); } } const styles = StyleSheet.create({ title: { fontSize: 38, backgroundColor: 'transparent' }, button: { marginRight: 10 } });
Override Component Styles
You can use you own style to override the following components style
- Card
- CardImage
- CardTitle
- CardContent
- CardAction
You just pass the stytomles as an object and the key same as the component name
Just like the following
const card = {card: {width: 300, height: 300}}; const cardTitle = {cardTitle: {fontSize: 40}} <Card styles={card}></Card> <CardTitle styles={cardTitle}></CardTitle>