Button is React Native's simplest, built-in button – styled to match the platform, but deliberately only minimally customizable.

1. Description

Button automatically renders the native look of the current platform (on iOS, e.g. blue text with no border; on Android, a filled, colored button) – in exchange, only the color prop can be customized, no custom style.

2. Short example

<Button title="Confirm" onPress={() => console.log('Confirmed!')} />

3. Complete project

npx create-expo-app button-demo
cd button-demo

import { useState } from 'react';
import { View, Text, Button, StyleSheet, Alert } from 'react-native';

export default function App() {
  const [confirmed, setConfirmed] = useState(false);

  function handleConfirm() {
    setConfirmed(true);
    Alert.alert('Success', 'Action was confirmed.');
  }

  return (
    <View style={styles.container}>
      <Text style={styles.status}>
        Status: {confirmed ? 'Confirmed ✓' : 'Pending'}
      </Text>
      <Button
        title="Confirm"
        color="#16a34a"
        onPress={handleConfirm}
        disabled={confirmed}
      />
    </View>
  );
}

const styles = StyleSheet.create({
  container: { flex: 1, justifyContent: 'center', alignItems: 'center', gap: 16 },
  status: { fontSize: 18 },
});

4. Explanation

• title – the required text on the button (unlike TouchableOpacity, there are no child elements, just this one string prop).
• color – the only way to customize appearance: text color on iOS, background color on Android.
• onPress – callback function, identical to all other touchable components.
• disabled – disables the button both visually AND functionally (no more onPress) when true.

5. Outputs