how to show multiple comment_tree: ^0.3.0 in flutter , I want to show multiple comment in comment page Pleas help me

‘here is comment widget i want to show this multiple comment widget in comment page and i also try to lot of trying to put this comment widget in listview when i put this widget in listview my screen is not rendered. but when i put this in gridview it is showing all comment properly plese help me’

import 'package:comment_tree/comment_tree.dart';
import 'package:comment_tree/widgets/comment_tree_widget.dart';
import 'package:ecllipsenew/data/repository/post_repo.dart';
import 'package:ecllipsenew/provider/PostProvider.dart';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:provider/provider.dart';

import '../../../../util/app_constants.dart';

class Comments extends StatefulWidget {
  final List<Comment> commentList;

  Comments({this.commentList});

  @override
  State<Comments> createState() => _CommentsState();
}

class _CommentsState extends State<Comments> {
  bool reply = false;

  final List<Comment> commentLi = [
    Comment(
      avatar: 'nukkll',
      userName: 'njjull',
      content: 'I mkk interested',
    ),
    Comment(
      avatar: 'null',
      userName: 'null',
      content: 'I mjjj interested',
    ),
  ];

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Expanded(
          child: Container(
            child: CommentTreeWidget<Comment, Comment>(
              commentLi[0],
              [
                commentLi[0],
                commentLi[1],
              ],
              treeThemeData:
                  TreeThemeData(lineColor: Colors.blue, lineWidth: 3),
              avatarRoot: (context, data) => const PreferredSize(
                child: CircleAvatar(
                    radius: 18,
                    backgroundColor: Colors.grey,
                    backgroundImage: NetworkImage(AppConstants.User_Url)),
                preferredSize: Size.fromRadius(18),
              ),
              avatarChild: (context, data) => const PreferredSize(
                child: CircleAvatar(
                    radius: 12,
                    backgroundColor: Colors.grey,
                    backgroundImage: NetworkImage(AppConstants.User_Url)),
                preferredSize: Size.fromRadius(12),
              ),
              contentChild: (context, data) {
                return Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      padding: EdgeInsets.symmetric(vertical: 8, horizontal: 8),
                      decoration: BoxDecoration(
                          color: Colors.grey[100],
                          borderRadius: BorderRadius.circular(12)),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            '${data.userName}',
                            style: Theme.of(context)
                                .textTheme
                                .caption
                                ?.copyWith(
                                    fontWeight: FontWeight.w600,
                                    color: Colors.black),
                          ),
                          SizedBox(
                            height: 4,
                          ),
                          Text(
                            '${data.content}',
                            style: Theme.of(context)
                                .textTheme
                                .caption
                                ?.copyWith(
                                    fontWeight: FontWeight.w300,
                                    color: Colors.black),
                          ),
                        ],
                      ),
                    ),
                    DefaultTextStyle(
                      style: Theme.of(context).textTheme.caption.copyWith(
                          color: Colors.grey[700], fontWeight: FontWeight.bold),
                      child: Padding(
                        padding: EdgeInsets.only(top: 4),
                        child: Row(
                          children: [
                            SizedBox(
                              width: 8,
                            ),
                            Text('5d'),
                            SizedBox(
                              width: 8,
                            ),
                            Text('Like'),
                            SizedBox(
                              width: 24,
                            ),
                            Text('Reply'),
                          ],
                        ),
                      ),
                    )
                  ],
                );
              },
              contentRoot: (context, data) {
                return Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      padding: EdgeInsets.symmetric(vertical: 8, horizontal: 8),
                      decoration: BoxDecoration(
                          color: Colors.grey[100],
                          borderRadius: BorderRadius.circular(12)),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            'Tina Chuhan',
                            style: Theme.of(context).textTheme.caption.copyWith(
                                fontWeight: FontWeight.w600,
                                color: Colors.black),
                          ),
                          SizedBox(
                            height: 4,
                          ),
                          Text(
                            '${data.content}',
                            style: Theme.of(context).textTheme.caption.copyWith(
                                fontWeight: FontWeight.w300,
                                color: Colors.black),
                          ),
                        ],
                      ),
                    ),
                    DefaultTextStyle(
                      style: Theme.of(context).textTheme.caption.copyWith(
                          color: Colors.grey[700], fontWeight: FontWeight.bold),
                      child: Padding(
                        padding: EdgeInsets.only(top: 4),
                        child: Row(
                          children: const [
                            SizedBox(
                              width: 8,
                            ),
                            Text('5d'),
                            SizedBox(
                              width: 8,
                            ),
                            Text('Like'),
                            SizedBox(
                              width: 24,
                            ),
                            Text('Reply'),
                          ],
                        ),
                      ),
                    )
                  ],
                );
              },
            ),
            padding: EdgeInsets.symmetric(vertical: 12, horizontal: 16),
          ),
        ),
      ],
    );
    //       }

    //       );
    // });
  }
}



and here is my comment show page

import 'package:comment_tree/comment_tree.dart';
import 'package:ecllipsenew/screen/home/pages/comment/Comments.dart';
import 'package:ecllipsenew/screen/home/pages/comment/new_message.dart';
import 'package:ecllipsenew/util/app_constants.dart';
import 'package:flutter/material.dart';

class CommentPage extends StatefulWidget {
  static const routeName="/Comment_Page";
  const CommentPage({Key key}) : super(key: key);
  @override
  State<CommentPage> createState() => _CommentPageState();
}

class _CommentPageState extends State<CommentPage> {
  // final List<Comments> commentList = [
  //   Comments(
  //       commentId: "3",
  //       commentUserId: "11",
  //       commentUserName: "Himanshu",
  //       commentUserProfileImage: AppConstants.User_Url,
  //       commentType: "text",
  //       commentFile: "jjjj",
  //       commentDate: "12/12/12",
  //       commentTime: "12:30",
  //       commentReacts: "hhh",
  //       letestReplys: "jjjj")
  // ];

  final List<Comment> commentLi = [
    Comment(
      avatar: 'null',
      userName: 'null',
      content: 'I m interested',
    ),
    Comment(
      avatar: 'null',
      userName: 'null',
      content: 'I m interested',
    ),
  ];

  @override
  Widget build(BuildContext context) {
    return
        //  Scaffold(
        //   appBar: AppBar(
        //     title: Text("Comment"),
        //   ),
        //   body:

        SingleChildScrollView(
      child: Container(
        child: Column(
          children: <Widget>[
//when I add this line my screen is not rendered
            for (int i = 0; i < 3; i++) Comments(commentList: commentLi),
            Expanded(
              child: Comments(commentList: commentLi),
            ),
            NewMessage()
          ],
        ),
      ),
    );
    // );
  }
}


Leave a Comment