Flutter 如何以动画方式逐行突出显示段落?

Flutter 如何以动画方式逐行突出显示段落?,flutter,flutter-animation,Flutter,Flutter Animation,我在文本中创建突出显示效果,并在此处设置动画突出显示我能够实现突出显示效果,但我面临的问题是突出显示覆盖了整个段落,但我希望这件事逐行发生 class _Home extends State<Home> with SingleTickerProviderStateMixin { static String sample="This is cow mnbc,msxvcnds,mvndsklmvlkdsmvlmdslfldsmfldsflkmdslfmk

我在文本中创建突出显示效果,并在此处设置动画突出显示我能够实现突出显示效果,但我面临的问题是突出显示覆盖了整个段落,但我希望这件事逐行发生

 class _Home extends State<Home> with SingleTickerProviderStateMixin {
           static String sample="This is cow mnbc,msxvcnds,mvndsklmvlkdsmvlmdslfldsmfldsflkmdslfmkldskmfldsmflmslfmlsdmflsdmflkmds    ,m vdskmflsdmfldsfmdslf";
         late double _width=0;
           late AnimationController _controller;
         late Animation<double> _animation;
         final GlobalKey txtKey=GlobalKey();
        
        
        @override
          void didChangeDependencies() {
            _width=MediaQuery.of(context).size.width-10;
            _controller = AnimationController(
                duration: Duration(seconds:15),
                vsync: this);
            _animation = Tween<double>(begin: 0, end: _width/10).animate(_controller);
            _controller.forward();
        
            _controller.addListener(() {});
          }
        
          @override
          Widget build(BuildContext context) {
        
            return Scaffold(
                appBar: AppBar(),
                body: Center(
                    child: Padding(
                      padding: EdgeInsets.only(left:10,right:10),
                      child: IntrinsicHeight(
                        child: Stack(
                            fit: StackFit.loose,
                            children: [
                              AnimatedBuilder(
                                  animation:_animation,
                                  builder: (BuildContext context,_)
                                  {
                                    return Container(
                                        width:_animation.value*10, //width will increase dynamically to create highlighting effect
                                        color: Colors.purple
                                    );
                                  }
                              ),
                              Padding(
                                padding:EdgeInsets.only(top:5,bottom: 5,left:5,right:5),
                                child:Text(
                                    sample,
                                    key:txtKey,
                                      style: TextStyle(color: Colors.green, fontSize: 
    20,fontWeight:FontWeight.bold),
                                    textDirection: TextDirection.ltr)),
        
                            ],
                          ),
                      ),
                    )
                    ) );
          }
        } 
class\u Home使用SingleTickerProviderStateMixin扩展状态{
静态字符串示例=“这是cow mnbc、msxvcnds、MVNDSKLMVLKDSMVLMDSLFLDSMFFLDSFLKMDSLFMKLDSKMFFLDSMLMSLFMLSDMFLSDMFLKMDS、m vdskmflsdmfldsfmdslf”;
晚双倍宽度=0;
后期动画控制器_控制器;
晚期动画;
最终GlobalKey txtKey=GlobalKey();
@凌驾
void didChangeDependencies(){
_宽度=MediaQuery.of(context).size.width-10;
_控制器=动画控制器(
持续时间:持续时间(秒数:15),
vsync:这个);
_动画=Tween(开始:0,结束:_宽度/10)。动画(_控制器);
_controller.forward();
_controller.addListener((){});
}
@凌驾
小部件构建(构建上下文){
返回脚手架(
appBar:appBar(),
正文:中(
孩子:填充(
填充:仅限边设置(左:10,右:10),
孩子:内在的(
子:堆栈(
适合:StackFit.loose,
儿童:[
动画生成器(
动画:_动画,
生成器:(BuildContext上下文,ux)
{
返回容器(
宽度:_animation.value*10,//宽度将动态增加以创建突出显示效果
颜色:颜色。紫色
);
}
),
填充物(
填充:仅限边设置(顶部:5,底部:5,左侧:5,右侧:5),
子:文本(
样品
key:txtKey,
样式:文本样式(颜色:Colors.green,字体大小:
20,fontWeight:fontWeight.bold),
textDirection:textDirection.ltr)),
],
),
),
)
) );
}
}