udarawanasinghe / flutter-carousel-slider Goto Github PK

When using viewport fraction, return slider content is shown in both sides

Container( height: 400, child: CarouselSlider.builder( unlimitedMode: true, slideBuilder: (index) { return Container( alignment: Alignment.center, color: Colors.red, child: Text( letters[index], style: TextStyle(fontSize: 200, color: Colors.white), ), ); }, slideTransform: CubeTransform(), viewportFraction: 0.6, itemCount: itemCount??0), ),

Any planning to migrate to null-safety?

description: when CarouselSlider contains more than 1 image, everything goes correctly. but when only contains 1 image, the container only shows half of the image, the other half is blank.

issue details:
Exception caught by rendering library
The following assertion was thrown during paint():
Offset argument contained a NaN value.
'dart:ui/painting.dart':
Failed assertion: line 43: ''

The relevant error-causing widget was:
CarouselSlider-[LabeledGlobalKey#04485] file:///D:/flutter/abangate/lib/gallery_page.dart:84:39
When the exception was thrown, this was the stack:
#2 _offsetIsValid (dart:ui/painting.dart:43:10)
#3 Canvas.drawCircle (dart:ui/painting.dart:3787:12)
#4 CircularWaveIndicatorPainter.paint (package:flutter_carousel_slider/carousel_slider_indicators.dart:190:12)
#5 RenderCustomPaint._paintWithPainter (package:flutter/src/rendering/custom_paint.dart:531:13)
#6 RenderCustomPaint.paint (package:flutter/src/rendering/custom_paint.dart:572:7)
...
The following RenderObject was being processed when the exception was fired: RenderCustomPaint#5f0dc
... parentData: (can use size)
... constraints: BoxConstraints(w=10.0, h=6.0)
... size: Size(10.0, 6.0)
RenderObject: RenderCustomPaint#5f0dc
parentData: (can use size)
constraints: BoxConstraints(w=10.0, h=6.0)
size: Size(10.0, 6.0)

FlutterCarouselSlider Version: 1.0.2

My code：
Container(
height: screenSize.height,
width: screenSize.width,
child: CarouselSlider.builder(
key: _sliderKey,
unlimitedMode: true,
slideBuilder: (index) {
return Container(
color: Colors.black,
alignment: Alignment.center,
child: GestureDetector(
child: Image.file(
File(widget.myContents[widget.contentIndex].images[index]),
),
onTap: () {
showDetails = !showDetails;
setState(() {});
},
),
);
},
slideTransform: ParallaxTransform(),
slideIndicator: CircularWaveSlideIndicator(
currentIndicatorColor: Colors.white38,
indicatorBackgroundColor: Colors.white24,
padding: EdgeInsets.only(bottom: 32),
indicatorRadius: 3,
itemSpacing: 10,
),
itemCount: widget.myContents[widget.contentIndex].images.length),
),

Hey bro, really nice plugin but can you please add this feature?

E/flutter (12458): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: 'package:flutter/src/widgets/page_view.dart': Failed assertion: line 173 pos 7: 'positions.isNotEmpty': PageController.page cannot be accessed before a PageView is built with it.
E/flutter (12458): #0 _AssertionError._doThrowNew (dart:core-patch/errors_patch.dart:51:61)
E/flutter (12458): #1 _AssertionError._throwNew (dart:core-patch/errors_patch.dart:40:5)
E/flutter (12458): #2 PageController.page (package:flutter/src/widgets/page_view.dart:173:7)
E/flutter (12458): #3 CarouselControllerImpl.animateToPage (package:flutter_carousel_media_slider/src/carousel_controller.dart:115:56)
E/flutter (12458): #4 _FlutterCarouselMediaSliderState.loadNextPage (package:flutter_carousel_media_slider/flutter_carousel_media_slider.dart:140:16)
E/flutter (12458):

With flutter 3.3. I get the following error in Visual Studio Code when trying to run the example:

The name 'CarouselSliderState' isn't a type so it can't be used as a type argument.
Try correcting the name to an existing type, or defining a type named 'CarouselSliderState'.

for the line

GlobalKey<CarouselSliderState> _sliderKey = GlobalKey();

and when trying to execute the code with flutter run -d chrome

lib/.../cube_slider.dart:319:13: Error: Type 'CarouselSliderState' not found.
  GlobalKey<CarouselSliderState> _sliderKey = GlobalKey();

I imported the modules like

import 'package:flutter/material.dart';
import 'package:flutter_carousel_slider/carousel_slider.dart';
import 'package:flutter_carousel_slider/carousel_slider_indicators.dart';
import 'package:flutter_carousel_slider/carousel_slider_transforms.dart';

I got this after running this example

import 'package:flutter/material.dart';
import 'package:flutter_carousel_slider/carousel_slider.dart';

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
@OverRide
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Carousel Slider',
home: MyHomePage(title: 'Flutter Carousel Slider'),
);
}
}

