如何解决在屏幕上用颤动在屏幕上绘制大小不同但间距相等的气泡
我想建立一个屏幕,上面有多个半径不同的气泡(数量可能有所不同)。它们的位置应使其几乎覆盖整个屏幕,但它们之间具有相等的间距。我尝试了许多不同的操作(部件)以达到所需的外观,但对效果并不满意。我正在附上我想要的结果的屏幕截图。
这是我的代码...
import 'package:flutter_tags/selectable_tags.dart';
import 'package:provider/provider.dart';
import 'package:scool/provider/tags.dart';
class CategoriesScreen extends StatelessWidget {
static const routeName = '/Categories-Screen';
@override
Widget build(BuildContext context) {
var width = MediaQuery.of(context).size.width;
List<Tag> tags = Provider.of<Tags>(context,listen: false).items;
return Scaffold(
body: Column(
children: <Widget>[
Container(
padding: EdgeInsets.all(20),height: 100,width: width,child: Center(
child: Image.asset(
'assets/images/Artboard – 4 (1).png',fit: BoxFit.contain,),Container(
width: width,height: 32,padding: EdgeInsets.only(bottom: 10),child: Center(
child: Text(
'Choose categories of your interest.',style: Theme.of(context).textTheme.bodyText1,)),SingleChildScrollView(
child: Container(
child: Wrap(
spacing: 5,alignment: WrapAlignment.spaceBetween,children: <Widget>[
...tags
.map((i) => Container(
width: (i.title.length * 12).toDouble(),height: (i.title.length * 12).toDouble(),child: CircleAvatar(
backgroundColor: Colors.pink[100],radius: (i.title.length * 6.5).toDouble(),child: Text(i.title),))
.toList()
],)
],));
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。