Flutter 画圆环


Flutter 画圆环,见代码

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'test',
      home: Stack(
        children: const [
          Align(
            alignment: AlignmentDirectional.center,
            child: CircleAvatar(
              radius: 300,
              backgroundColor: Colors.black,
            ),
          ),
          Align(
            alignment: AlignmentDirectional.center,
            child: CircleAvatar(
              radius: 250,
              backgroundColor: Colors.red,
            ),
          ),
           Align(
            alignment: AlignmentDirectional.center,
            child: CircleAvatar(
              radius: 200,
              backgroundColor: Colors.orange,
            ),
          ),
          Align(
            alignment: AlignmentDirectional.center,
            child: CircleAvatar(
              radius: 150,
              backgroundColor: Colors.blue,
            ),
          ),
          Align(
            alignment: AlignmentDirectional.center,
            child: CircleAvatar(
              radius: 100,
              backgroundColor: Colors.white,
            ),
          ),
        ],
      ),
    );
  }
}

运行效果

 

 

 

 

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM