Home > Mobile >  Why is the carousel slow to load images?
Why is the carousel slow to load images?

Time:01-10

I'm learning the flutter and I try to add carousel to my application. I use carousel_pro: ^1.0.0 for adding carousel to my project. But image changes slowly and I can see white screen 1-2 seconds instead of image. I have the list with images and this images I set as items for my carousel. My carousel reso equals to device reso.

How can I fix it?

My carousel code:

import 'package:flutter/material.dart';
import 'package:mink_app/themes/colors.dart';
import 'package:carousel_pro/carousel_pro.dart';

class CarouselWidget extends StatelessWidget {
  const CarouselWidget({super.key, required this.gender});

  final int gender;

  @override
  Widget build(BuildContext context) {
    List<AssetImage> images;
    if (gender == 0) {
      images = [
        AssetImage("assets/man_promo1.jpg"),
        AssetImage("assets/man_promo2.jpg"),
        AssetImage("assets/man_promo3.jpg")
      ];
    } else {
      images = [
        AssetImage("assets/promo1.jpg"),
        AssetImage("assets/promo2.jpg"),
      ];
    }
    return Carousel(
      images: images, 
      animationCurve: Curves.fastOutSlowIn,
      animationDuration: Duration(
        milliseconds: 800,
      ),
      dotBgColor: Colors.transparent,
      dotIncreasedColor: GREEN_COLOR,
      dotColor: Colors.white,
      dotSize: 5,
      dotVerticalPadding: 50,
    );
  }
}

And result that I get first two seconds

CodePudding user response:

That's normal because it's still caching the image, you better use this cached_network_image package to precaching the image so when the image is in loading state it will show different widget

  • Related