I get a space error when using Banner Carousel

Question

I used a banner carousel inside a container but there are gaps I don't want from left and right

   Container(
                height: Get.height * 0.32,
                decoration: const BoxDecoration(
                  borderRadius: BorderRadius.only(
                    bottomLeft: Radius.circular(25),
                    bottomRight: Radius.circular(25),
                  ),
                ),
                child: BannerCarousel(
                  height: Get.height * 0.32,
                  banners: BannerImages.listBanners,
                  onTap: (id) => print('Tapped on $id'),
                ),
              ),

I tried changing the width values, I tried wrapping it with padding and giving it a symmetrical value, I even tried giving it a negative value

Answer 1

Give the margin property and set it to EdgeInsets.zero because the default value is 16. You can see from the package API references.

This is the result:

This is the final code:

Container(
  height: Get.height * 0.32,
  decoration: const BoxDecoration(
    borderRadius: BorderRadius.only(
      bottomLeft: Radius.circular(25),
      bottomRight: Radius.circular(25),
    ),
  ),
  child: BannerCarousel(
    margin: EdgeInsets.zero, // <----- Add this
    height: Get.height * 0.32,
    banners: BannerImages.listBanners,
    onTap: (id) => print('Tapped on $id'),
  ),
),

Hopefully it can solve your problem 😉