Function ButtonExample

example/src/Examples/IconButtonExample.tsx:9–198

()

import ScreenWrapper from '../ScreenWrapper';

const ButtonExample = () => {
  const { isV3 } = useExampleTheme();
  if (!isV3) {
    return (
      <ScreenWrapper contentContainerStyle={styles.v2Container}>
        <IconButton icon="camera" size={24} onPress={() => {}} />
        <IconButton
          icon="lock"
          size={24}
          iconColor={MD2Colors.green500}
          onPress={() => {}}
        />
        <IconButton icon="" size={24} onPress={() => {}} loading />
        <IconButton icon="camera" size={36} onPress={() => {}} />
        <IconButton
          icon="lock"
          size={36}
          onPress={() => {}}
          style={{ backgroundColor: MD2Colors.lightGreen200 }}
        />
        <IconButton icon="heart" size={60} onPress={() => {}} />
      </ScreenWrapper>
    );
  }

  return (
    <ScreenWrapper contentContainerStyle={styles.v3Container}>
      <List.Section title="Default">
        <View style={styles.row}>
          <IconButton icon="camera" size={24} onPress={() => {}} />
          <IconButton icon="camera" selected size={24} onPress={() => {}} />
          <IconButton icon="camera" disabled size={24} onPress={() => {}} />
          <IconButton icon="camera" size={24} onPress={() => {}} loading />
        </View>
      </List.Section>

      <List.Section title="Contained">
        <View style={styles.row}>
          <IconButton
            icon="camera"
            mode="contained"
            size={24}
            onPress={() => {}}
          />
          <IconButton
            icon="camera"
            mode="contained"
            selected
            size={24}
            onPress={() => {}}
          />
          <IconButton
            icon="camera"
            mode="contained"
            disabled
            size={24}
            onPress={() => {}}
          />