My Blog

My WordPress Blog

My Blog

My WordPress Blog

Displaying Data in a Grid View

This example illustrates how to create a grid layout to display images or items.

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
return MaterialApp(
  title: 'Grid View Example',
  theme: ThemeData(primarySwatch: Colors.blue),
  home: GridViewExample(),
);
} } class GridViewExample extends StatelessWidget { final List<String> _images = [
'https://via.placeholder.com/150',
'https://via.placeholder.com/150',
'https://via.placeholder.com/150',
'https://via.placeholder.com/150',
'https://via.placeholder.com/150',
'https://via.placeholder.com/150',
]; @override Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(title: Text('Grid View Example')),
  body: GridView.builder(
    gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
      crossAxisCount: 2,
      childAspectRatio: 1,
    ),
    itemCount: _images.length,
    itemBuilder: (context, index) {
      return Card(
        child: Image.network(
          _images&#91;index],
          fit: BoxFit.cover,
        ),
      );
    },
  ),
);
} }
Displaying Data in a Grid View

Leave a Reply

Your email address will not be published. Required fields are marked *

Scroll to top