How to use setstate in the Void function? - flutter

Question

I'm still new to Flutter. I want to ask why I can't use setState () in void function
here's my code: my goal is that the slider can be responsive. Previous problem I am still confused in using the SetState void function. so first of all when pressing the filter button a pop up window will appear where will display the contents of the filter that is several categories, then in the price category there is a function to display the slider. and my slider is like just an image and can't be changed. but the value has changed
void _onButtonPressed1() {
//Function for Button Press "Sort"
showModalBottomSheet(
context: context,
builder: (context) {
return Container(
color: Colors.black,
height: 500,
child: Container(
child: column1(),
decoration: BoxDecoration(
color: Colors.cyan[400],
borderRadius: BorderRadius.only(
topLeft: const Radius.circular(30),
topRight: const Radius.circular(30),
)),
),
);
});}
new Expanded(
child: new Padding(
//padding overall filter include text&square
padding: EdgeInsets.fromLTRB(15, 0, 20, 0),
child: new Card(
color: Colors.transparent,
shape: const RoundedRectangleBorder(
side: BorderSide(
color: Colors.cyanAccent,
),
borderRadius: BorderRadius.all(Radius.circular(6.0)),
),
child: new RaisedButton(
child: new Row(children: <Widget>[
new Padding(
padding: EdgeInsets.fromLTRB(5.0, 0, 40, 0),
child: new Icon(Icons.format_align_left, color: Colors.cyanAccent),
),
new Text(
'Filter',
style: new TextStyle(
fontSize: 13,
color: Colors.cyanAccent,
),
),
]),
color: Colors.black,
padding: EdgeInsets.fromLTRB(1, 1, 1, 1),
onPressed: () => {
showModalBottomSheet(
context: context,
builder: (context) {
return Container(
color: Colors.black,
height: 350,
child: Container(
// child: column(),
child: Wrap(
//dropdown button
children: <Widget>[
ListView.builder(
shrinkWrap: true,
itemCount: 3,
itemBuilder: (context, index) {
if (index < 2) {
final sort = _sort[index];
return ExpansionTile(
title: ListTile(
title: Text(
sort.category,
style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
),
),
children: <Widget>[ListTile(title: sort.item)],
);
} else {
return ExpansionTile(
title: ListTile(
title: Text(
'By Price',
style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
)),
children: <Widget>[
new RangeSlider(
min: 1,
max: 100,
divisions: 100,
values: values,
labels: labels,
onChanged: (value) {
print('START: ${value.start}, END: ${value.end}');
values = value;
labels = RangeLabels('${values.start.toInt().toString()}\$', '${values.end.toInt().toString()}\$');
setState(() {});
},
//Data from API
)
]);
}
}),
],
),
decoration: BoxDecoration(
color: Colors.cyan[400],
borderRadius: BorderRadius.only(
topLeft: const Radius.circular(30),
topRight: const Radius.circular(30),
)),
),
);
},
)
}),
),
),
),

Answer 1

onPressed: () => {
showModalBottomSheet(
context: context,
builder: (_) =>
StatefulBuilder(builder:(modalContext, modalSetState) => Container(
color: Colors.black,
height: 350,
child: Container(
height:200,
// child: column(),
child: Wrap(
//dropdown button
children: <Widget>[
new Text(values.start.toString()),
ListView.builder(
shrinkWrap: true,
itemCount: 3,
itemBuilder: (context, index) {
context=context;
if (index < 2) {
final sort = _sort[index];
return ExpansionTile(
title: ListTile(
title: Text(
sort.category,
style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
),
),
children: <Widget>[ListTile(title: sort.item)],
);
} else {
return ExpansionTile(
title: ListTile(
title: Text(
'By Price',
style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
)),
children: <Widget>[
new RangeSlider(
min: 1,
max: 100,
divisions: 100,
values: values,
labels: labels,
onChanged: (value) {
print('START: ${value.start}, END: ${value.end}');
setValuesSlider(value);
labels = RangeLabels('${values.start.toInt().toString()}\$', '${values.end.toInt().toString()}\$');
modalSetState(() {});
},
//Data from API
)
]);
}
}),
],
...
Just use StatefulBuilder(builder:(modalContext, modalSetState)