Comments (3)
Hi @alexvcasillas! Thanks for submitting the issue!
The main issue here is that you’re not transitioning between two similar elements - the second image HS a different aspect ratio which is something the Fluid Transitions library doesn’t have any knowledge about.
What you could do is to either change the aspect ratio of the images to be equal or (the more advanced solution) you could use the transition animation to drive the aspect ratio. You can read more about how this can be done using the animated property [here](url
https://github.com/fram-x/FluidTransitions/blob/develop/docs/Transition.md). There is also an example of how this is done in the example code [here](url
https://github.com/fram-x/FluidTransitions/blob/develop/Examples/src/AnimatedProperty.js).
from fluidtransitions.
Thank you so much @chrfalch !! I'll take a look at those docs and the example :)
from fluidtransitions.
Do that! I'll close this issue.
from fluidtransitions.
Related Issues (20)
- Update TransitionItemsView componentWillRecieveProps to use getDerivedStateFromProps
- Add support for React Navigation 4 HOT 18
- getting an exception error of unmount Transition shared key
- [question] Transition element on navigate HOT 1
- Does it support React-Native-Navigation
- Unable to modify duration/speed using <Transition> HOT 1
- Transition component's disappear prop does not work
- No header when using fluidNavigator HOT 5
- (0, _reactNavigationFluidTransitions.default) is not a function HOT 3
- React Navigation v4^ the navigation prop is missing for this navigator HOT 1
- get current transition route name
- [ShareElement] How can i zoom out the view container on List Image on share transition?
- Fluid Navigator Transition not working in iOS? HOT 1
- Can't get it to working. HOT 7
- Shared Element Transition - Works Only For One Way
- support react-navigation5 HOT 11
- How to solve the inaccurate moving distance caused by zooming while moving?
- Tab navigation
- typescript
- error message
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fluidtransitions.