changing slider value as List item value in flutter New version - flutter

Question

Yesterday i have ask question about this topic ,yesterday it was test project to understand the issue ,today i tried to apply what i learned on my app ,but i get small error i can't fix it.
I have this class file (viewdegree.dart):
class Digree {
final int index;
final String title_k;
final String title_a;
final String aya;
final String link;
final String activity_k;
final String activity_a;
String act_id;
String mydigree;
Digree(this.index, this.title_k, this.title_a, this.aya, this.link,
this.activity_k, this.activity_a, this.act_id, this.mydigree);
}
I have this page which import above class ,the page send request to API to display some rows ,in each row i have slider to detect the degree for each item data.
when i change the slider value it send post request to server to add degree to the row or update it ,the i want to setstate the value of Slider to new degree.
the page code :
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
import 'package:jiyanUquraan/classes/viewdigree.dart';
import 'package:youtube_player_flutter/youtube_player_flutter.dart';
class DisplayList extends StatefulWidget {
#override
_DisplayListState createState() => _DisplayListState();
}
TextEditingController insertedDegree = TextEditingController();
var video_link = '';
class _DisplayListState extends State<DisplayList> {
#override
Widget build(BuildContext context) {
List digrees = [];
var widthView = MediaQuery.of(context).size.width;
Map rdata = ModalRoute.of(context).settings.arguments;
var did = int.parse(rdata['dayId'].toString());
var u_id = rdata['userID'];
var m_id = rdata['courseId'];
int w_id;
if (did <= 6) {
w_id = 1;
} else if (did <= 12) {
w_id = 2;
} else if (did <= 18) {
w_id = 3;
} else {
w_id = 4;
}
Future<List> fetchDigrees() async {
var url =
'http://10.0.2.2/jiyan/test/api/activities/activiy_list.php?d_id=$did&m_id=$m_id&u_id=$u_id';
var response = await http.get(url);
var data = jsonDecode(response.body);
print(data);
for (var x in data) {
Digree newdigree = Digree(
x['index'],
x['title_k'],
x['title_a'],
x['aya'],
x['link'],
x['activity_k'],
x['activity_a'],
x['act_id'],
x['mydigree']);
digrees.add(newdigree);
}
return digrees;
}
// Insert Func
send_degree(uId, actId, degree, w_id, did, m_id) async {
var sendData = {
'u_id': uId.toString(),
'act_id': actId.toString(),
'degree': degree.toString(),
'm_id': m_id.toString(),
'd_id': did.toString(),
'w_id': w_id.toString()
};
var url = 'http://10.0.2.2/jiyan/test/api/data/changedata.php';
var response = await http.post(url, body: sendData);
var data = jsonDecode(response.body);
if (data.status) {
print('OK');
}
}
// End of Insert Func
return FutureBuilder(
future: fetchDigrees(),
builder: (context, snapshot) {
Map rdata = ModalRoute.of(context).settings.arguments;
var lang = rdata['lang'];
if (snapshot.data == null) {
return Center(
child: Text("Loading"),
);
} else {
YoutubePlayerController _controller = YoutubePlayerController(
initialVideoId: snapshot.data[0].link,
flags: YoutubePlayerFlags(
autoPlay: false,
mute: false,
));
return Container(
height: MediaQuery.of(context).size.height,
width: MediaQuery.of(context).size.width,
child: ListView(
padding: EdgeInsets.fromLTRB(25, 20, 25, 20),
shrinkWrap: true,
children: <Widget>[
Text(
lang == 'k'
? snapshot.data[0].title_k
: snapshot.data[0].title_a,
textAlign: TextAlign.center,
style: TextStyle(fontSize: 32, color: Colors.white)),
//for top margin
SizedBox(height: 20.0),
// dexription
Container(
padding: const EdgeInsets.all(15),
width: widthView,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(25),
color: const Color.fromRGBO(180, 80, 80, 0.3)),
child: Text(snapshot.data[0].aya,
textAlign: TextAlign.justify,
textDirection: TextDirection.rtl,
style: TextStyle(
fontSize: 26, color: Colors.greenAccent[100])),
),
// now populating your ListView for `Directionality`
Column(
children: <Widget>[
// Start activities
Column(
children: snapshot.data.map<Widget>((item) {
double _value;
var xx = double.parse(item.mydigree);
if (xx > 0) {
_value = double.parse(item.mydigree);
} else {
_value = 0.0;
}
return Directionality(
textDirection: TextDirection.rtl,
child: Column(
children: <Widget>[
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(15),
border: Border.all(
width: 2, color: Colors.white),
color: Color.fromRGBO(230, 200, 200, 0.2)),
width: widthView,
padding: EdgeInsets.all(25),
margin: EdgeInsets.fromLTRB(0, 25, 0, 25),
child: Column(
children: <Widget>[
Text(
lang == 'k'
? item.activity_k
: item.activity_a,
textAlign: TextAlign.justify,
style: TextStyle(
fontSize: 28, color: Colors.white),
),
SizedBox(
height: 15,
),
Container(
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
color: Colors.yellow[200]
.withOpacity(0.2),
spreadRadius: 2,
blurRadius: 20,
)
],
borderRadius:
BorderRadius.circular(15),
color:
Color.fromRGBO(0, 0, 0, 0.4)),
width: widthView,
padding: EdgeInsets.all(10),
child: Slider(
max: 100,
min: 0,
divisions: 20,
value: _value,
label: _value.round().toString(),
onChanged: (val) {
send_degree(u_id, item.act_id, val,
w_id, did, m_id);
setState(() {
_value = val;
item.mydigree = val.toString();
});
},
))
],
),
)
],
),
);
}).toList()),
// End activities
SizedBox(
height: 20,
),
Text('خەلەکا ئەڤرو',
textAlign: TextAlign.right,
style: TextStyle(fontSize: 26, color: Colors.yellow)),
SizedBox(
height: 20,
),
YoutubePlayer(
controller: _controller,
showVideoProgressIndicator: true,
progressIndicatorColor: Colors.blueAccent,
),
],
),
],
),
);
}
});
}
}
When i change the slider value it is come back to zero and degree with zero value inserted on server as show on video.
https://streamable.com/0ejpel
How can i fixed it.
Best Regards

Answer 1

because your variable is set value in build method, every time you call setState, your variable is set again and slider show default value again.
for solve this problem, you should set your variable out of the build method.
EDIT:
change your code like this:
List digrees = [];
var widthView;
Map rdata;
var did;
var u_id;
var m_id;
var w_id;
#override
void initState() {
super.initState();
widthView = MediaQuery.of(context).size.width;
rdata = ModalRoute.of(context).settings.arguments;
did = int.parse(rdata['dayId'].toString());
u_id = rdata['userID'];
m_id = rdata['courseId'];
w_id;
if (did <= 6) {
w_id = 1;
} else if (did <= 12) {
w_id = 2;
} else if (did <= 18) {
w_id = 3;
} else {
w_id = 4;
}
}
Future<List> fetchDigrees() async {
...
}
Future<void> send_degree(uId, actId, degree, w_id, did, m_id) async {
...
}
Widget build(BuildContext context) {
// put your future builder here
}
and in slider onChange method:
send_degree(u_id, item.act_id, val,
w_id, did, m_id).then((_){
setState(() {
_value = val;
});
});
this is not the ideal solution and best code. but you can change it to be better.