Jetpack 撰写启动动画

Question

我找到了关于点动画的好文章 - https://proandroiddev.com/compose-animations-in-real-time-6068f10595ba、https://github.com/halilozercan/madewithcompose/tree/main/dotsandlines/src/main/java/com/halilibo/dotsandlines。现在我想尝试在我的 android 设备上运行这段代码，但我不明白我应该如何使用修饰符启动这个动画。我在方法 import React from 'react'; // The Context const TemplateContext = React.createContext({}); // Template Provider const TemplateProvider = ({children}) => { const [myValue, setMyValue] = React.useState(0); // Context values passed to consumer const value = { myValue, // <------ Expose Value to Consumer setMyValue // <------ Expose Setter to Consumer }; return ( <TemplateContext.Provider value={value}> {children} </TemplateContext.Provider> ) } // Template Consumer const TemplateConsumer = ({children}) => { return ( <TemplateContext.Consumer> {(context) => { if (context === undefined) { throw new Error('TemplateConsumer must be used within TemplateProvider'); } return children(context) }} </TemplateContext.Consumer> ) } // useTemplate Hook const useTemplate = () => { const context = React.useContext(TemplateContext); if(context === undefined) throw new Error('useTemplate must be used within TemplateProvider'); return context; } export { TemplateProvider, TemplateConsumer, useTemplate }

中尝试过这样的方法

import React            from 'react';
import {useTemplate}    from 'context.jsx';
const MyComponent = () => {

    // Get the value and setter from the consumer hook
    const {myValue,setMyValue} = useTemplate();

    // Demonstrate incrementing the value
    React.useEffect(()=>{
        let interval = setInterval(()=>{
            setMyValue(prev => prev + 1); // Increment, set in context
        }, 1000) // Every second
        return (
            clearInterval(interval); // Kill interval when unmounted
        )
    },[]) // On mount, no dependencies

    // Render the value as it is pulled from the context
    return (
        <React.Fragment>
            Value of MyValue is: {myValue}
        </React.Fragment>
    )
}

我想我错过了一些重要的东西