Horizontal scroll animations in React Native – codeburst

  • Horizontal scroll animations in React NativeLink Animated with ScrollView to create a nice navigation UI animation in React NativeWhat we will be buildingRN lets you build a nice and smooth UIWhat you will needReact NativeSimulatorNo third party libraries required :)Creating Screen component with AnimatedFirst, import Animated, Dimensions, ScrollView, StyleSheet, Text, View from “react-native” .
  • Next, create a component that will be treated as a screen or a view.We are using Animated.View here because we are going to animate that wrapper component.That width ofscrollPage style and are important because we are going to interpolate horizontal scrolling values to multiple animation values.
  • In other words, we are going to track where the screen is and animate the screen component based on that value.It’s one of the things that are tricky to explain in words, but it is the key concept to understand for this to work.Basically, we link animations based on the…
  • When the scroll position is at 150, first screen is half way done exiting, and the second screen is half way done entering.Adding animationsSince they are all set up, it is time to write the animations.
  • You would have to write a different inputRange since FlatList removes items that scroll way off screen.I think this is pretty neat UI animation that’s pretty simple to use.

That width ofscrollPage style and transitionAnimation(props.index) are important because we are going to interpolate horizontal scrolling values to multiple animation values. In other words, we are…
Continue reading “Horizontal scroll animations in React Native – codeburst”

10 Amazing Apps that are Built using React Native

10 amazing #mobileapps that are built using #ReactNative.

  • Before team Bloomberg adopted React Native for their mobile app development, they had to spend significant time in developing and updating the versions of iOS and Android app individually.
  • Although React Native covers a small part of this app, it adds a significant experience for the users in terms of UI and UX.
  • Their iOS and Android apps share 98% of the code, which is an amazing example of how React Native can help in cross-platform app development.
  • The examples shared above elucidates that React Native has got potential for mobile app development, with any scale, any idea, with any type of content.
  • If you too have an app idea that this amazing technology can do justice to, check out more about our React Native development services.

React Native use modern web techniques for mobile app development. Here is a list of 10 amazing apps that are built using React Native technology.
Continue reading “10 Amazing Apps that are Built using React Native”