在React Native中创建具有动态背景颜色的按钮

import React, { useState } from 'react';
import { View, TouchableOpacity, StyleSheet } from 'react-native';

const DynamicButton = () => {
  const [backgroundColor, setBackgroundColor] = useState('blue');

  return (
    <View style={styles.container}>
      <TouchableOpacity
        style={[styles.button, { backgroundColor }]}
        onPress={() => setBackgroundColor(getRandomColor())}
      />
    </View>
  );
};

const getRandomColor = () => {
  const letters = '0123456789ABCDEF';
  let color = '#';
  for (let i = 0; i < 6; i++) {
    color += letters[Math.floor(Math.random() * 16)];
  }
  return color;
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  button: {
    width: 200,
    height: 50,
    borderRadius: 10,
  },
});