class MyHomePage extends StatefulWidget {
final String title;

MyHomePage({Key key, this.title}) : super(key: key);

@OverRide
_MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State {
final List colors = [
Colors.red,
Colors.orange,
Colors.yellow,
Colors.green,
Colors.blue,
Colors.indigo,
Colors.purple,
];
final List letters = [
"A",
"B",
"C",
"D",
"E",
"F",
"G",
];

bool _isPlaying = false;
GlobalKey _sliderKey = GlobalKey();

@OverRide
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: ListView(
children: [
Container(
height: 500,
child: CarouselSlider.builder(
key: _sliderKey,
unlimitedMode: true,
slideBuilder: (index) {
return Container(
alignment: Alignment.center,
color: colors[index],
child: Text(
letters[index],
style: TextStyle(fontSize: 200, color: Colors.white),
),
);
},
slideTransform: CubeTransform(),
slideIndicator: CircularSlideIndicator(
padding: EdgeInsets.only(bottom: 32),
),
itemCount: colors.length),
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 32),
child: Align(
child: ConstrainedBox(
constraints: BoxConstraints(minWidth: 240, maxWidth: 600),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
IconButton(
iconSize: 48,
icon: Icon(Icons.skip_previous),
onPressed: () {
_sliderKey.currentState.previousPage();
},
),
IconButton(
iconSize: 64,
icon: Icon(
_isPlaying
? Icons.pause_circle_outline
: Icons.play_circle_outline,
),
onPressed: () {
setState(
() {
_isPlaying = !_isPlaying;
_sliderKey.currentState.setPlaying(_isPlaying);
},
);
},
),
IconButton(
iconSize: 48,
icon: Icon(Icons.skip_next),
onPressed: () {
_sliderKey.currentState.nextPage();
},
),
],
),
),
),
),
],
),
);
}
}

Carousel not sliding with mouse

Add it for constructor or fix.

// ignore: sort_constructors_first

Add border for indicator

As the title says, the child widgets of the carousel are being disposed. This leads to a problem if you have some async logic when initiating the state of the widget. For example in my scenario, I'm fetching image from database and this leads to flashing.

See the gif

CarouselSlider.builder(
    slideTransform: StackTransform(),
    itemCount: viewModel.projects.length,
    slideBuilder: (index) => InspirationDetailView(
      project: viewModel.projects[index],
    ),
  ),

Is there a way to preload next image in Carousel?

if slideTransform is null, use slideTransform: DefaultTransform(), is better.

and slideIndicator is not needed.
I put indicatorRadius: 0, instead.

            slideIndicator: CircularSlideIndicator(
              padding: EdgeInsets.only(bottom: 32),
              indicatorRadius: 0,
            ),

I would be great to have from theCarouselSliderController the current index and if we could have animateTo(index) function

Update readme app version number.

First of all: Thanks for the nice package!

It would be great if we could define a callback which is triggered on slide left or right.

Hi, is it possible to add a simple CrossFade transition? Thanks

Hi @UdaraWanasinghe

first thank you for great widget,

I wanna ask you, how can we set the initial index for this widget?

Thank you,
Erwan