Want to change from Stateless Widget to Stateful Widget? Click on the StatelessWidget class and use option + enter (or cmd + . if you use VS Code on macOS), you will see an IDE option that will help you do that.
Here is the working code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 | class DetailPage extends StatefulWidget { final Activity activity; DetailPage({Key key, this.activity}) : super(key: key); @override _DetailPageState createState() => _DetailPageState(); } class _DetailPageState extends State<DetailPage> { bool _tracking = false, _mapped = false; // you need this String _schedule; @override Widget build(BuildContext context) { final levelIndicator = Container( child: Container( child: LinearProgressIndicator(backgroundColor: Color.fromRGBO(209, 224, 224, 0.2), value: 2.0, valueColor: AlwaysStoppedAnimation(Colors.green)), ), ); final topContentText = Column( crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[ SizedBox(height: 120.0), Container( width: 90.0, child: Divider(color: Colors.green), ), SizedBox(height: 10.0), Text( widget.activity.activityName, style: TextStyle(color: Colors.white, fontSize: 45.0), ), SizedBox(height: 30.0), Row( mainAxisAlignment: MainAxisAlignment.start, children: <Widget>[ Expanded( flex: 6, child: Padding( padding: EdgeInsets.only(left: 10.0), child: Text( "Last Run: 3-2-19\n" + "Last Avg Strain: 34%\n" + "Last Run Time: 00:45:23", style: TextStyle(color: Colors.white), ))), // Expanded(flex: 1, child: newRow) ], ), ], ); final topContent = Stack( children: <Widget>[ Container( height: MediaQuery.of(context).size.height * 0.45, padding: EdgeInsets.all(40.0), width: MediaQuery.of(context).size.width, decoration: BoxDecoration( gradient: LinearGradient( begin: Alignment.centerLeft, end: Alignment.centerRight, colors: [Color.fromRGBO(33, 147, 176, 100), Color.fromRGBO(109, 213, 237, 100)], ), ), child: Center( child: topContentText, ), ), Positioned( left: 235.0, top: 180.0, child: InkWell( onTap: () { Navigator.pop(context); }, child: CircleAvatar( radius: 80.0, backgroundColor: Colors.white, ), ), ), Positioned( left: 8.0, top: 60.0, child: InkWell( onTap: () { Navigator.pop(context); }, child: Icon(Icons.arrow_back, color: Colors.white), ), ) ], ); final bottomContentText = Text( "Config:", style: TextStyle(fontSize: 18.0), ); final mappedCheckbox = CheckboxListTile( title: Text("Mapped"), value: _mapped, onChanged: (newValue) => setState(() => _mapped = newValue), controlAffinity: ListTileControlAffinity.leading, // <-- leading Checkbox ); final rtCheckBox = CheckboxListTile( title: Text("Real-time Tracking"), value: _tracking, onChanged: (newValue) => setState(() => _tracking = newValue), controlAffinity: ListTileControlAffinity.leading, // <-- leading Checkbox ); final descriptionText = Text( "Description:", style: TextStyle(fontSize: 12.0), ); final description = TextFormField( decoration: InputDecoration( hintText: 'Enter an activity description', ), ); final scheduledFor = Text( "Scheduled for:", style: TextStyle(fontSize: 12.0), ); final dropdown = DropdownButton<String>( value: _schedule, items: <String>['Now (Default)', 'B', 'C', 'D'].map((String value) { return DropdownMenuItem<String>( value: value, child: Text(value), ); }).toList(), hint: Text("Now (Default)"), onChanged: (newValue) { setState(() { _schedule = newValue; }); }, ); final readButton = Container( padding: EdgeInsets.symmetric(vertical: 16.0), width: 170, //MediaQuery.of(context).size.width, child: RaisedButton( onPressed: () => {}, color: Colors.lightBlue, child: Text("Start", style: TextStyle(color: Colors.white, fontSize: 20)), )); final bottomContent = Container( width: MediaQuery.of(context).size.width, padding: EdgeInsets.all(40.0), child: Center( child: Column( children: <Widget>[bottomContentText, mappedCheckbox, rtCheckBox, descriptionText, description, Text("\n"), scheduledFor, dropdown, readButton], ), ), ); return Scaffold( body: Column( children: <Widget>[topContent, bottomContent], ), ); } } |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.
