Swiper has more items than should be - flutter

When Swiper (flutter_swiper: ^1.1.6) has loop false and layout stack it has one more widget during swipe.
Did someone face the same problem?
What could be done with this?
I will appreciate any help you provide.
To reproduce my issue use the code below and add an itembuilder
Swiper(
loop: false,
layout: SwiperLayout.STACK)

I used the example from the package and added the two configuration properties you mentioned. The only error I received was requiring to set the itemWidth property required when setting the SwiperLayout.STACK layout value. After doing that, I have found no issues:
Swiper(
itemBuilder: (BuildContext context,int index){
return new Image.network("http://via.placeholder.com/350x150",fit: BoxFit.fill,);
},
itemWidth: 350,
itemCount: 3,
pagination: new SwiperPagination(),
control: new SwiperControl(),
loop: false,
layout: SwiperLayout.STACK
),
Your issue might be with your itemBuilder. You should share that part of the code.

Related

listview builder has low fps(18.7 in android simulation) when scrolling

I have a fixed controller.groupedList in the form of Map<dynamic,List<Event>> and I put this into a List.builder as followings, try to get a list:
ListView.builder(
physics: BouncingScrollPhysics(),
controller: scrollController,
key: _animatedKey,
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemCount: controller.yearOld,
itemBuilder: (context, index) {
var keys = controller.groupedList.keys.toList();
var thisYearList = controller.groupedList[keys[index]];
print('thisYearList= $thisYearList'); //it will be triggered by each pixel scrolling
return TimelineItemWidget(
controller: controller,
index: index,
thisYearList: thisYearList);
},
);
Now my question, it seems each pixel I scrolled, the print method is triggered, so I guess from each pixel I scroll the screen, ListView tried to run my method which transform Map<Int,List<Event>> to thisYearList, and therefore it leads to a low fps.
In the dart coding world, is there a better way to solve this issue? Thank you for your help!

staggered grid view in flutter

I am making a grid like instagram where every seventh element is of 2X1. The problem is i want to show a different widget at seventh index but my code splits the gridTile widget rather than showing a different widget.
CODE:-
return StaggeredGridView.countBuilder(
shrinkWrap: true,
crossAxisCount: 3,
itemCount: gridTile.length,
itemBuilder: (context,index)=>gridTile[index],
staggeredTileBuilder: (index)=>StaggeredTile.count(
1,(index%7==0)?2:1,
),
);
Just Change your itemBuilder line of code as follow instead of "yourWidget" please write widget name you want to return.
itemBuilder : (context, index) {
return index % 7 == 0 ? yourWidget : gridTile[index];
},

Idea in order to address lack of scrollbar in Flutter web

I am new to flutter and using it for web. I see that there is no built in scrollbar when the page overflows the viewport
Would it be possible to somehow have a javascript script in the html that would check the height of the content periodically and add/remove scroll bar as necessary?
Does this make any sense?
Thank you
I'm not sure if its what you want but if you wrap your Listview with Scrollbar then you get the result you want:
Scrollbar(
child: ListView.builder(
itemCount: 20,
itemBuilder: (context, index) => ListTile(title: Text("Item= ${index + 1}"),),),
)
You can find more here

ReorderableListView inside SingleChildScrollView/Column

I need to put my reorderable list inside SingleChildScrollView, but the ReorderableListView() doesn't have shrink wrap like ListView(). Is there a work around to accomplish this layout without using an outdated unmaintained package? Although, I haven't tested those available outdated packages yet I don't know if they're built using different widgets or they're just building upon ReorderableListView() if so the error will persist.
you can wrap your ReorderableListView with Expanded Widget in Column.
The flutter team has released 2.0.1 stable recently, which shipped with a new designed ReorderableList class. As I tested, the ReorderableList class can work with Column and SingleChildScrollView smoothly.
code snippet like:
SingleChildScrollView(
child: Column(
children: [
ReorderableList(
controller: ScrollController(),
shrinkWrap: true,
itemCount: itemList.length,
itemBuilder: (BuildContext context, int index) {
final item = itemList[index];
return ReorderableDelayedDragStartListener(
index: index,
key: UniqueKey(),
ListTile(...),
);
},
onReorder: (int oldIndex, int newIndex) {...},
),
],
),
);
For me, I was using a Reorderable Listview inside a Column which was inside an ScrollView.
Tried multiple combinations but was getting the error, so I just wrapped each ListTile of the ListView in a container, and it worked for me. If that doesnt work then try limiting the height of each container.

Flutter swiper disable swipe when last index

I am using this plugin flutter_swiper:
Swiper(
index: currentIndex,
itemCount: 12,
itemBuilder: (BuildContext context,int index){
return PhotoView(
imageProvider: AssetImage("images/c"+(index+1).toString()+".jpg"),
);
},
),
I need the swiper to not swipe from last index to first index and not from first to last only swipe between indexes.
what I have is a list of images to swipe between
Is it possible to do this using this plugin or I should use another one ?
if so please provide another solution
It seems to be that Swiper has a property for that, called loop:
/// Set to false to disable continuous loop mode.
final bool loop;
So you could try:
Swiper(
loop: false,
...