Card
A card is a sheet of material that serves as an entry point to more detailed information.



Usage
import * as React from 'react';
import { Avatar, Button, Card, Text } from 'react-native-paper';
const LeftContent = props => <Avatar.Icon {...props} icon="folder" />
const MyComponent = () => (
<Card>
<Card.Title title="Card Title" subtitle="Card Subtitle" left={LeftContent} />
<Card.Content>
<Text variant="titleLarge">Card title</Text>
<Text variant="bodyMedium">Card content</Text>
</Card.Content>
<Card.Cover source={{ uri: 'https://picsum.photos/700' }} />
<Card.Actions>
<Button>Cancel</Button>
<Button>Ok</Button>
</Card.Actions>
</Card>
);
export default MyComponent;
Props
Type:
'elevated' | 'outlined' | 'contained'
Default value:
'elevated'
Mode of the Card.
elevated
- Card with elevation.contained
- Card without outline and elevation Available in v5.x with theme version 3outlined
- Card with an outline.
Type:
number
The number of milliseconds a user must touch the element before executing onLongPress
.
Type:
0 | 1 | 2 | 3 | 4 | 5 | Animated.Value
Default value:
1
Changes Card shadow and background on iOS and Android.
Type:
ThemeProp