如何编码圆形头像放置在一个地方,没有参与人数

问题描述 投票:0回答:1

如何将照片放在一起并告诉列表中参与者的编号。

flutter flutter-animation
1个回答
0
投票

试试这个:

@override
  Widget build(BuildContext context) {
    int length = 20;
    return Scaffold(
      body: Center(
        child: SizedBox(
          height: 50,
          child: Stack(
              children: List.generate(length >= 4 ? 4 : length, (index) {
            if (index >= 3) {
              return Positioned(
                left: index * 40,
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(50),
                  child: Container(
                    height: 50,
                    width: 50,
                    decoration: BoxDecoration(
                      color: Colors.grey.shade300,
                      borderRadius: BorderRadius.circular(50),
                    ),
                    child: Center(
                      child: Text('+${length - 3}'),
                    ),
                  ),
                ),
              );
            }
            return Positioned(
              left: index * 40,
              child: ClipRRect(
                borderRadius: BorderRadius.circular(50),
                child: SizedBox(
                  height: 50,
                  width: 50,
                  child: Image.asset(
                    'assets/test.png',
                    fit: BoxFit.cover,
                  ),
                ),
              ),
            );
          })),
        ),
      ),
    );
  }
© www.soinside.com 2019 - 2024. All rights reserved.