在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML5/ react natvie 怎么停止動(dòng)畫？

react natvie 怎么停止動(dòng)畫？

剛接觸RN，還沒太搞明白Animated的使用方法，Animated到底怎么停的？ 我試了下stopAnimation，stop，這倆方法好像都沒用。。
部分代碼：

this.testAnimate = Animated.timing(this.state.translateY, {
      toValue: 180,
      duration: 500,
      Easing: Easing.ease,})

動(dòng)畫start后，使用this.testAnimate.stop()沒法停止。。

this.state = {
      translateY: new Animated.Value(0),
    }
this.state.translateY.stopAnimation()

同樣不起作用。。還望各位指點(diǎn)

回答
編輯回答
幼梔
    constructor(props) {
        super(props);
        //使用Animated.Value設(shè)定初始化值（角度）
        this.state = {
            playImage: require('./resources/images/play.png'),
            rotateValue: new Animated.Value(0), //旋轉(zhuǎn)角度的初始值
        };
        this.isPlaying = false;
        this.playerAnimated = Animated.timing(this.state.rotateValue, {
            toValue: 1, //角度從0變1
            duration: 15000, //從0到1的時(shí)間
            easing: Easing.inOut(Easing.linear), //線性變化，勻速旋轉(zhuǎn)
        });
    }

    play() {
        this.isPlaying = !this.isPlaying;
        if (this.isPlaying === true) {
            this.setState({
                playImage: require('./resources/images/pause.png'),
            });
            this.startPlay();
        } else {
            this.setState({
                playImage: require('./resources/images/play.png'),
            });
            this.stopPlay();
        }
    }

    rotating() {
        if (this.isPlaying) {
            this.state.rotateValue.setValue(0);
            this.playerAnimated.start(() => {
                this.rotating()
            })
        }
    };

    startPlay() {
        this.playerAnimated.start(() => {
            this.playerAnimated = Animated.timing(this.state.rotateValue, {
                toValue: 1, //角度從0變1
                duration: 15000, //從0到1的時(shí)間
                easing: Easing.inOut(Easing.linear), //線性變化，勻速旋轉(zhuǎn)
            });
            this.rotating();
        });
    }

    stopPlay() {
        this.state.rotateValue.stopAnimation((oneTimeRotate) => {
            //計(jì)算角度比例
            this.playerAnimated = Animated.timing(this.state.rotateValue, {
                toValue: 1,
                duration: (1-oneTimeRotate) * 15000,
                easing: Easing.inOut(Easing.linear),
            });
        });
    }
2017年3月29日 08:16