Carousel Flutter

Question

Olá!
Desenvolvi um carousel no flutter. Gostaria de saber duas coisas - mesmo porque já tentei e não consegui. Primeiro, se é possível colocar sobre a imagem que é exibida no carousel uma mensagem que vem junto dentro do objeto, e essa mensagem ser dinâmica assim como a imagem? Segundo, é possível fazer com que a imagem seja "clicável" e ao clicar redirecione para um link específico?
Segue o código:

final carousel = Carousel(
      images: listBannerNews
          .map((bannerNews) =>
              Image.memory(base64Decode(bannerNews.imagem), fit: BoxFit.fill))
          .toList(),
      dotSize: 4.0,
      dotSpacing: 15.0,
      dotColor: Colors.white,
      borderRadius: true,
      autoplayDuration: Duration(seconds: 5),
    );

final bannerTitle = Padding(
      padding: EdgeInsets.only(top: 200.0, left: 20.0),
      child: Container(
        child: Text('Teste', style:  TextStyle(color: Colors.white)),
      ),
    );

return SizedBox(
      height: 322,
      width: MediaQuery
          .of(context)
          .size
          .width,
      child: ClipRRect(
        borderRadius: BorderRadius.circular(4),
        child: Stack(
          children: [
            carousel,
            bannerTitle,
          ],
        ),
      ),
    );
  }

user198735 · Answer

Consegui resolver!
Segue o código:

_buildCarousel(List<BannerNews> listBannerNews) {

Carousel carousel = Carousel(
      dotSize: 4.0,
      dotSpacing: 15.0,
      dotColor: Colors.white,
      borderRadius: true,
      autoplayDuration: Duration(seconds: 5),
      images: listBannerNews
          .map((bannerNews) => _buildBannerBody(bannerNews))
          .toList(),
    );

return SizedBox(
      height: 322,
      width: MediaQuery.of(context).size.width,
      child: carousel,
    );
  }

_buildBannerBody(BannerNews bannerNews) {
    return Stack(children: [
      GestureDetector(
        onTap: () => launch(banner.path),
        child: Image.memory(
          base64Decode(bannerNews.imagem),
          fit: BoxFit.cover,
          width: double.infinity,
          height: double.infinity,
        ),
      ),
      Positioned(
        bottom: 60.0,
        left: 30.0,
        child: Text(
          bannerNews.tooltip,
          style: TextStyle(color: Colors.white, fontSize: 18),
        ),
      )
    ]);
  }

Criei um widget para colocar a mensagem acima da imagem, e deixa-la clicável.
Obrigado a todos!

Carousel Flutter

One Answer

Add your own answers!

Ask a Question