Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/jacklam718/react-native-card-view

A react native card component
https://github.com/jacklam718/react-native-card-view

Last synced: about 1 month ago
JSON representation

A react native card component

Lists

README 

        
# React Native Card View

Only tested in IOS, but I think should works in Android too.



![Example](https://www.dropbox.com/s/44aildn3lhq9rik/react-native-card-view.gif?dl=1)







    



[Try it with Exponent](https://exp.host/@jacklam718/card-view-example)



## Install

npm install --save react-native-card-view



## Example

##### Detailed example



##### Quick example here

```javascript

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 Title

        

        

          Content

        

        

           {}}>

            Button 1

          

           {}}>

            Button 2

          

        

      

    );

  }

}



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

```javascript

const card      = {card: {width: 300, height: 300}};

const cardTitle = {cardTitle: {fontSize: 40}}



```