CODEWITHSUNDEEP
flutterdart
Enzo Saoud
Enzo Saoud

Reputation: 49

How to make a row clickable? Flutter

I want to make this row clickable to redirect to a different page, how should I do it?

There are a bunch of these rows in the code.


      body:
      Column(
         crossAxisAlignment: CrossAxisAlignment.stretch,
         children: <Widget>[
               Container(
                 padding: EdgeInsets.all(10.0),
                 color: Colors.white,
           ),
             Row(
               mainAxisAlignment: MainAxisAlignment.start,
               children: <Widget>[
                  Container(

                         padding: EdgeInsets.fromLTRB(10,16,0,16),
                         color: Colors.white,
                    child: Icon(Icons.favorite),
                  ),
                   Container(
                     padding: EdgeInsets.fromLTRB(5,20,140,20),
                          color: Colors.white,
                         child: Text('Favoritos'),

                   ),
                 Container(
                   padding: EdgeInsets.fromLTRB(145,16,5,16),
                   color: Colors.white,
                   child: Icon(Icons.keyboard_arrow_right),
                 ),
             ],
             ),

Upvotes: 3

Views: 3707

Answers (2)

littleironical
littleironical

Reputation: 1914

You can wrap your widget with GestureDetector or InkWell like this:

GestureDetector(
  onTap: (){
  // Add what you want to do on tap
  }
  child: Row(
    // Add your properties here
  ),
),

InkWell(
  onTap: (){
  // Add what you want to do on tap
  }
  child: Row(
    // Add your properties here
  ),
),

Upvotes: 11

Bensal
Bensal

Reputation: 4120

To make the row clickable you will have to wrap it to either inkwell or GestureDetector, else you can chose IconButtons.

InkWell(
 onTap: (){ print("Card Clicked"); }
 child: Container(
  padding: EdgeInsets.fromLTRB(10,16,0,16),
  color: Colors.white,
  child: Icon(Icons.favorite),
  ),//Container
);

To go to different activity onTap try this code inside onTap():

onTap: (){ 
 print("Card Clicked"); 
 Navigator.push(
 context,
 MaterialPageRoute(builder: (context) => SecondRoute()),//secondRoute is the     
   //second class you want to go to.
}

You can use hardik's answer if you want to make clickable columns. Hope it helps! Happy coding:)

Upvotes: 3

Related Questions