Question

我在IOS上尝试动画paddingLeft属性它不起作用

state = {
    paddingAnimation: new Animated.Value(40),
}; 
animate(){
    let {paddingAnimation} = this.state;
    Animated.timing( paddingAnimation, { toValue: 100, duration: 100}).start();
}
In Render
<AnimatedInputText style={[styles.search, {margin: paddingAnimation}]}>

适用于Android，但不适用于IOS。任何解决方案？

Answer 1

你想要动画填充左边然后使用 paddingLeft 而不是边距示例

import {
  View,
  Text,
  StyleSheet,Animated,
} from "react-native";


   this.state = {paddingAnimation: new Animated.Value(40),}
   componentWillMount()
              {
                Animated.timing( this.state.paddingAnimation, { toValue: 100, duration: 1000}).start();

          }
    render() {
        return (
          <View style={styles.container}>
            <Animated.Text style={[{paddingLeft: this.state.paddingAnimation}]}>
            LoginForm
              </Animated.Text>
    </View>
    });

它将在Animated.Text中工作以进行动画处理。动画使用上面的包装器导出以下可动画组件：

Animated.Image
Animated.ScrollView
Animated.Text
Animated.View

if you want to create your own use this 
Animated.createAnimatedComponent()

Animate paddingLeft React Native

1 个答案: