Tutorials

In this lesson we'll add a button to the footer that will clear all completed items. We'll use TouchableOpacity and we'll examine how flex space-around property works.

We'll add a cross platform Switch component to toggle the completeness of each todo item. We'll show how to pass down functions from the parent application to the child row of a ListView.

We'll use the cross platform ActivityIndicator to add a loading spinner while the items load from AsyncStorage. We'll show off the importance of rendering order, absolute positioning, and how to center items with alignItems and justifyContent set to center.

We'll use TouchableOpacity to create a Remove button for each todo item. We'll demonstrate how to create remove items from a ListView.DataSource

In this lesson we'll add a Toggle All Complete Button next to the Text Input. We'll show off how components without flex layout affect siblings with flex layout properties.

In this lesson we'll add a footer text item to show the total count of what is in the current filtered view. We'll show the technique of deriving computed values in render functions.

We'll use the interpolate function from an Animated.Value to transition the background color of an Animated.View. We'll simultaneously translate the position with the same Animated.Value.

In this lesson we'll use Animated.parallel to animate multiple Animated.timing and Animated.spring animations at the same time.

By using the interpolate function, the Animated.View can be rotated using both degrees and radians.

In this lesson we will use Animated.timing to animate the opacity and height of a View in our React Native application. This function has attributes that you can set such as easing and duration.