Hi friends, This is essentially a continuation of this post http://www.coderzheaven.com/2018/08/10/how-to-create-a-custom-native-imageview-in-android-for-reactnative/ Now we will listen to a click event from the image we just created. For that we have to add the ClickListener to the image in Android. Add below methods to the java class On the React Native Side The whole java class will look like this.
We will create different styles to style different components, correct? And most of them will have duplicate elements, correct? What are the disadvantages of this problem? You will clutter your file with duplicate lines of code. It will increase the file size and increase the application size. Not very efficient way of coding. Limited reusability. How to fix… Read More »
Many times we need custom components from native. Here is a simple example on how to create a custom imageview in Android for react native. First we will start with the Android Version Android Create a class that extends SimpleViewManager. Write a setSrc method which accepts the source url from React Native. Implement ‘createViewInstance’ method in which you… Read More »
So how do we normally monitor all the operations in a react native applications. All the networks, redux state etc. So you will need a plugin/package for this. Its called Reactotron. Here is the github page for Reactotron. What is Reactotron? A macOS, Windows, and Linux app for inspecting your React JS and React Native apps. Use it… Read More »
Image Loading and caching had been a little bit pain in react native. In-fact react native didn’t had native support for caching. But after the recent release, there is now support for caching in iOS only. Still not for Android. You can read more about this from here https://facebook.github.io/react-native/docs/images.html#cache-control-ios-only Now these are the variety of options available. default:… Read More »
Animations are achieved in React Native using the Animation API. Below are the methods Animated.timing() — Maps time range to easing value. Animated.decay() — starts with an initial velocity and gradually slows to a stop. Animated.spring() — Simple single-spring physics model (Based on Rebound and Origami). Tracks velocity state to create fluid motions as the toValue updates, and can be chained together. Here we… Read More »