How to Make Card Clickable In Flutter ?

How to Make Card Clickable In Flutter ?

Card Widget is basically used to display data that is received from BackEnd. To make a Card Clickable or any other Widget user needs to make use of composition over properties. Wrap the desired widget into a clickable one to achieve what you need. In this article, we will learn about How to Make Card Clickable In Flutter?

How to Make Card Clickable In Flutter?

Users can make use of clickable widgets: GestureDetector, InkWell, InkResponse.

GestureDetector is a widget that detects the gestures.

GestureDetector(
  onTap: () => ......,
  child: Card(...),
);

Flutter provides the InkWell Widget. by registering a callback you can decide what happens when the user clicks on the card called tap in a flutter. InkWell also implements the Material Design ripple effect.

In Flutter, InkWell is a material widget that responds to touch action.

InkWell(
    child: Card(......),
    onTap: () { 
        print("Click event on Container"); 
    },
);

Difference Between InkWell and GestureDetector Widget in Flutter.

InkWell is a material widget and it can show you a Ripple Effect whenever a touch was received.

GestureDetector Widget is more general-purpose, not only for touch but also for other gestures.

Conclusion:

In this article, we have been through How to Make Card Widget Clickable In Flutter?

Thanks for being with us a Flutter Journey !!!

Keep Learning!!

Keep Fluttering !!!

FlutterAgency.com is our portal Platform dedicated to Flutter Technology and Flutter Developers. The portal is full of cool resources from Flutter like Flutter Widget Guide, Flutter Projects, Code libs and etc.

FlutterAgency.com is one of the most popular online portal dedicated to Flutter Technology and daily thousands of unique visitors come to this portal to enhance their knowledge on Flutter.