Flutter组件大全(持续更新)

Opacity：如果你想让一个微件在屏幕中不可见，且原来的页面布局保持不变？那就请试一试我们的Opacity微件吧！你只要设置一个透明度的数值，它就能让你的子褪色以便匹配。你也可以用它来混合不同子部件，或是用AnimatedOpacity来创建动画。

Opacity:(
  opacity: 0.0, 
  child: MyWidget(),
)
//or
Stack:(
  children:[
    AnimatedOpacity:(
      duration: _myDuration,
      opacity: _myOpacity, 
      child: MyWidget(),
    ),
  ],
)
setState(() => _myOpacity = 0.0) //做透明动画

 

FutureBuilder：

FutureBuilder(
  future: http.get('http://awesome.data'), //执行完这个请求后，显示↓widget
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.done) { //ConnectionState还有多种状态
      if(snapshot.hasError) { //future解决问题时，检查有没错误发生
        return SomethingWentWrong;
      }
      return AwesomeData(snapshot.data);
    }else {
      return CircularProgressIndicator(); //future繁忙时显示一个适合的小部件
    }
    
  },
),

 

FadeTransition：当您只是寻找简单的转场并且不需要使用 Flutter 中更强大的动画时，请尝试使用FadeTransition 小部件！ FadeTransition 可让您轻松淡入淡出小部件，并且可以直接放入Flutter 应用程序。

//创建一个AnimationController
final _controller = AnimationController(vsync: this, duration: Duration(seconds: 2));
//创建一个动画，给开始和结束设置不透明值，并通过控制器创建动画
final _animation = Tween(begin: 1.0, end: 1.0).animate(_controller);
//使用：
FadeTransition(opacity: _animation, child: widget child,),