MyButton Component

Installation

To use the MyButton component in your React Native project, follow these steps:

Install React Native if you haven't already:

java

Copy code npm install -g react-native-cli Create a new React Native project:

csharp

Copy code react-native init MyProject Copy the MyButton.js file into your project's component directory.

Usage To use the MyButton component, import it into your desired file and render it with the desired props. Here's an example:

javascript

Copy code

import React from 'react';
import { View } from 'react-native';
import MyButton from './components/MyButton';

const App = () => {
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <MyButton
        title="Click Me"
        onPress={() => {
          console.log('Button pressed!');
        }}
        // Customize the button's appearance by passing additional props
        height={50}
        width={150}
        bgColor="#3498db"
        margin={10}
        borderRadius={5}
        justify="center"
        align="center"
        textColor="#fff"
        textSize={18}
        textAlign="center"
        textWeight="bold"
      />
    </View>
  );
};

export default App;

Props

The MyButton component accepts the following props:

title (string, required): The text displayed on the button.

onPress (function, required): The callback function to be executed when the button is pressed.

height (number): The height of the button (default: 40).

width (number): The width of the button (default: 120).

bgColor (string): The background color of the button (default: '#e0e0e0').

margin (number): The margin around the button (default: 0).

borderRadius (number): The border radius of the button (default: 5).

justify (string): The justify content property of the button (default: 'center').

align (string): The align items property of the button (default: 'center').

textColor (string): The color of the button text (default: '#000').

textSize (number): The font size of the button text (default: 16).

textAlign (string): The text alignment of the button text (default: 'center').

textWeight (string): The font weight of the button text (default: 'normal').

Feel free to customize the component's props to suit your specific needs.

You can include this README file in your project's repository or any other appropriate location to provide documentation and usage instructions for the MyButton component.