App.js

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 *
 * @format
 * @flow
 */

import React, { Component } from "react";
import { View, Image, TouchableOpacity } from "react-native";

const snap = require("./thanos_snap.png");

export default class App extends Component {
    constructor(props) {
        super(props);
        this.state = {
            currentIndex: 0,
            isAnimating: false
        };
    }

    thanosSnap = () => {
        if (!this.state.isAnimating) {
            const that = this;
            that.setState({ isAnimating: true });
            let x = 0;
            const id = setInterval(() => {
                if (++x == 48) {
                    window.clearInterval(id);
                    that.setState({ isAnimating: false, currentIndex: 0 });
                } else {
                    that.setState({ currentIndex: x });
                }
            }, 40);
        }
    };

    render() {
        return (
            <View style={styles.container}>
                <TouchableOpacity onPress={this.thanosSnap}>
                    <View style={{ width: 80, height: 80, overflow: "hidden" }}>
                        <Image
                            source={snap}
                            style={{
                                width: 3840,
                                height: 80,
                                transform: [
                                    { translateX: this.state.currentIndex * -80 }
                                ]
                            }}
                        />
                    </View>
                </TouchableOpacity>
            </View>
        );
    }
}