Flutter Listview with rounded corners-CodePudding

I'm trying to create a listview with rounded corners in Flutter. I thought I might have been on the right track by adding a ClipRRect wrapped around the listview. However, when I did so only the top corners were rounded, the bottom ones were not, I assume this is because the listview did not have enough rows to take up the full screen, but the ClipRRect, must be taking up the full scren width.

What's the best way to add rounded corners to the listview widget?

CodePudding user response：

try this for round corners with list.

Container(
    decoration: BoxDecoration(
            border: Border.all(
                color: Color(0xFFF05A22),
                style: BorderStyle.solid,
                width: 1.0,
            ),
            color: Color(0xFFF05A22),
            borderRadius: BorderRadius.circular(30.0),
        ),
    child:ListView(
    children: new List.generate(
        100,
        (index) => Column(
                mainAxisAlignment: MainAxisAlignment.start,
                children: <Widget>[
                  Text("data $index"),
                  Divider(),
                ])),
  ),
    )

CodePudding user response：

Wrap your ListView with SizedBoxand provide size.

body: LayoutBuilder(
  builder: (context, constraints) {
    return ClipRRect(
      borderRadius: BorderRadius.circular(12.0),
      child: SizedBox(
        height: constraints.maxHeight,//based on your need
        width: constraints.maxWidth, 
        child: ListView.builder(