'flutter: How to design category gridview(dynamic) under the carousel slider in home page?

eg: details about the questions ...........................................................................................................................I've implemented carousel slider but i want to keep GridView(category) under the slider.can you help me?. category(Gridview) will be dynamic.Below i've attached the Home page code please find and check it.i've created a model class also for category i've confused about to keep category gridview under carousel slider.

Home Page :-

import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
import 'package:newbharatbiz/Model%20Class/category_model.dart';
import 'package:newbharatbiz/Screens/SearchServiceProvider.dart';
import 'package:newbharatbiz/Utils/MySharedPreferences.dart';
import 'package:newbharatbiz/Utils/NavDrawer.dart';
import '../Model Class/banner_model.dart';
import 'VendorRegistrationPage.dart';
import 'package:location/location.dart';
import 'package:geocoder/geocoder.dart';
import 'package:flutter/services.dart';
import 'package:shared_preferences/shared_preferences.dart';

final String bannerAPI = "https://newbharatbiz.in/mobile_api/v4/all_banner.php";
final String CategoryAPI =
    "https://newbharatbiz.in/mobile_api/v4/category_list.php";

class HomePage extends StatelessWidget {
  Future<BannerModel> fetchAlbum() async {
    final response = await http.get(Uri.parse(bannerAPI));
    if (response.statusCode == 200) {
      // If the server did return a 200 OK response,
      // then parse the JSON.
      return BannerModel.fromJson(jsonDecode(response.body));
    } else {
      // If the server did not return a 200 OK response,
      // then throw an exception.
      throw Exception('Failed to load album');
    }
  }

  Future<CategoryModel> fetchCategory() async {
    final response = await http.get(Uri.parse(CategoryAPI));
    if (response.statusCode == 200) {
      // If the server did return a 200 OK response,
      // then parse the JSON.
      return CategoryModel.fromJson(jsonDecode(response.body));
    } else {
      // If the server did not return a 200 OK response,
      // then throw an exception.
      throw Exception('Failed to load album');
    }
  }

  late DateTime currentBackPressTime;
  List<String> imagesList = [];
  var currentLocation;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        floatingActionButton: FloatingActionButton(
          backgroundColor: Colors.deepOrangeAccent,
          child: Icon(Icons.add),
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => VendorRegistrationPage(),
              ),
            );
          },
        ),
        drawer: NavDrawer(),
        appBar:
            AppBar(title: Text('New Bharat Biz'), centerTitle: true, actions: [
          IconButton(
            onPressed: () async {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => SearchServiceProvider(),
                ),
              );
            },
            icon: Icon(Icons.search),
          ),
        ]),
        body: Column(mainAxisAlignment: MainAxisAlignment.start, children: [
          FutureBuilder<BannerModel>(
              future: fetchAlbum(),
              builder: (BuildContext context, snapshot) {
                if (snapshot.hasData) {
                  getUserLocation();
                  print((snapshot.data));
                  snapshot.data?.banner.forEach((e) {
                    imagesList.add(snapshot.data!.imgPath + e.image);
                    print(imagesList.length);
                  });
                  return CarouselSlider(
                    //add return keyword here
                    options: CarouselOptions(
                      height: 160,
                      aspectRatio: 16 / 9,
                      viewportFraction: 0.8,
                      initialPage: 0,
                      enableInfiniteScroll: true,
                      reverse: false,
                      autoPlay: true,
                      autoPlayInterval: const Duration(seconds: 3),
                      autoPlayAnimationDuration:
                          const Duration(milliseconds: 800),
                      autoPlayCurve: Curves.fastOutSlowIn,
                      enlargeCenterPage: true,
                    ),
                    items: imagesList
                        .map(
                          (item) => Center(
                              child: Image.network(item,
                                  fit: BoxFit.cover, width: 1000)),
                        )
                        .toList(),
                  );
                }

                return const Center(
                  child: SizedBox(
                    width: 16,
                    height: 16,
                    child: CircularProgressIndicator(
                      strokeWidth: 2,
                      valueColor: AlwaysStoppedAnimation(Colors.blue),
                    ),
                  ),
                );
              }
              // By default, show a loading spinner.
              )
        ]));
  }

  Future<bool> onWillPop() {
    DateTime now = DateTime.now();
    if (currentBackPressTime == null ||
        now.difference(currentBackPressTime) > Duration(seconds: 2)) {
      currentBackPressTime = now;
      return Future.value(false);
    }
    return Future.value(true);
  }

  getUserLocation() async {
    //call this async method from whereever you need
    LocationData? myLocation;
    String error;
    Location location = new Location();
    try {
      myLocation = await location.getLocation();
    } on PlatformException catch (e) {
      if (e.code == 'PERMISSION_DENIED') {
        error = 'please grant permission';
        print(error);
      }
      if (e.code == 'PERMISSION_DENIED_NEVER_ASK') {
        error = 'permission denied- please enable it from app settings';
        print(error);
      }
      myLocation = null;
    }
    currentLocation = myLocation;
    final coordinates =
        new Coordinates(myLocation!.latitude, myLocation!.longitude);
    var addresses =
        await Geocoder.local.findAddressesFromCoordinates(coordinates);
    var first = addresses.first;
    String adminArea = first.adminArea;
    String locality = first.locality;
    String subLocality = first.subLocality;
    String subAdminArea = first.subAdminArea;
    String addressLine = first.addressLine;
    String featureName = first.featureName;
    String thoroughfare = first.thoroughfare;
    String subThoroughfare = first.subThoroughfare;
    //  print(' ${first.locality}, ${first.adminArea},${first.subLocality}, ${first.subAdminArea},${first.addressLine}, ${first.featureName},${first.thoroughfare}, ${first.subThoroughfare}');

    MySharedPreferences.instance.setStringValue("addressLine", addressLine);

    return first;
  }
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source