React Native - заливка цвета фона с переходом - PullRequest
0 голосов
/ 14 ноября 2018

У меня есть вид, что я заполняю его цветом фона соответственно.Например, если пользователь выбирает один элемент из пяти компонентов, мой взгляд должен заполнить цвет на 20%.Я правильно заполнил свой взгляд цветом.Но так как я не могу использовать свойство transition, нет способа получить цветную заливку с переходом, так что это похоже на постепенное заполнение.Как мне оживить мой вид, чтобы он имел эффект плавного цветового заполнения?

мой код

<View style={{backgroundColor: 'green', opacity: 0.6, height: '100%', position: 'absolute',width: (selectedList.length === 0 ? 0 
: selectedList.length === 1 ? '20%' : selectedList.length === 2 ? '40%' :selectedList.length === 3 ? '60%' : selectedList.length === 4 ? '80%' : selectedList.length === 5 ? '100%' : 0)
            }}>
</View>

1 Ответ

0 голосов
/ 14 ноября 2018

Возможно, вы захотите использовать Animated из React Native.https://facebook.github.io/react-native/docs/animations. Сохраните значение процента в переменной в состоянии, а затем вы можете сделать что-то подобное для 20% и так далее:

Animated.timing(this.state.percentageFilled, {
  toValue: 20,
  duration: 1000,
}).start();
...