Logo

Dialog.Icon

Available in v5.x with theme version 3

A component to show an icon in a Dialog.

Usage

import * as React from 'react';
import { StyleSheet } from 'react-native';
import { Paragraph, Dialog, Portal } from 'react-native-paper';

const MyComponent = () => {
  const [visible, setVisible] = React.useState(false);

  const hideDialog = () => setVisible(false);

  return (
    <Portal>
      <Dialog visible={visible} onDismiss={hideDialog}>
        <Dialog.Icon icon="alert" />
        <Dialog.Title style={styles.title}>This is a title</Dialog.Title>
        <Dialog.Content>
          <Paragraph>This is simple dialog</Paragraph>
        </Dialog.Content>
      </Dialog>
    </Portal>
  );
};

const styles = StyleSheet.create({
  title: {
    textAlign: 'center',
  },
})

export default MyComponent;

Props

Type: string

Custom color for action icon.

Type: IconSource

Name of the icon to show.

Type: number
Default value: 24

Optional icon size.

Edit this page