circle_component.js 1.06 KB
import React, { Component } from 'react';
import {
    TouchableOpacity,
    Text,
    StyleSheet,
} from 'react-native';

export default class LoginButton extends Component {
    constructor(props) {
        super(props);
        this.state={
            title : '',
        }
    }

    static defaultProps = {
        title : '',
        onPress: () => null,
    }

    render() {
        return (
            <TouchableOpacity
                style={styles.button}
                onPress={this.props.onPress}
            >
                <Text style={styles.title}>{this.props.title}kg</Text>
            </TouchableOpacity>
        )
    }
}

const styles = StyleSheet.create({
    button: {
        alignSelf: 'center',
        padding: 10,
        width: 200,
        height: 200,
        borderRadius : 100,
        marginTop : 30, 
        justifyContent : "center",
        alignItems : "center",
        borderWidth : 10,
        borderColor:"#0066cc"

    },
    title: {
        fontSize: 30,
        textAlign: 'center',
        textAlignVertical : 'center',
    },
});