Reputation: 33
in ExpandedPanel I put two buttons when press on the first change container contant, but setState() doesn't work to change the value of Scaffold_Syllabus* with the value of Table_Lecture***_Scaffold**
the code
class Syllabus extends StatefulWidget {
const Syllabus({super.key});
@override
State<Syllabus> createState() => _SyllabusState();
}
class _SyllabusState extends State<Syllabus> {
@override
Widget build(BuildContext context) {
Size? _size = MediaQuery.of(context).size;
Container _Scaffold_Syllabus = Container();
final Color color1 = HexColor('#3E6BA9');
return SingleChildScrollView(
child: Container(
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
ExpansionPanelList(
children: [
ExpansionPanel(
headerBuilder: (context, isExpanded) {
return Text("dc");
},
body: SingleChildScrollView(
child: Container(
padding: _size.width > 450
? EdgeInsets.all(40)
: EdgeInsets.only(top: 40),
decoration: BoxDecoration(
border: Border.all(width: 3, color: color1)),
child: Column(
children: [
Row(
children: [
Expanded(
child: Center(
child: ElevatedButton(
onPressed: () {
// the next code want change the container contant
setState(() {
_Scaffold_Syllabus =
Table_Lectures_Scaffold;
});
},
child: new Text("ترم أول",
style: TextStyle(
fontSize: _size.width <= 435
? 9
: 15)),
style: ElevatedButton.styleFrom(
foregroundColor: _Scaffold_Syllabus ==
Table_Lectures_Scaffold
? color1
: Colors.white,
backgroundColor: _Scaffold_Syllabus ==
Table_Lectures_Scaffold
? Colors.white
: color1,
),
),
),
),
Expanded(
child: Center(
child: ElevatedButton(
onPressed: () {
setState(() {
_Scaffold_Syllabus =
Table_Lectures_Scaffold;
});
},
child: new Text("ترم ثان",
style: TextStyle(
fontSize: _size.width <= 435
? 9
: 15)),
style: ElevatedButton.styleFrom(
foregroundColor: _Scaffold_Syllabus ==
Table_Lectures_Scaffold
? color1
: Colors.white,
backgroundColor: _Scaffold_Syllabus ==
Table_Lectures_Scaffold
? Colors.white
: color1,
),
),
),
),
],
),
SizedBox(
height: 10,
),
SafeArea(
child: Container(
width: 500,
height: 500,
padding: _size.width > 450
? EdgeInsets.all(40)
: EdgeInsets.only(top: 40),
decoration: BoxDecoration(
border:
Border.all(width: 3, color: color1)),
child: _Scaffold_Syllabus,
),
)
],
),
),
))
],
),
ExpandablePanel(
header: Text("منهج السنه الدراسية الرابعة"),
collapsed: Text(""),
expanded: SingleChildScrollView(
child: Container(
padding: _size.width > 450
? EdgeInsets.all(40)
: EdgeInsets.only(top: 40),
decoration: BoxDecoration(
border: Border.all(width: 3, color: color1)),
child: Column(
children: [
Row(
children: [
Expanded(
child: Center(
child: ElevatedButton(
onPressed: () {
setState(() {
_Scaffold_Syllabus =
Table_Lectures_Scaffold;
});
},
child: new Text("ترم أول",
style: TextStyle(
fontSize:
_size.width <= 435 ? 9 : 15)),
style: ElevatedButton.styleFrom(
foregroundColor: _Scaffold_Syllabus ==
Table_Lectures_Scaffold
? color1
: Colors.white,
backgroundColor: _Scaffold_Syllabus ==
Table_Lectures_Scaffold
? Colors.white
: color1,
),
),
),
),
Expanded(
child: Center(
child: ElevatedButton(
onPressed: () {
setState(() {
_Scaffold_Syllabus =
Table_Lectures_Scaffold;
});
},
child: new Text("ترم ثان",
style: TextStyle(
fontSize:
_size.width <= 435 ? 9 : 15)),
style: ElevatedButton.styleFrom(
foregroundColor: _Scaffold_Syllabus ==
Table_Lectures_Scaffold
? color1
: Colors.white,
backgroundColor: _Scaffold_Syllabus ==
Table_Lectures_Scaffold
? Colors.white
: color1,
),
),
),
),
],
),
SizedBox(
height: 10,
),
SafeArea(
child: Container(
width: 500,
height: 500,
padding: _size.width > 450
? EdgeInsets.all(40)
: EdgeInsets.only(top: 40),
decoration: BoxDecoration(
border: Border.all(width: 3, color: color1)),
child: _Scaffold_Syllabus,
),
)
],
),
),
))
],
),
),
),
);
}
}
i try to change the contant of container when i press the button, but setstate doesn't work
Upvotes: 3
Views: 95
Reputation: 175
I'm sorry for asking but, why do you need variable with type of container? So there's an error that, you are declaring variables in the build method, and when you use setstate, build method is rebuild and your variables stay unchanged. Because they are also redeclared in the build method. Try to declare variables out of build method. Example:
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/container.dart';
import 'package:flutter/src/widgets/framework.dart';
class TestPage extends StatefulWidget {
const TestPage({super.key});
@override
State<TestPage> createState() => _TestPageState();
}
class _TestPageState extends State<TestPage> {
@override
void initState() {
container = Container(color: Colors.black,);
super.initState();
}
Container? _Scaffold_Syllabus=Container(); //Declare variables
here
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
color: Colors.amber,
child: Column(
children: [
Expanded(child: container!),//this container is changed when
button is pressed
ElevatedButton(onPressed: (){
container = Container(color: Colors.red,);
setState(() {});
}, child: Text("red Container")),
ElevatedButton(onPressed: (){
container = Container(color: Colors.blue,);
setState(() {});
}, child: Text("blue Container")),
],
),
),
);
}
}
Upvotes: 0
Reputation: 24940
It is primarily because of the wrong logic, i.e
You've established a Container
type variable named _Scaffold_Syllabus
in your code and given it an empty Container
. When the buttons are pressed, you are then setting its value to Table_Lectures_Scaffold
. But, altering its value will have no impact on the user interface because you are not really utilising _Scaffold_Syllabus
anywhere in your code.
You must swap out the Container
widget in your SafeArea
for _Scaffold Syllabus
in order to fulfil your goals. Depending on which button is pushed, you should also modify the value of _Scaffold_Syllabus
to Scaffold_Syllabus1
or Scaffold_Syllabus2
.
Upvotes: 0