How to draw line between 1 widget to 2nd widget Flutter-CodePudding

I'm trying to create a comment tree but I don't have any idea how to do that. The package I found on pub.dev is not like what I want. I mesh with codes. No tutorial found related to me.

This is what I want : Image

I want a tutorial or idea to create design like showing in the image.

CodePudding user response：

You can draw line like this

SizeBox(
height : 2,
width :  MediaQuery.of(context).size.width,
child : Container(color:Colors.black)
),

CodePudding user response：

try this

IntrinsicHeight(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
  Container(width: 2.0, color:Colors.black),//(or use VerticalDivider())
  SizedBox(width: 4.0),
  YourCommentWidget(),
 ],
))

CodePudding user response：

Go to this package. https://pub.dev/packages/flutter_fancy_tree_view

@Pradip said in comments.

If that you want, just add in pubspec.yaml file or you want to customize like in image just Copy the code from git repository and paste in your project as separate directory.

Edit as you want.

CodePudding user response：

In your tree, you can use divider() for clear line, also you can use sizedbox.

firstwidget ( child : secondwidget (child : ..............) )

simply you can wrap second widget with a padding.