react-animated-views icon indicating copy to clipboard operation
react-animated-views copied to clipboard

Should be able to accept custom animations

Open devgeeks opened this issue 9 years ago • 1 comments

Not sure what these should look like. Maybe as simple as four sets of styles (as style objects)?

  • current component start
  • current component end
  • next component start
  • next component end

devgeeks avatar Apr 29 '16 03:04 devgeeks

maybe something like...

{
    current: {
        start: {
            transform: 'translate(0, 0)',
        },
        end: {
            transform: 'translate(-20%, 0)',
            transition: 'transform .4s ease-out'
        }
    },
    next: {
        start: {
            transform: 'translate(100%, 0)',
        },
        end: {
            transform: 'translate(0, 0)',
            transition: 'transform .4s ease-out',
        }
    }
}

The biggest problem is that the built-in animation functions have 8 style permutations. However, in practice, the back animations are just the other 4 in reverse.

devgeeks avatar Apr 29 '16 03:04 devgeeks