GridView other Example

 import "package:flutter/gestures.dart";

import "package:flutter/material.dart";

void main() {
  runApp(OtherApp(),);
}
class OtherApp extends StatelessWidget {
  OtherApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: "GridView Colors",
      theme: ThemeData(
        primarySwatch: Colors.indigo,
      ),
      home: GridViewOtherDemo(),
    );
  }
}
class GridViewOtherDemo extends StatelessWidget {
  GridViewOtherDemo({super.key});

  var arrColors = [Colors.orange, Colors.pink, Colors.grey, Colors.purple, Colors.lime, Colors.deepOrange, Colors.lightGreen,
              Colors.red, Colors.teal, Colors.yellow, Colors.green, Colors.brown, Colors.black, Colors.cyan, Colors.indigo,];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("GridView Colors"),
      ),
      // body: Column(
      //   children: [
      //     Expanded(
      //       child: ListView.builder(
      //         itemBuilder: (context, index) {
      //           return Padding(
      //             padding: const EdgeInsets.all(8.0),
      //             child: Positioned(
      //               left: 10.0,
      //                 child: Container(width: 200, height: 200, color: arrColors[index],)),
      //           );
      //         },
      //         itemCount: arrColors.length,
      //         scrollDirection: Axis.horizontal,
      //         // shrinkWrap: true,
      //       ),
      //     ),
      //     Expanded(
      //       child: ListView.builder(
      //         itemBuilder: (context, index) {
      //           return MediaQuery.removePadding(
      //             context: context,
      //               removeTop: true,
      //               child: Container(width: 200, height: 200, color: arrColors[index],));
      //         },
      //         itemCount: arrColors.length,
      //         padding: EdgeInsets.only(left: 8.0, right: 8.0, bottom: 8.0,),
      //       ),
      //     ),
      //   ],
      // ),

      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Expanded(
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: GridView.builder(
                itemBuilder: (context, index) {
                  return Container(color: arrColors[index],);
                },
                itemCount: arrColors.length,
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 2,
                  crossAxisSpacing: 11.0,
                  mainAxisSpacing: 11.0,
                ),
                scrollDirection: Axis.horizontal,
                physics: AlwaysScrollableScrollPhysics(),
              ),
            ),
          ),

          Expanded(
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: GridView.builder(
                itemBuilder: (context, index) {
                  return Container(color: arrColors[index],);
                },
                itemCount: arrColors.length,
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 2,
                  crossAxisSpacing: 11.0,
                  mainAxisSpacing: 11.0,
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}