I want to create an appointment calendar. I want to show the days by swiping to the right in the form of a slider. I want to take the days as a list and show them on the screen in order. But as I have indicated in the screenshot, it always shows the same day and number. Can you help with this? Where am i missing something.
Swiper imageSlider(context) {
var weekDays = {'19':'Monday','20':'Tuesday','21':'Wednesday','22':'Thursday','23':'Friday'};
List keys = weekDays.keys.toList();
List values = weekDays.values.toList();
int _index = 0;
return new Swiper(
viewportFraction: 0.2,
autoplay: false,
onIndexChanged: (value) {
_index = value;
},
itemBuilder: (BuildContext context, int index) {
return Container(
child: Column(
children: [
Container(
height: 30,
color: Colors.blue,
),
Text('$_index'),
Text(values[1])
],
),
);
},
itemCount: 10);
}
Screenshot:
While the
viewportFraction
already handling the division part, useitemBuilder
's index,