Skip to content

Instantly share code, notes, and snippets.

View iremlopsum's full-sized avatar
💻

Kristjan Vool iremlopsum

💻
View GitHub Profile
@iremlopsum
iremlopsum / AnimatedSvgMap.js
Created July 24, 2019 11:00
animatedSVGMap
import React, { PureComponent } from 'react'
import { View, StyleSheet, Animated, Easing } from 'react-native'
import { scale } from 'react-native-size-matters'
import Svg, { G, Path } from 'react-native-svg'
import withStore from '@new-redux/withStore'
import { Colors } from '../../../Values'
import { getCountryColor } from '../../../Helper/worldHelper'
import { VIEW_BOX, mapPathData } from '../svg-map-data'
import React, { PureComponent } from 'react'
import {
View,
StyleSheet,
Animated,
Easing,
TouchableOpacity,
Dimensions,
TextInput,
KeyboardAvoidingView,
import React, { PureComponent } from 'react'
import { View, StyleSheet, Animated, Easing } from 'react-native'
class App extends PureComponent {
animationValue = new Animated.Value(0)
componentDidMount() {
Animated.timing(this.animationValue, {
toValue: 1,
class App extends PureComponent {
getOutputValueForIndex = (index, expectedIndex, { prevValue, targetValue, nextValue, defaultValue }) => {
const delta = index - expectedIndex
switch (delta) {
case -1:
return prevValue
case 0:
return targetValue
case 1:
import React, { PureComponent } from 'react'
import {
View,
Text,
StatusBar,
StyleSheet,
TouchableOpacity,
} from 'react-native'
import Item from './Item'
const defaultOptions = {
transitionOptions: animatedValue => ({
opacity: animatedValue.interpolate({
inputRange: [0, 1, 2],
outputRange: [0, 1, .9],
}),
transform: [
{
translateX: animatedValue.interpolate({
inputRange: [0, 1, 2],
const defaultOptions = {
transitionOptions: animatedValue => ({
opacity: animatedValue.interpolate({
inputRange: [0, 1, 2],
outputRange: [0, 1, .9],
}),
transform: [
{
perspective: 2000
},
const defaultOptions = {
transitionOptions: animatedValue => ({
opacity: animatedValue.interpolate({
inputRange: [0, 1, 2],
outputRange: [0, 1, .9],
}),
transform: [
{
perspective: 2000
},
const config = { CardModal }
const defaultOptions = {
transitionOptions: animatedValue => ({
opacity: animatedValue.interpolate({
inputRange: [0, 1, 2],
outputRange: [0, 1, .9],
}),
transform: [
{
perspective: 2000
import React, { PureComponent } from 'react'
import { View, StyleSheet, TouchableOpacity, Animated, Dimensions, Easing, ActivityIndicator } from 'react-native'
import { Text, Emoji } from '@components'
const { width: ww, height: wh } = Dimensions.get('screen')
class ConfirmationActionSheet extends PureComponent {
state = {
active: false