Carousel - 이미지 슬라이더 만들기

 

앱 또는 웹을 개발하는 경우에 슬라이딩 이미지, 이미지 캐러셀 및 기타 슬라이더를 사용하여야 할 경우가 있다

이런 경우 carousel_slider가 필요할 수 있다

1. pubspec.yaml 화일에 아래처럼 추가하자

dependencies:

  flutter:

    sdk: flutter

  carousel_slider:

2. 사용하는 파일에 "import 'package:carousel_slider/carousel_slider.dart';"를 상단에 추가한다

3. 이미지 슬라이더의 현상태를 알고 싶은 경우CarouselOptions 중에 onPageChanged:를사용

CarouselSlider(

    options: CarouselOptions(

    autoPlay: true,

    height: 250,

    viewportFraction: 1.0,

    onPageChanged: (index, reason) {

        setState(() {

       _current = index;

       });

    },

),

onPageChanged가 발생할 때 마다  _current에 저장된다

참고)

CarouselSlider( options: CarouselOptions( onPageChanged: (index, reason) ) 이렇게 option의 한 종류이다

4. 이미지 위에 무언가를 표시하고 싶은 경우 Stack 위젯을 사용하라

 

참고) babagih.com/flutter-carousel-how-to-create-image-slider/