diff --git a/lib/BaseInput.js b/lib/BaseInput.js index 52ca367..4820803 100644 --- a/lib/BaseInput.js +++ b/lib/BaseInput.js @@ -107,7 +107,7 @@ export default class BaseInput extends Component { toValue: isActive ? 1 : 0, duration: animationDuration, easing, - useNativeDriver, + useNativeDriver: useNativeDriver || false, }).start(); } diff --git a/lib/Jiro.js b/lib/Jiro.js index d47d394..758b9ba 100644 --- a/lib/Jiro.js +++ b/lib/Jiro.js @@ -1,5 +1,5 @@ -import React from 'react'; -import PropTypes from 'prop-types'; +import React from "react"; +import PropTypes from "prop-types"; import { Animated, Easing, @@ -8,9 +8,9 @@ import { TouchableWithoutFeedback, View, StyleSheet, -} from 'react-native'; +} from "react-native"; -import BaseInput from './BaseInput'; +import BaseInput from "./BaseInput"; export default class Jiro extends BaseInput { static propTypes = { @@ -20,7 +20,7 @@ export default class Jiro extends BaseInput { }; static defaultProps = { - borderColor: 'red', + borderColor: "red", inputPadding: 16, height: 48, }; @@ -45,12 +45,14 @@ export default class Jiro extends BaseInput { toValue: animationValue, eaasing: Easing.bezier(0.2, 1, 0.3, 1), duration: 200, + useNativeDriver: false, } ); const borderHeightAnimation = Animated.timing(this.state.borderHeightAnim, { toValue: animationValue, eaasing: Easing.ease, duration: 200, + useNativeDriver: false, }); const labelPositionAnimation = Animated.timing( this.state.labelPositionAnim, @@ -58,6 +60,7 @@ export default class Jiro extends BaseInput { toValue: animationValue, eaasing: Easing.ease, duration: 200, + useNativeDriver: false, } ); @@ -135,7 +138,7 @@ export default class Jiro extends BaseInput { onBlur={this._onBlur} onChange={this._onChange} onFocus={this._onFocus} - underlineColorAndroid={'transparent'} + underlineColorAndroid={"transparent"} /> - - {label} - + {label} @@ -162,24 +166,24 @@ export default class Jiro extends BaseInput { const styles = StyleSheet.create({ labelContainer: { - position: 'absolute', - backgroundColor: 'transparent', + position: "absolute", + backgroundColor: "transparent", }, label: { fontSize: 13, - fontWeight: 'bold', - color: '#6a7989', + fontWeight: "bold", + color: "#6a7989", }, textInput: { - position: 'absolute', + position: "absolute", bottom: 0, padding: 0, - color: 'black', + color: "black", fontSize: 18, - fontWeight: 'bold', + fontWeight: "bold", }, border: { - position: 'absolute', + position: "absolute", bottom: 0, left: 0, right: 0,