Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter passing object to stateful widget

Tags:

flutter

dart

EDIT -- the error is user is not defined.

   class _CheckInState extends State<CheckIn> {

  double _value = 0;
  String _emotionalStatus = 'Happy';
  bool didStartDrag = false;
  double updatedDragDelta;
  bool didEndDrag = false;

  @override
 Widget build(BuildContext context) {
  return Scaffold(
      appBar: new LBAppBar().getAppBar(),
      drawer: new LBDrawer().getDrawer(),
  body:
  SwipeDetector(

   child:  Container(
    decoration: BoxDecoration(
        gradient: new LinearGradient(
            colors: [Color.fromRGBO(1,89,99, 1.0), Colors.grey],
            begin: Alignment.bottomLeft,
            end: Alignment.topRight
        )
    ),
    child: Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        children: <Widget>[

              Container(
                 margin: EdgeInsets.only(left: 30.0,top: 30.0, bottom: 70.0, right:30.0),
                 child :
               Text(

                'How are you feeling today Sam?', style: new TextStyle( color: Colors.white, fontWeight: FontWeight.bold, fontSize: 21.0 ))
              ,
              ),
          Text(
            '${_emojis[_value.toInt()]}',
            style: Theme.of(context).textTheme.display3,
          ),

Container(

 margin: EdgeInsets.only(left: 30.0,top: 20.0, bottom: 20.0, right:30.0),
              child: Row(
             mainAxisAlignment: MainAxisAlignment.center,
               children: <Widget> [         
                  Container(
         margin: EdgeInsets.all(10.0),
         child:  Text(

                '$_emotionalStatus', style: new TextStyle( color: Colors.white, fontWeight: FontWeight.bold, fontSize: 21.0 ))
              ,
                  )

               ]
              )

),


          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 15.0),
            child:

            Container(
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Text(_emojis[0], softWrap: true),
                  Expanded(
                    child: Slider(
                      value: _value,
                     // label: _emojis[_value.toInt()],
                      min: 0.0,
                      max: 4.0,
                      divisions: 4,
                      onChangeStart: (double value) {
                        print('Start value is ' + value.toString());                         
                      },
                     onChangeEnd: (double value) {
          print('Finish value is ' + value.toString());
          if (value.toString() == '0.0') {
             _emotionalStatus = 'Happy';
          }
          if (value.toString() == '1.0') {
             _emotionalStatus = 'Optimistic';
          }
          if (value.toString() == '2.0') {
             _emotionalStatus = 'Neutral';
          }
          if (value.toString() == '3.0') {
             _emotionalStatus = 'Pessimistic';
          }
          if (value.toString() == '4.0') {
             _emotionalStatus = 'Sad';
          }
          setState(() {

          });
        },
                      onChanged: (double value) {
                        setState(() {
                          _value = value;
                        });
                      },
                      activeColor: Colors.white,
                      inactiveColor: Colors.white,
                    ),
                  ),
                  Text(_emojis[4], softWrap: true,)
                ],
              ),
            ),
          ),




                  Container(
         margin: EdgeInsets.all(20.0),
        child:OutlineButton(
        child: Text('Tap to Continue'), textColor: Colors.white,
         shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(30.0)),
          onPressed: (){
           Navigator.of(context).push(new MaterialPageRoute(builder: (BuildContext context) => new CheckInQ(user: user, emoji: _emojis[_value.toInt()], mood: _emotionalStatus))
           );
           }
        )
         )

We have a flutter app that is passing a user object to different screens on a button press. This works great when passing to a Stateless Widget. I tried implementing the same pattern in a Stateful Widget and its not working. Im assuming since Im new to flutter I am doing it wrong and a stateful widget must handle this object differently.

Here is the code for the stateless widget:

class HomeMember extends StatelessWidget {
   User user;

HomeMember({Key key, @required this.user}) : super(key: key);

  @override
  Widget build(BuildContext context){    
  bool isIOS = Theme.of(context).platform == TargetPlatform.iOS;
 return new Scaffold(
     appBar : LBAppBar().getAppBar(),
      //drawer: new LBDrawer().getDrawer(),
     body: Container(
        decoration: BoxDecoration(
        gradient: new LinearGradient(
            colors: [Color.fromRGBO(1,89,99, 1.0), Colors.grey],
            begin: Alignment.bottomLeft,
            end: Alignment.topRight
        )
    ),

  child: Column(
      mainAxisAlignment: MainAxisAlignment.center,    
      children:[
        Row(
                children: [
              Container(
                margin: EdgeInsets.only(left: 20.0,top: 10.0, bottom: 10.0, right:30.0),
                child: Column(
      children: <Widget>[



                Text("Hi ${user.firstName}, Today is " + formatDate(), style: new TextStyle( color: Colors.white70, fontWeight: FontWeight.bold, fontSize: 19.0 )),




],

I tried using this method of passing the user object in a stateful widget like so, and its not working.

class CheckIn extends StatefulWidget {

 @override
 _CheckInState createState() => _CheckInState();
 User user; 
CheckIn({Key key, @required this.user}) : super(key: key);
}



class _CheckInState extends State<CheckIn> {

  double _value = 0;
 String _emotionalStatus = 'Happy';
  bool didStartDrag = false;
double updatedDragDelta;
bool didEndDrag = false;
like image 332
Sam Cromer Avatar asked Jan 01 '23 04:01

Sam Cromer


1 Answers

Say we have a stateless widget:

class HomeMember extends StatelessWidget {
  final User user;

  HomeMember({Key key, @required this.user}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: Center(
        child: Text("Hi ${user.username}",
      ),
    );
  }
}

The equivalent stateful widget would look like:


class HomeMemberStateful extends StatefulWidget {
  final User user;
  HomeMemberStateful({Key key, @required this.user}) : super(key: key);

  @override
  _HomeMemberStatefulState createState() => _HomeMemberStatefulState();
}

class _HomeMemberStatefulState extends State<HomeMemberStateful> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: Center(
        child: Text("Hi ${widget.user.username}, this is a stateful widget",
      ),
    );
  }
}

You can access the object 'user' by calling widget.user in your state class.

like image 98
Kris Avatar answered Feb 04 '23 06:02

Kris