Button

A button is component that the user can press to trigger an action.

Usage

import * as React from 'react';
import { Button } from 'react-native-paper';

const MyComponent = () => (
  <Button icon="add-a-photo" mode="contained" onPress={() => console.log('Pressed')}>
    Press me
  </Button>
);

export default MyComponent;

Props

mode

Type: 'text' | 'outlined' | 'contained'

Default value: 'text'

Mode of the button. You can change the mode to adjust the styling to give it desired emphasis.

text - flat button without background or outline (low emphasis)
outlined - button with an outline (medium emphasis)
contained - button with a background color and elevation shadow (high emphasis)

dark

Type: boolean

Whether the color is a dark color. A dark button will render light text and vice-versa. Only applicable for contained mode.

compact

Type: boolean

Use a compact look, useful for text buttons in a row.

color

Type: string

Custom text color for flat button, or background color for contained button.

loading

Type: boolean

Whether to show a loading indicator.