I have a ListView builder inside a Card. In a column (in the card), each card shows a job and a list of staff members. If the staff member listed is the user who has logged in to the app, their background color is changed to highlight them in the list :
color: gblStaffId == data[index].staffId
? kMainColor20
: Colors.white,
I would like to be able to allow them to tap their own name to popup some extra details. They shouldn’t be able to tap anyone else.
I think I should use an InkWell, but I’m not sure how or where to put it.
ListView.builder(
itemCount: data.length,
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemBuilder: (_, int index) {
return Container(
padding: EdgeInsets.all(5.0),
margin: EdgeInsets.symmetric(vertical: 1.0),
decoration: BoxDecoration(
color: gblStaffId == data[index].staffId
? kMainColor20
: Colors.white,
borderRadius: BorderRadius.all(Radius.circular(4)),
),
child: Row(
children: <Widget>[
Expanded(
flex: 49,
child: Text(
data[index].staffName!,
style: TextStyle(color: kBodyText, fontSize: 16),
),
),
Expanded(
flex: 23,
child: Text(
formatJsonTime24To12(data[index].startTime!)!
.toLowerCase(),
style: TextStyle(color: kBodyText, fontSize: 16),
textAlign: TextAlign.right,
),
),
Expanded(
flex: 5,
child: Text(
' -',
style: TextStyle(color: kBodyText, fontSize: 16),
textAlign: TextAlign.center,
),
),
Expanded(
flex: 23,
child: Text(
formatJsonTime24To12(data[index].finishTime!)!
.toLowerCase(),
style: TextStyle(color: kBodyText, fontSize: 16),
textAlign: TextAlign.right,
),
),
],
),
);
})
2
Answers
You can return Gesture widget(or any tappable) from itemBuilder. Then add ternary or conditional statement on
onTap
method.you can use like