Flutter开发Twitter克隆：帖子侧边竖线实现问题求助

要实现头像旁贯穿主帖区域的竖线，只需调整左侧头像布局并延续竖线到子评论区域，以下是修改后的完整代码：

Column(
  children: [
    Container(
      decoration: BoxDecoration(
          border: Border(
              bottom: result
                  ? const BorderSide()
                  : BorderSide(width: 1.5, color: Colors.grey[900]!))),
      child: CupertinoButton(
          padding: const EdgeInsets.fromLTRB(15, 10, 15, 4),
          onPressed: () {},
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Column(
                children: [
                  const CircleAvatar(
                    backgroundImage: NetworkImage(
                        'https://www.pngkit.com/png/detail/843-8436987_gitapp-github.png'),
                  ),
                  // 帖子侧边竖线：非最后一条时显示
                  if (!result)
                    Container(
                      width: 2,
                      height: double.infinity,
                      color: Colors.grey[800],
                      margin: const EdgeInsets.only(top: 8),
                    ),
                ],
              ),
              const SizedBox(
                width: 15,
              ),
              Expanded(
                child: Column(
                  mainAxisSize: MainAxisSize.max,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Row(
                          children: [
                            Text(
                              'username',
                              style: TextStyle(
                                  color: Colors.grey[300],
                                  fontSize: 19,
                                  fontWeight: FontWeight.bold),
                            ),
                            Row(
                              children: [
                                const SizedBox(
                                  width: 5,
                                ),
                                Text(
                                  String.fromCharCode(CupertinoIcons
                                      .checkmark_seal_fill.codePoint),
                                  style: TextStyle(
                                    inherit: false,
                                    color: kThemeColor,
                                    fontSize: 17.0,
                                    fontWeight: FontWeight.w900,
                                    fontFamily:
                                        CupertinoIcons.heart.fontFamily,
                                    package:
                                        CupertinoIcons.heart.fontPackage,
                                  ),
                                ),
                              ],
                            )
                          ],
                        ),
                        Padding(
                          padding: const EdgeInsets.only(right: 15.0),
                          child: GestureDetector(
                              child: const Icon(
                                CupertinoIcons.ellipsis,
                                color: Colors.grey,
                              ),
                              onTap: () {}),
                        ),
                      ],
                    ),
                    Text(
                      timeago.format(
                        widget.timestamp.toDate(),
                      ),
                      style: TextStyle(
                          color: Colors.grey[600],
                          fontWeight: FontWeight.w500),
                    ),
                    const SizedBox(
                      height: 10,
                    ),
                    Text(
                      'This is the main content ',
                      style: TextStyle(
                          color: Colors.grey[350],
                          fontSize: 16,
                          fontWeight: FontWeight.w500),
                    ),
                    const SizedBox(
                      height: 10,
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        CupertinoButton(
                            padding: EdgeInsets.zero,
                            child: Row(
                              children: [
                                Padding(
                                  padding: const EdgeInsets.only(top: 5.0),
                                  child: Text(
                                    String.fromCharCode(isLiked
                                        ? CupertinoIcons
                                            .heart_fill.codePoint
                                        : CupertinoIcons.heart.codePoint),
                                    style: TextStyle(
                                      inherit: false,
                                      color: isLiked
                                          ? kThemeColor
                                          : Colors.grey[600],
                                      fontSize: 17.0,
                                      fontWeight: FontWeight.w900,
                                      fontFamily:
                                          CupertinoIcons.heart.fontFamily,
                                      package:
                                          CupertinoIcons.heart.fontPackage,
                                    ),
                                  ),
                                ),
                                const SizedBox(
                                  width: 8,
                                ),
                                const Text(
                                  'likeCount',
                                  style: TextStyle(
                                    color: Colors.white,
                                    fontWeight: FontWeight.w500,
                                    fontSize: 17.0,
                                  ),
                                )
                              ],
                            ),
                            onPressed: () {
                              // handleLikePost();
                            }),
                        CupertinoButton(
                            padding: EdgeInsets.zero,
                            child: Text(
                              String.fromCharCode(
                                  UniconsLine.comment.codePoint),
                              style: TextStyle(
                                inherit: false,
                                color: Colors.grey[600],
                                fontSize: 17.0,
                                fontWeight: FontWeight.w900,
                                fontFamily: UniconsLine.comment.fontFamily,
                                package: UniconsLine.comment.fontPackage,
                              ),
                            ),
                            onPressed: () {}),
                        CupertinoButton(
                            padding: EdgeInsets.zero,
                            child: Text(
                              String.fromCharCode(
                                  UniconsLine.process.codePoint),
                              style: TextStyle(
                                inherit: false,
                                color: Colors.grey[600],
                                fontSize: 17.0,
                                fontWeight: FontWeight.w900,
                                fontFamily: UniconsLine.comment.fontFamily,
                                package: UniconsLine.comment.fontPackage,
                              ),
                            ),
                            onPressed: () {}),
                        CupertinoButton(
                            padding: EdgeInsets.zero,
                            child: Text(
                              String.fromCharCode(
                                  UniconsLine.bookmark.codePoint),
                              style: TextStyle(
                                inherit: false,
                                color: Colors.grey[600],
                                fontSize: 17.0,
                                fontWeight: FontWeight.w900,
                                fontFamily: UniconsLine.bookmark.fontFamily,
                                package: UniconsLine.bookmark.fontPackage,
                              ),
                            ),
                            onPressed: () {}),
                        CupertinoButton(
                            padding: EdgeInsets.zero,
                            child: Text(
                              String.fromCharCode(
                                  UniconsLine.upload.codePoint),
                              style: TextStyle(
                                inherit: false,
                                color: Colors.grey[600],
                                fontSize: 17.0,
                                fontWeight: FontWeight.w900,
                                fontFamily: UniconsLine.share.fontFamily,
                                package: UniconsLine.share.fontPackage,
                              ),
                            ),
                            onPressed: () {}),
                      ],
                    )
                  ],
                ),
              )
            ],
          )),
    ),
    Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        // 子评论区域延续竖线
        result
            ? const SizedBox()
            : Container(
                width: 2,
                height: subComments.isNotEmpty ? null : 0,
                color: Colors.grey[800],
                margin: const EdgeInsets.only(left: 35),
              ),
        Column(
          children: subComments,
        ),
      ],
    )
  ],
);

关键修改说明： #

• 在头像下方添加垂直Container作为竖线，通过double.infinity自动撑满主帖Row高度，margin: const EdgeInsets.only(top: 8)让竖线与头像保持间距，贴合Twitter视觉风格
• 用!result判断是否显示竖线，避免最后一条帖子出现多余竖线
• 子评论区域延续竖线，通过subComments.isNotEmpty控制高度，确保有子评论时显示完整竖线，无评论时隐藏

内容的提问来源于stack exchange，提问作者Foxq