Overlapping parent

[cloudygeek]

Hi

The carousel widget is great and works really well with good options. but the basic constraining to the parent eg a Card, doesn't seem to work?

eg as shown here the carousel is overlapping the edges of the card shown in red lines.

any ideas?

thanks

[nixrajput]

Hi @cloudygeek,

Can you share your piece of code where you have used the flutter_carousel_widget in your application.

I think this is not an issue.

I would be happy to help you.

Thanks.
@nixrajput

[cloudygeek]

thanks

return  Padding(
      padding: const EdgeInsets.all(12.0),
      child: Card(
        elevation: 6,
 child: FlutterCarousel(
      options: CarouselOptions(
          height: 130.0,
          showIndicator: false,
          slideIndicator: CircularSlideIndicator(),
          enableInfiniteScroll: true,
          reverse: false,
          autoPlay: true,
          autoPlayInterval: Duration(seconds: 5),
          autoPlayAnimationDuration: Duration(milliseconds: 800),
          autoPlayCurve: Curves.fastOutSlowIn,
          enlargeCenterPage: true,
          enlargeStrategy: CenterPageEnlargeStrategy.height),
      items: images.map((media) {
        return Builder(
          builder: (BuildContext context) {
            return Container(
                width: MediaQuery.of(context).size.width,
                margin: EdgeInsets.symmetric(horizontal: 0.0),
                child: CachedNetworkImage(
                  imageUrl: media,
                ));
          },
        );
      }).toList(),
    )));

[nixrajput]

Hi @cloudygeek,

Are you trying to show carousel in a single card??
Or you want to show each carousel child in a card??

[cloudygeek]

Yes each card was going to have a carousel in it.

Not sure why it isn't being constrained to the parent widgets size.
Thanks

[nixrajput]

return  Padding(
      padding: const EdgeInsets.all(12.0),
      child:  FlutterCarousel(
      options: CarouselOptions(
          height: 130.0,
          showIndicator: false,
          slideIndicator: CircularSlideIndicator(),
          enableInfiniteScroll: true,
          reverse: false,
          autoPlay: true,
          autoPlayInterval: Duration(seconds: 5),
          autoPlayAnimationDuration: Duration(milliseconds: 800),
          autoPlayCurve: Curves.fastOutSlowIn,
          enlargeCenterPage: true,
          enlargeStrategy: CenterPageEnlargeStrategy.height),
      items: images.map((media) {
        return Builder(
          builder: (BuildContext context) {
            return Card(
               elevation: 6,
                child: CachedNetworkImage(
                  imageUrl: media,
                  width: double.infinty,
                ));
          },
        );
      }).toList(),
    ));

I think this will resolve your issue.

[cloudygeek]

no that doesn't fix it.

[nixrajput]

Hi @cloudygeek

Please elaorate your issue with more description and if required try to include piece of code as well as screenshot of your output.

Thanks.