import React, { Component } from 'react';
import { Image } from 'react-native';
import {
Container, Header, Title, Content, Footer,
FooterTab, Button, Left, Right, Body, Icon, Text,
Accordion, Card, CardItem, Thumbnail, ListItem,
CheckBox, DatePicker, DeckSwiper, View,
} from 'native-base';
const cards = [
{
text: 'Card One',
name: 'One',
image: require('./image/1.jpg'),
},
{
text: 'Card Two',
name: 'Two',
image: require('./image/2.jpg'),
},
{
text: 'Card Three',
name: 'Three',
image: require('./image/3.jpg'),
},
]
export default class App extends Component {
constructor(props) {
super(props);
this.state = {
};
}
render() {
return (
<Container>
<Header>
<Body>
<Title>DeckSwiper</Title>
</Body>
</Header>
<View>
<DeckSwiper
dataSource={cards}
renderItem={item =>
<Card style={{ elevation: 3 }}>
<CardItem>
<Left>
<Thumbnail source={item.image} />
<Body>
<Text>{item.text}</Text>
<Text note>NativeBase</Text>
</Body>
</Left>
</CardItem>
<CardItem cardBody>
<Image style={{ height: 300, flex: 1 }} source={item.image} />
</CardItem>
<CardItem>
<Icon name="heart" style={{ color: '#ED4A6A' }} />
<Text>{item.name}</Text>
</CardItem>
</Card>
}
/>
</View>
</Container>
);
}
}
No comments:
Post a Comment