How to create GridView Layout in Flutter

by

Use whichever suits your need.

  1. GridView.count(...)

    GridView.count(
  crossAxisCount: 2,
  children: <Widget>[
    FlutterLogo(),
    FlutterLogo(),
    FlutterLogo(),
    FlutterLogo(),
  ],
)

  2. GridView.builder(...)

    GridView.builder(
  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
  itemBuilder: (_, index) => FlutterLogo(),
  itemCount: 4,
)

  3. GridView(...)

    GridView(
  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
  children: <Widget>[
    FlutterLogo(),
    FlutterLogo(),
    FlutterLogo(),
    FlutterLogo(),
  ],
)

  4. GridView.custom(...)

    GridView.custom(
  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
  childrenDelegate: SliverChildListDelegate(
    [
      FlutterLogo(),
      FlutterLogo(),
      FlutterLogo(),
      FlutterLogo(),
    ],
  ),
)

  5. GridView.extent(...)

    GridView.extent(
  maxCrossAxisExtent: 400,
  children: <Widget>[
    FlutterLogo(),
    FlutterLogo(),
    FlutterLogo(),
    FlutterLogo(),
  ],
)

Output (same for all):

enter image description here

More Related Contents:

  1. How to deal with unwanted widget build?
  2. Flutter: Scrolling to a widget in ListView
  3. Flutter – Wrap text on overflow, like insert ellipsis or fade
  4. How to refresh an AlertDialog in Flutter?
  5. How to show/hide widgets programmatically in Flutter
  6. How to add a ListView to a Column in Flutter?
  7. How to create dropown list in flutter where data comes from API?
  8. How do I do the “frosted glass” effect in Flutter?
  9. How to add image in Flutter
  10. InkWell not showing ripple effect
  11. Scroll Function In Flutter Web
  12. Flutter: Expanded vs Flexible
  13. How to detect swipe in flutter
  14. Sizing elements to percentage of screen width/height
  15. Style BottomNavigationBar in Flutter
  16. Flutter: Remove padding in buttons – FlatButton, ElevatedButton, OutlinedButton
  17. error in getting data from api in flutter
  18. How can I navigate between 2 classes, one of them requires passing data? in flutter
  19. TextField inside of Row causes layout exception: Unable to calculate size
  20. Vertical viewport was given unbounded height
  21. How to check if scroll position is at top or bottom in ListView?
  22. How can I layout widgets based on the size of the parent?
  23. Flutter Zoomable Widget
  24. Flutter use variable created inside Future builder outside of the build method,
  25. Flutter: “RenderFlex children have non-zero flex but incoming height constraints are unbounded”
  26. Flutter: BottomNavigationBar rebuilds Page on change of tab
  27. How to use BottomNavigationBar with Navigator?
  28. How can I add shadow to the widget in flutter?
  29. Preserving state between tab view pages
  30. Flutter – How to make a custom TabBar

Leave a Comment