想要進行動畫陣營本地文本價值

所以基本上即時試圖讓這個渲染功能實際上實時更新的價值（截至目前它只是在動畫完成後跳轉到最終值）想要進行動畫陣營本地文本價值

this.state = { 
 
    pleaseDisplayMe: Animated.value(0); 
 
} 
 

 
triggerAnimation(){ 
 
    Animated.timing(
 
     this.state.pleaseDisplayMe, 
 
     {toValue: 100, 
 
     duration: 5000} 
 
    ).start(); 
 
} 
 

 
render(){ 
 
    return <Animated.Text>{this.state.pleaseDisplayMe}</Animated.Text> 
 
}

我覺得因爲這個庫可以在引擎蓋下動畫值，那麼必須有一種方法來顯示發生了什麼。還是有某種內容/價值屬性，我可以通過風格餵食？

我試過自定義寫我自己的setInterval函數，但我需要它與其他動畫的時機更好地排隊，我很樂意訪問RN的緩動庫！

謝謝！

來源

2017-02-10 Jeremy

React Native有timers您可以使用。例如，你試圖用setInterval來逐步實現的目標：

state = {pleaseDisplayMe: 0} 

componentDidMount() { 
    setInterval(() => { 
    this.setState({pleaseDisplayMe: this.state.pleaseDisplayMe + 1}) 
    }, 1000); 
} 

render() { 
    return (
    <Text>{this.state.pleaseDisplayMe}</Text> 
) 
}

但是，如果你想，而不是試圖真正得到從動畫中的價值，你應該附加一個偵聽動畫，並獲得價值從那裏作爲there is no way to synchronously read the value because it might be driven natively。一個可能非常差（我也有新的反應母語）的這個例子是這樣的：

state = { 
    pleaseDisplayMe: new Animated.Value(0), 
    value: 0, 
} 

triggerAnimation(){ 
    this.state.pleaseDisplayMe.addListener(({value}) => this.setState({value: value})); 
    Animated.timing(
    this.state.pleaseDisplayMe, 
    {toValue: 100, 
    duration: 5000} 
).start(); 
} 

render() { 
    return (
    <Text>{this.state.value}</Text> 
) 
}

來源

2017-02-10 02:09:25

請注意，每當triggerAnimation獲取callen時，您都會綁定一個新的偵聽器。你並沒有移除聽衆。感謝隊友 –

，這完全有幫助！事實證明，只要有監聽器更新狀態就會強制以我需要的方式進行動態重新渲染，所以實際上我只能在偵聽器中使用this.state.forceUpdate（）方法。幫助非常感謝！ – Jeremy

我從來沒有試過這種反應在本地，但這樣做圖書館的工作？

https://www.npmjs.com/package/react-typist

來源

2017-02-10 08:42:24 mparis

沒有不行，試圖插入html –

想要進行動畫陣營本地文本價值

回答

相關問題