I'm writing my first app with flutter and came onto the problem that an InkWell does not detect when it's tapped. It's a more complicated structure than I could find examples for. I wrote the following function:
class ChatOverviewElements {
static Widget buildChatEntry(BuildContext context, String username,
String lastMessageText,
String lastMessageDate, bool group,
int unread, int chatID) {
return new Material(
child: new Ink(
padding: const EdgeInsets.only(right: 32.0),
child: new InkWell(
onTap: ChatOverviewNavigation.openChat(context, chatID),
child: new Row(
children: <Widget>[
new Container(
padding: const EdgeInsets.all(10.0),
child: new Icon(
Icons.account_circle,
size: 60.0,
),
),
new Expanded (
child: new Container(
padding: const EdgeInsets.only(right: 5.0),
height: 60.0,
child: new Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Row(
children: <Widget>[
group ? new Icon(Icons.group) : new Container(),
new Container(width: group ? 10.0 : 0.0,),
TextStyles.username(username),
],
),
TextStyles.chatSnippet(lastMessageText),
],
),
),
),
new Column(
children: <Widget>[
new Row(
children: <Widget>[
new Icon(
Icons.done_all,
color: Colors.green,
),
new Container(width: 8.0,),
TextStyles.chatDate(lastMessageDate),
]),
new Icon(
Icons.thumb_up,
color: Colors.grey[500],
)
],
),
],
),
),
),
);
}
}
It creates a box like you'd see in WhatsApp etc. with username, message preview, unread badge (the thumb up icon is a placeholder for that) and so on. What I want it for that outer Container to be tappable, so I changed it so and Ink (to see the ripple) and added and InkWell and everything else as a child of that well. That does not work. It doesn't detect the tap a all and I don't understand why.
The build function is called to create the children of a ListView, which itself is nested inside a Scaffold and a Material App. That shouldn't matter though, I tried simple examples from StackOverflow within the ListView and those work just fine.
So the question is: what am I doing wrong here? Where would that InkWell have to be so the whole container is tapable and a ripple is shown on the container background ?
onTap: ChatOverviewNavigation.openChat(context, chatID),
should be
onTap: () => ChatOverviewNavigation.openChat(context, chatID),
otherwise the result of ChatOverviewNavigation.openChat(context, chatID)
will be used as onTap
handler.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With