Generate a "Imagelist" for every "packageId" packageId is "$index" I want to return "List"" But I am getting "Future<List>"" to fix it, i just need to "await" but build cant do "Async" What i am doing wrong ? ApiUrl is like /api/packages and after this ApiUrl is like /api/packages/$index/images as List BackEnd Services is sending back the data to widget I have seen with doing print statments First FutureBuilder is running fine but when it comes to next Data is not showing. Dummy ImageDataModal is working and showing the expected behaviour

  class _HomePageState extends State<HomePage> {
  AppStateViewModal appStateViewModal = AppStateViewModal();

  late Future<List<PackageDataModal>> packageList;

  @override
  void initState() {
    super.initState();
    packageList = _getPackageList();
  }

  Future<List<PackageDataModal>> _getPackageList() async {
    return await appStateViewModal.getPackages();
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
      future: packageList,
      builder: (context,
              AsyncSnapshot<List<PackageDataModal>> packageSnapshot) =>
          packageSnapshot.hasData
              ? GridView.builder(
                  itemCount: packageSnapshot.data!.length,
                  gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 1),
                  itemBuilder: (context, index) => CardView(
                    packageData: PackageDataModal(
                        title: packageSnapshot.data![index].title,
                        description: packageSnapshot.data![index].description,
                        packageId: packageSnapshot.data![index].packageId),
                    imageList: const <ImageDataModal>[
                      // Generate a "Imagelist" for every "packageId"
                      // packageId is "$index"
                      // I want to return "List<ImageDataModal>""
                      // But I am getting "Future<List<ImageDataModal>>""
                      // to fix it, i just need to "await" but build cant do "Async"
                      // What i am doing wrong ?
                      // ApiUrl is like /api/packages
                      // and after this
                      // ApiUrl is like /api/packages/$index/images as List
                      // BackEnd Services is sending back the data to widget
                      // I have seen with doing print statments
                      // First FutureBuilder is running fine but when it comes to next
                      // Data is not showing.
                      // Dummy ImageDataModal is working and shwoing the expected behaviour
                    ],
                  ),
                )
              : const Center(
                  child: CircularProgressIndicator(),
                ),
    );
  }
}

I was trying to Pass the Future to next Widget and then trying to use FutureBuilder but no success. Data is not reaching there.

class CardView extends StatefulWidget {
  const CardView({Key? key, required this.imageList, required this.packageData})
      : super(key: key);

  final PackageDataModal packageData;
  final Future<List<ImageDataModal>> imageList;

  @override
  State<CardView> createState() => _CardViewState();
}

class _CardViewState extends State<CardView> {
  @override
  Widget build(BuildContext context) {
    return FutureBuilder<List<ImageDataModal>>(
        future: widget.imageList,
        builder: (context, imageSnapshot) => Card(
              margin: const EdgeInsets.all(8.0),
              child: Column(
                children: [
                  CarouselSlider.builder(
                    itemCount: imageSnapshot.data!.length,
                    itemBuilder: (context, imageIndex, pageIndex) =>
                        CachedNetworkImage(
                      imageUrl: imageSnapshot.data![imageIndex].image,
                      placeholder: (context, text) => const Placeholder(),
                    ),
                    options:
                        CarouselOptions(aspectRatio: 16 / 9, autoPlay: true),
                  ),
                  Text(widget.packageData.title),
                  const SizedBox(height: 2),
                  Text(widget.packageData.description),
                ],
              ),
            ));
  }
}

I checked the Service which is calling the api to fetch the data is working fine and i checked it that it is reaching the card_view_widget.dart file properly

CodePudding user response：

First correct your card_view_widget to be null aware(Handle null list)

class CardView extends StatefulWidget {
  const CardView({Key? key, this.imageList, required this.packageData})
      : super(key: key);

  final PackageDataModal packageData;
  final Future<List<ImageDataModal>>? imageList;

  @override
  State<CardView> createState() => _CardViewState();
}

class _CardViewState extends State<CardView> {
  @override
  Widget build(BuildContext context) {
    return FutureBuilder<List<ImageDataModal>>(
      future: widget.imageList,
      builder: (context, imageSnapshot) {
        if (!imageSnapshot.hasData &&
            imageSnapshot.connectionState == ConnectionState.waiting) {
          return const Center(
            child: CircularProgressIndicator(),
          );
        }

        if (!imageSnapshot.hasData) {
          return Text(
            'No image found',
            style: Theme.of(context).textTheme.subtitle1,
          );
        }

        return Card(
          margin: const EdgeInsets.all(8.0),
          child: Column(
            children: [
              CarouselSlider.builder(
                itemCount: imageSnapshot.data!.length,
                itemBuilder: (context, imageIndex, pageIndex) =>
                    CachedNetworkImage(
                  imageUrl: imageSnapshot.data![imageIndex].image,
                  placeholder: (context, text) => const Placeholder(),
                ),
                options: CarouselOptions(aspectRatio: 16 / 9, autoPlay: true),
              ),
              Text(widget.packageData.title),
              const SizedBox(height: 2),
              Text(widget.packageData.description),
            ],
          ),
        );
      },
    );
  }
}

let me know of other errors

CodePudding user response：

I found the solution. Actually my modal which is Modal.fromjson was mapping the wrong key. i was getting the http response properly but it was sending the null data to the Future.

it was String itemId but i changed it previously and forgot to do the fix to String packageId As i was getting json string