src/views/assessment/components/buttons/DrawButton.js
import React from 'react';
import {StyleSheet} from 'react-native';
import BaseDrawingButton from './BaseDrawingButton';
import PenIconSvgr from '../../../../assets/iconsSvgr/PenIconSvgr';
import {ButtonPosition} from '../../../../utils/DimensionsConstants';
/**
* The button clicked when activating the pen.
* @param {Object} props - Properties
* @param {ButtonPosition} props.position - Positioning of the button
* @param {string} props.fillColor - Color to fill the tip of the pen
* @param {function} props.onPress - Action for the button
* @returns {Object} The button clicked when activating the pen
*/
export default function DrawButton(props) {
// Retrieve props
const position = props.position;
const fillColor = props.fillColor; // the icon of the pen takes this color
const onPressAction = props.onPress;
return (
<BaseDrawingButton position={position} onPress={onPressAction}>
<PenIconSvgr style={styles.icon} fillColor={fillColor} />
</BaseDrawingButton>
);
}
/**
* Local styles
* @type {Object}
*/
const styles = StyleSheet.create({
icon: {
flex: 1,
width: '100%',
height: '100%',
},
});