Flutter / layouts / GridView - Rounded corner
GridView -Rounded Corner
-
Usage
To implement a GridView with rounded corners for its items in Flutter, you can use a combination of GridView.builder and ClipRRect
import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: GridViewRoundedExample(), ); } } class GridViewRoundedExample extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('GridView with Rounded Corners'), ), body: GridView.builder( padding: EdgeInsets.all(8.0), gridDelegate: SliverGridDelegateWithFixedCrossAxisCount( crossAxisCount: 2, crossAxisSpacing: 8.0, mainAxisSpacing: 8.0, ), itemCount: 10, itemBuilder: (context, index) { return ClipRRect( borderRadius: BorderRadius.circular(12.0), child: Container( color: Colors.blue, // Replace with your item content child: Center( child: Text( 'Item $index', style: TextStyle( color: Colors.white, fontSize: 20.0, ), ), ), ), ); }, ), ); } }