FLUTTER LOGO的组件

FlutterLogo组件

FlutterLogo组件是一个比较简单的组件其作用相当于图标或图片,FlutterLogo是一个Painter绘制动画控件，（AnimatedContainer实现），可以通过设置size、color属性给它设置不同的颜色，大小。

官方文档属性如下：

const FlutterLogo({
Key key,
this.size,
this.colors,
this.textColor = const Color(0xFF616161),
this.style = FlutterLogoStyle.markOnly,
this.duration = const Duration(milliseconds: 750),
this.curve = Curves.fastOutSlowIn,

}) : super(key: key);

效果如下：

完整代码如下：

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class FlutterLogoWidget extends StatefulWidget {
  @override
  _FlutterLogoWidgetState createState() => _FlutterLogoWidgetState();
}

class _FlutterLogoWidgetState extends State<FlutterLogoWidget> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Scaffold(
        appBar:AppBar(
          title: Text('FlutterLogo'),
          centerTitle: true,
          leading: GestureDetector(
              onTap: (){
                Navigator.pop(context);
              },
              child: Icon(Icons.keyboard_arrow_left)),
        ),
        body: Column(
          children: <Widget>[
            Center(
              child:  FlutterLogo(
                colors: Colors.cyan,//设置颜色,部分颜色没法设置。
                size: 300,//设置大小
                textColor: Colors.blue,//设置文本的颜色
                duration: Duration(microseconds: 1),动画的时间长度
                style: FlutterLogoStyle.horizontal ,//横向文本
                curve: Curves.bounceIn,动画的曲线设置。
              )
            ),
          ],
        )
      ),
    );
  }
}

主页https://juejin.cn/user/96412755835928