First of all, I think you need to know that Flutter Dart is all in `Widget`. So you have to build your slider layout in Widget which I haven't seen in your code. All layout and controller must be defined in Dart code.
Second you must know what is `StatefullWidget` and `StatelessWidge`. I suggest you can study them first before continue.
Finally, I try to build a simple StatefullWidget using the code you provide.
class SliderTest extends StatefulWidget {
@override
_SliderTestState createState() => _SliderTestState();
}
class _SliderTestState extends State<SliderTest> {
List<Map<String, dynamic>> sliders = [
{'type': 'strength', 'value': 50.0},
{'type': 'agility', 'value': 30.0},
{'type': 'speed', 'value': 20.0},
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
Row(
children: [
Slider(
value: sliders[0]['value'],
onChanged: (value) {
setState(
() {
sliders[0]['value'] = value;
_updateWeight();
},
);
},
max: 100.0,
min: 0.0,
),
Text(sliders[0]['value'].toInt().toString()),
],
),
Row(
children: [
Slider(
value: sliders[1]['value'],
onChanged: (value) {
setState(
() {
sliders[1]['value'] = value;
_updateWeight();
},
);
},
max: 100.0,
min: 0.0,
),
Text(sliders[1]['value'].toInt().toString()),
],
),
Row(
children: [
Slider(
value: sliders[2]['value'],
onChanged: (value) {
setState(
() {
sliders[2]['value'] = value;
_updateWeight();
},
);
},
max: 100.0,
min: 0.0,
),
Text(sliders[2]['value'].toInt().toString()),
],
),
],
),
);
}
void _updateWeight() {
double _sumOfSliderValues = 0;
for (var i = 0; i < sliders.length; i++) {
_sumOfSliderValues = _sumOfSliderValues + sliders[i]['value'];
}
for (var j = 0; j < sliders.length; j++) {
if (sliders[j]['value'] != _sumOfSliderValues) {
sliders[j]['value'] = (sliders[j]['value'] / _sumOfSliderValues) * 100;
}
}
}
}
CarouselSlider is already automatic here is my code that works so fine for me, you add a child of ( items )
static List<String> imgList;
int _current = 0;
static List<T> map<T>(List list, Function handler) {
List<T> result = [];
for (var i = 0; i < list.length; i++) {
result.add(handler(i, list[i]));
}
return result;
}
static List child = imgList.length > 0 ? map<Widget>(
imgList,
(index, i) {
return Container(
margin: EdgeInsets.all(5.0),
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(5.0)),
child: Stack(children: <Widget>[
Image.network(i, fit: BoxFit.cover, width: 1000.0),
Positioned(
bottom: 0.0,
left: 0.0,
right: 0.0,
child: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
Color.fromARGB(200, 0, 0, 0),
Color.fromARGB(0, 0, 0, 0)
],
begin: Alignment.bottomCenter,
end: Alignment.topCenter,
),
),
padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 20.0),
child: Text(
'No. $index image',
style: TextStyle(
color: Colors.white,
fontSize: 20.0,
fontWeight: FontWeight.bold,
),
),
),
),
]),
),
);
},
).toList():null;
//then you build your slider
CarouselSlider(
items: child,
autoPlay: true,
enlargeCenterPage: true,
aspectRatio: 2.0,
onPageChanged: (index) {
setState(() {
_current = index;
});
},
),
