Skip to content

Instantly share code, notes, and snippets.

krissanawat101 krissnawat

Block or report user

Report or block krissnawat

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View 26-animation-replace.js
render() {
const { title, message, showNotification } = this.props;
showNotification
? this.animateNotification(0)
: this.animateNotification(-80);
return (
<Animated.View
style={[{ marginBottom: this.positionValue }, styles.wrapper]}
>
<View style={styles.notificationContent}>
View import-animate-component.js
import {
View,
Text,
TouchableOpacity,
StyleSheet,
Animated,
Easing
} from "react-native";
View 25-construct-animation.js
export default class Notification extends Component {
constructor(props) {
super(props);
this.positionValue = new Animated.Value(-80);
}
animateNotification = value => {
Animated.timing(this.positionValue, {
toValue: value,
duration: 300,
velocity: 3,
View 24-change-background-color.js
render() {
const { formValid } = this.state;
const showNotification = formValid ? false : true;
const bgColor = formValid ? colors.green01 : colors.darkOrange;
return (
<KeyboardAvoidingView
style={[{ backgroundColor: bgColor }, styles.wrapper]}
behavior="padding"
>
View 22-assign-error-message.js
<Notification
showNotification={showNotification}
handleCloseNotification={this.handleCloseNotification}
title="Error"
message={this.state.error}
/>
View 23-switch-state.js
constructor() {
super();
this.state = {
user: null,
email: "",
password: "",
formValid: true,
error: ""
};
View 20-activate-notification-bar.js
Login = () => {
firebase
.auth()
.signInWithEmailAndPassword(this.state.email, this.state.password)
.then(user => {
this.setState({ user });
console.log(user);
})
.catch(error =>
this.setState({ error: error.message, formValid: false })
View 19-hide-notification-with-close-button.js
constructor() {
super();
this.state = {
user: null,
email: "",
password: "",
formValid: true,
error: ""
};
View 18-set-marginBottom.js
render() {
const { title, message, showNotification } = this.props;
const bottom = showNotification ? -80 : 0;
return (
<View style={[{ marginBottom: bottom }, styles.wrapper]}>
<View style={styles.notificationContent}>
<Text style={styles.title}>{title}</Text>
<Text style={styles.messsage}>{message}</Text>
</View>
View 17-showNotification.js
<Notification
showNotification={showNotification}
handleCloseNotification={this.handleCloseNotification}
title="Error"
message="Those credentials don't look right please try agiain"
/>
You can’t perform that action at this time.