CODEWITHSUNDEEP
firebasedartgoogle-cloud-firestoreflutter
STEP PLUS
STEP PLUS

Reputation: 465

How to use constructor objects in another state using flutter

I am creating this shopping app , the home page displays pictures and some data from firestore firebase as a gridView. THIS IS THE SCREEN OF THIS PAGE

Once the user click on one of the images in this page the app will show him another page contains more details about the product with Hero animation. THIS IS THE SECOND PAGE The second page is a stateless widget and it takes some parameters

@override
 Widget build(BuildContext context) {
  return GridView.builder(

  ........

  itemBuilder: (BuildContext context, int index){
    String image = documents[index].data['image'].toString();
    String ti = documents[index].data['title'].toString();
    String prix = documents[index].data['price'].toString();
    String desc = documents[index].data['description'].toString();
    String categ = documents[index].data['category'].toString();
    return new Material(
      elevation: 5.0,
      borderRadius:
      new BorderRadius.all(new Radius.circular(15.0)),
      child: new InkWell(
        onTap: () {
          Navigator.push(
           context,
           new MaterialPageRoute(
           builder: (context) =>
           new FullScreenImagePage(image,ti,prix,desc,categ)));
        },
        child: new Hero(
          tag: image,
          child: new Column(
            children: <Widget>[
              new Padding(padding: EdgeInsets.all(4.0)),
              new FadeInImage(
                image: new NetworkImage(image),
                fit: BoxFit.cover,
                placeholder: new AssetImage("assets/ic.png"),
              ),
              new Text(ti, style: TextStyle(fontSize: 13.0, height: 1.0),),
              new Text('prix: $prix MAD', style: TextStyle(fontSize: 9.0),),
            ],
         ),
       ),
     ),
   );

Then I receive the parameters in this class

class FullScreenImagePage extends StatelessWidget {
  String imgPath ,title,price,desc,categ;
  FullScreenImagePage(this.imgPath,this.title,this.price,this.desc,this.categ);

...... 

 Padding(
   padding: EdgeInsets.all(10.0),
   child: Hero(
     tag: imgPath,
     child: Material(
       elevation: 20.0,
       shadowColor: Colors.black26,
       child: Image(
         image: NetworkImage(imgPath),
         fit: BoxFit.cover,
       ),
     ),
   ),
 ),

The problem that I have is that I wanna change the stateless widget of FullScreenImagePage to stateful with keeping the same variables

Upvotes: 1

Views: 304

Answers (2)

Raouf Rahiche
Raouf Rahiche

Reputation: 31336

if you are using IntelliJ you can change you stateless widget into a stateful one using alt+enter

  • go to the class name{{FullScreenImagePage}
  • press alt + Enter

enter image description here

Upvotes: 1

Pawann Kumaarr
Pawann Kumaarr

Reputation: 689

Just convert the stateless widget to stateful widget either manually or by using the shortcut(quick fix). Then access your variable in the state subclass using widget.variable_name

Upvotes: 0

Related Questions