flutter 光束效果

 

效果如下

 

 1.插件

flash_animation: ^0.0.1

 

2.在需要的页面引入

import 'package:flash_animation/flash_animation.dart';

 

3.控制器

///闪光动画控制器
  FlashAnimationController flashAnimationController =
      new FlashAnimationController();

 

4.使用

  static headImgSrc(imgsrc, user) {
    return GestureDetector(
        onTap: () {
          AppConfig.toDetailById(Routes.minehome, user);
        },
        child:Stack(

          overflow: Overflow.visible,
          children: [
            
　　　　　　　　// 图片
            Container(

                child: ClipRRect(
                  borderRadius: BorderRadius.circular(50),
                  child: Container(

                    color: Colors.grey,
                    child: Image.network(imgsrc, width: 50, height: 50,),
                  ),
                ),
            ),


　　　　　　　// 光束
            Positioned(
//                width: 50,
//                height: 50,

                child: Container(
//                  width: 20,
//                  height: 20,
//                  color: Colors.pink,
                  ///填充父布局
//                    width: double.infinity,
                  ///内边距设置
//                  padding: EdgeInsets.all( 16.0),
                  ///通过静态函数来构建 FlashAnimation
                  child: FlashAnimation.fromColors(
                    ///动画控制器
                    flashAnimationController: flashAnimationController,
                    ///循环次数 默认为 0 无限循环
                    animationLoopCount: 0,
                    ///底色
                    normalColor: Colors.transparent,
                    ///亮色
                    highlightColor:Colors.white,
                    ///开启动画
                    animationStart: true,
                    ///执行动画的子Widget
                    ///这里是一个Widget类型，也就是可以使用任意的Widget
                    ///[ListPlacholderWidget]
                    child: ClipRRect(
                      borderRadius: BorderRadius.circular(50),
                      child: Container(

//                        color: Colors.grey,
                        child: Image.network(imgsrc, width: 50, height: 50,),
                      ),
                    ),
                  ),
                )
            ),


          ],
        )
    );
  }