diff --git a/packages/rn-tester/js/examples/Animated/ColorStylesExample.js b/packages/rn-tester/js/examples/Animated/ColorStylesExample.js index 7fa9577da18..3da510586e4 100644 --- a/packages/rn-tester/js/examples/Animated/ColorStylesExample.js +++ b/packages/rn-tester/js/examples/Animated/ColorStylesExample.js @@ -10,7 +10,7 @@ import type {RNTesterModuleExample} from '../../types/RNTesterTypes'; import * as React from 'react'; -import {Animated, View, StyleSheet} from 'react-native'; +import {Animated, View, StyleSheet, Text} from 'react-native'; import RNTConfigurationBlock from '../../components/RNTConfigurationBlock'; import RNTesterButton from '../../components/RNTesterButton'; import ToggleNativeDriver from './utils/ToggleNativeDriver'; @@ -37,17 +37,28 @@ function AnimatedView({useNativeDriver}: {useNativeDriver: boolean}) { }), ); - const animatedTextStyle = { + const animatedFirstSpanTextStyle = { color: new Animated.Color('blue'), }; animations.push( - Animated.timing(animatedTextStyle.color, { + Animated.timing(animatedFirstSpanTextStyle.color, { toValue: new Animated.Color('red'), duration: 1000, useNativeDriver, }), ); + const animatedSecondSpanTextStyle = { + color: new Animated.Color('orange'), + }; + animations.push( + Animated.timing(animatedSecondSpanTextStyle.color, { + toValue: new Animated.Color('purple'), + duration: 1000, + useNativeDriver, + }), + ); + const animatedImageStyle = { tintColor: new Animated.Color('blue'), }; @@ -71,9 +82,13 @@ function AnimatedView({useNativeDriver}: {useNativeDriver: boolean}) { Press to animate - - Hello World - + + The + quick + brown + fox + jumps over the lazy dog +