Flutter 实现进度条效果_Android

Flutter 实现进度条效果

用flutter开发的项目，最大的好处除了跨平台之外，还有一点就是插件多，便于很多功能的实现。

画风（话锋）一转，老子说，事物都有两面性，物极必反。插件多是多，插件带来的问题也是不容小觑，总结下，插件带来的几大问题。

（1）插件更新不及时

插件更新不及时，会导致我们连编译都过不去，甚至要去改插件的原生代码，这个时候，我们可能会自己创建一个github插件，然后直接引用自己的github插件地址，算了，真不靠谱的插件作者！千言万语尽在不言中。。。

（2）插件冲突

插件冲突，有的时候是配置冲突，比如经常遇到的android:resource="@xml/filepaths"/>
同样是在manifest里面，有的插件配置的是filepaths，有的为file_paths，这个也挺痛苦的。

（3）包体积

插件用多了，包体积自然就大了，用户一看这么大的包，下载半天，算了，当然5g来了咱就另说了。

话不多说，解决之道，就4个字：少用插件。

比如进度条插件，之前我还用modal_progress_hud: ^0.1.3，发现没必要，flutter本来就有linearprogressindicator，用来做进度显示的。干掉干掉。

上代码：

linearprogressindicator(
 value: 0.3,
 valuecolor: alwaysstoppedanimation<color>(colors.red),
 backgroundcolor: colors.blue,
),

其中，value为进度值，valuecolor为已经进行的进度颜色，backgroundcolor就是还没到的那段进度的颜色咯。

不要着急，上个完整的例子，给你们看效果。

import 'package:flutter/material.dart';

class progressdemo extends statefulwidget {
 progressdemo({key key}) : super(key: key);

 @override
 _progressdemostate createstate() => _progressdemostate();
}

class _progressdemostate extends state<progressdemo> {
 @override
 widget build(buildcontext context) {
 return scaffold(
  appbar: appbar(
  title: text('flutter progress demo'),
  ),
  body: container(
  margin: edgeinsets.only(top: 20),
  alignment: alignment.topcenter,
  child: flatbutton(
   child: text('进度'),
   color: colors.blue,
   onpressed: () {
   return showdialog(context: context, builder: (context) {
    return alertdialog(
    backgroundcolor: colors.transparent,
    title: text('上传中...'),
    content: linearprogressindicator(
     value: 0.3,
     valuecolor: alwaysstoppedanimation<color>(colors.red),
     backgroundcolor: colors.blue,
    ),
    shape: roundedrectangleborder(
     borderradius: borderradius.all(radius.circular(10))
    ),
    );
   },);
   },
  ),
  ),
 );
 }
}

好了，效果如下：