flutter写一轮明月表达思念

最新推荐文章于 2024-05-12 23:57:13 发布

清风99w

最新推荐文章于 2024-05-12 23:57:13 发布

阅读量138

点赞数 1

分类专栏： Flutter

本文链接：https://blog.csdn.net/weixin_45425105/article/details/113698806

版权

Flutter 专栏收录该内容

53 篇文章 3 订阅

订阅专栏

因为一些特殊的情况，很多人都只能就地过年。
在这里插入图片描述

突然就想起了李白的那句诗，举头望明月，低头思故乡的诗句。
我记得这还是我小学时候的事情呢，没想到现在我都已经长这么大啦

做一轮明月只需要一个圆，将它的颜色做一个过度就可以啦
（一）效果图

在这里插入图片描述

（二）代码实现

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: AnimatedCrossFadePage(),
    );
  }
}

class AnimatedCrossFadePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
        child: Container(
      child: DecoratedBox(
        decoration: BoxDecoration(
          gradient: RadialGradient(
            center: const Alignment(-0.5, -0.6),
            radius: 0.15,
            colors: <Color>[
              const Color(0xFFEEEEEE),
              const Color(0xFF111133),
            ],
            stops: <double>[0.7, 1.0], //光晕
          ),
        ),
        child: Container(
          height: 100,
          width: 100,
        ),
      ),
    ));
  }
}

（三）实现原理
AnimatedCrossFade组件

我的小粉丝们，到此就结束啦，就这样，啾咪>-<