clip padding while scrolling on list view in flutter

user_3674674 0
Viewed 1546

I have used clipToPadding in android to clip the padding while scrolling horizontally and vertically. Is there any specific attribute like clipToPadding in flutter? The behavior would look alike:

enter image description here

   ListView.separated(
        padding: EdgeInsets.all(16),
        scrollDirection: Axis.horizontal,
        separatorBuilder: (context, index) => SizedBox(
          width: 8,
        ),
        itemBuilder: (BuildContext context, int index) {
          return Text(data[index].name);
        },
        itemCount: data.length,
      )
flutter-listview flutter-layout flutter
1 Answers

I'm not a native android dev, but if I did understand right the "clipToPadding" option, you just want to remove padding from the ListView and add padding around it.

Container(
              height: 100.0,
              padding: EdgeInsets.symmetric(horizontal: 16.0),
              child: ListView.separated(
                scrollDirection: Axis.horizontal,
                separatorBuilder: (context, index) => SizedBox(
                  width: 8,
                ),
                itemBuilder: (BuildContext context, int index) {
                  return AspectRatio(
                    aspectRatio: 1.0,
                    child: Container(
                      color: Colors.grey[300],
                      child: Center(child: Text(index.toString())),
                    ),
                  );
                },
                itemCount: 20,
              ),
            ),

OR using Container (it's just to set max height for the listview) + separate Padding:

Container(
              height: 100.0,
              child: Padding(
                padding: EdgeInsets.symmetric(horizontal: 16.0),
                child: ListView.separated(
                  scrollDirection: Axis.horizontal,
                  separatorBuilder: (context, index) => SizedBox(
                    width: 8,
                  ),
                  itemBuilder: (BuildContext context, int index) {
                    return AspectRatio(
                      aspectRatio: 1.0,
                      child: Container(
                        color: Colors.grey[300],
                        child: Center(child: Text(index.toString())),
                      ),
                    );
                  },
                  itemCount: 20,
                ),
              ),
            ),
user_90390320
Related