Listview inside a row not working in Flutter

Question

I need a listview inside a row.

class Profiles extends StatelessWidget {
  const Profiles({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Row(
        children: [
          SideBar(),
          Expanded(
              child: ListView(
            children: [
              Wrap(
                children: [
                  Padding(
                    padding: const EdgeInsets.only(top: 40.0, left: 45),
                    child: Container(
                      width: MediaQuery.of(context).size.width / 1.75,
                      decoration: BoxDecoration(
                        border: Border.all(color: Color(0xffEBEBEB)),
                        color: Color(0xfffbfbfa),
                      ),
                      child: Stack(
                        children: [
                          Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Positioned(
                                right: 0,
                                top: 0,
                                child: Align(
                                  alignment: Alignment.topRight,
                                  child: MouseRegion(
                                    cursor: SystemMouseCursors.click,
                                    child: Text(
                                      "Edit",
                                    ),
                                  ),
                                ),
                              ),
                              Row(
                                mainAxisSize: MainAxisSize.min,
                                children: [
                                  MouseRegion(
                                    cursor: SystemMouseCursors.click,
                                    child: GestureDetector(
                                        onTap: () {
                                          //  Get.toNamed('/events',arguments: 0);
                                        },
                                        child: Padding(
                                          padding:
                                              const EdgeInsets.only(top: 0.0),
                                          child: SvgPicture.asset(
                                            allowDrawingOutsideViewBox: true,
                                            Images.avatar,
                                          ),
                                        )),
                                  ),
                                  SizedBox(
                                    width: 20,
                                  ),
                                  Column(
                                    // mainAxisAlignment: MainAxisAlignment.start,
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: [
                                      Text(
                                        'FirstName',
                                        textAlign: TextAlign.left,
                                      ),
                                      SizedBox(
                                        height: 6,
                                      ),
                                      Text("Update your role"),
                                      SizedBox(
                                        height: 20,
                                      ),
                                      Row(
                                        children: [
                                          Column(
                                            // mainAxisAlignment: MainAxisAlignment.start,
                                            crossAxisAlignment:
                                                CrossAxisAlignment.start,
                                            children: [
                                              Text(
                                                'Email',
                                                textAlign: TextAlign.left,
                                              ),
                                              SizedBox(
                                                height: 10,
                                              ),
                                              Text(
                                                'Organization',
                                                textAlign: TextAlign.left,
                                              ),
                                            ],
                                          ),
                                          SizedBox(
                                            width: 30,
                                          ),
                                          Column(
                                            mainAxisSize: MainAxisSize.min,
                                            // mainAxisAlignment: MainAxisAlignment.start,
                                            crossAxisAlignment:
                                                CrossAxisAlignment.start,
                                            children: [
                                              Text(
                                                'email',
                                                textAlign: TextAlign.left,
                                                overflow: TextOverflow.ellipsis,
                                                maxLines: 1,
                                              ),
                                              SizedBox(
                                                height: 10,
                                              ),
                                              Text(
                                                "NA",
                                              ),
                                            ],
                                          )
                                        ],
                                      )
                                    ],
                                  ),
                                ],
                              ),
                            ],
                          )
                        ],
                      ),
                    ),
                  ),
                ],
              )
            ],
          ))
        ],
      ),
    );
  }
}

SideBar() is a Column widget having multiple elements. Code of the sidebar is,

class SideBar extends StatefulWidget {
  @override
  State<SideBar> createState() => _SideBarState();
}

class _SideBarState extends State<SideBar> {
  @override
  Widget build(BuildContext conText) {
    return Material(
      elevation: 1,
      child: Container(
        width: 70,
        color: Color(0xFAFAFB),
        child: Padding(
          padding: const EdgeInsets.only(top: 15.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Column(
                children: [
                  SvgPicture.asset(
                    Images.topStoriesIcon,
                  ),
                  SvgPicture.asset(
                    Images.topStoriesIcon,
                  ),
                  SvgPicture.asset(
                    Images.topStoriesIcon,
                  )
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}

I got an error: Assertion failed: constraints.hasBoundedWidth is not true. But listview is working when I wrap with Expanded widget like this,

Row(
          children: [
            SideBar(),
           Expanded(
             child: ListView(
               shrinkWrap: true,
               children: [
                
               ],
             ),
           )
          ],
        ).

But at that time I got Incorrect ParentWidget error

I tried many ways but didn't get results. The expected result is attached below, enter image description here

Answer 1

You can use Positioned widget as Stack child, you dont need to have on Column

child: Stack(
  children: [
    Positioned( // if needed put it here
      top: 0,
      right: 0,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Align( /// not here
            alignment: Alignment.topRight,
            child: MouseRegion(
              cursor: SystemMouseCursors.click,
              child: Text(
                "Edit",
              ),
            ),
          ),
          Row(
            mainAxisSize: MainAxisSize.min,