0

my ImagePaths function is supposed to return a list and I want to access that list in my Carousel but I can't seem to figure out how to do so.. The ".lenght" and the [index] are not working and I'm not sur how to "call" them in flutter. Can someone help me please :)

here is my code for the ImagePaths function :

Future<List<String>> getImagePaths() async { final Map<String, dynamic> assets = jsonDecode(await rootBundle.loadString('AssetManifest.json')); return assets.keys .where((String key) => key.contains('photos/')) .where((String key) => key.contains('.JPG')) .toList(); }

And here is my code for my carousel :

class MyWidget extends StatefulWidget {
  const MyWidget({super.key});

  @override
  State<MyWidget> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  int activeIndex = 0;
  final controller = CarouselController();
  final imgList = ImagePaths();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("carousel try"),
        centerTitle: true,
      ),
      body: Center(
        child: Column(
          children: [
            const SizedBox(
              height: 32,
            ),
            CarouselSlider.builder(
              carouselController: controller,
              options: CarouselOptions(
                  height: 500,
                  enlargeCenterPage: true,
                  onPageChanged: (index, reason) {
                    setState(() {
                      activeIndex = index;
                    });
                  }),
              itemCount: imgList.length,
              itemBuilder: (context, index, realIndex) {
                final urlImage = imgList[index];
                return buildImage(urlImage, index);
              },
            ),
            const SizedBox(
              height: 32,
            ),
            buildButtons()
          ],
        ),
      ),
    );
  }

  Widget buildImage(String urlImage, int index) {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 12),
      color: Colors.grey,
      child: Image.network(
        urlImage,
        fit: BoxFit.cover,
      ),
    );
  }

  Widget buildButtons({bool stretch = false}) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        ElevatedButton(
          style: ElevatedButton.styleFrom(
            padding: const EdgeInsets.symmetric(horizontal: 32, vertical: 12),
          ),
          onPressed: () {
            controller.previousPage(
                duration: const Duration(milliseconds: 500));
          },
          child: const Icon(Icons.arrow_back, size: 32),
        ),
        stretch
            ? const Spacer()
            : const SizedBox(
                width: 32,
              ),
        ElevatedButton(
          style: ElevatedButton.styleFrom(
            padding: const EdgeInsets.symmetric(horizontal: 32, vertical: 12),
          ),
          onPressed: () {
            controller.nextPage(duration: const Duration(milliseconds: 500));
          },
          child: const Icon(Icons.arrow_forward, size: 32),
        ),
        stretch
            ? const Spacer()
            : const SizedBox(
                width: 32,
              ),
      ],
    );
  }
}
Coca95
  • 31
  • 5
  • You don't have an `ImagePaths` *function*. You have an `ImagePaths` *class* that has an instance method named `get`. As written, you would need to do `final imgList = await ImgPaths().get();` before you can use `.length` or `operator []` on `imgList`. However, since that's asynchronous, you should use a `FutureBuilder`. There's also no reason for `ImagePaths` to be a class instead of a freestanding function; move the `get` function out of the class and rename it. – jamesdlin Feb 06 '23 at 20:35
  • Thanks for your answer! I change it to be a function but I'm a bit lost with the futureBuilder Do you have an example? ``` Future> getImagePaths() async { final Map assets = jsonDecode(await rootBundle.loadString('AssetManifest.json')); return assets.keys .where((String key) => key.contains('photos/')) .where((String key) => key.contains('.JPG')) .toList(); } ``` Now that I moved it do I still need to do : final imgList = await ImgPaths().get(); ? Or with the futureBuilder I don't need it? – Coca95 Feb 06 '23 at 20:45

0 Answers0