'Can we add custome text inside a listview.builder in flutter
I made a chat application using flutter. I am loading messages using ListView.builder. In this chat-app, sender can end conversation(think like doctor patient doctor can end the coversation). So I am trying to show a message, like "conversation ended" in both side.
But if some reason doctor start a conversation again, that messages needs to show below that "conversation ended" message. Like in the whatsapp date or facebook messanger date.
I am struggling to do that because of the listview builder. Is there way to do with listview builder or are there any other options?
Here is my message widget.
child: SmartRefresher(
controller: _refreshController,
header: WaterDropHeader(),
onLoading: _onLoadMore,
enablePullUp: true,
enablePullDown: false,
child: ListView.builder(
padding: const EdgeInsets.only(bottom: 10.0),
shrinkWrap: true,
reverse: true,
itemBuilder: (context, i) {
var myMessage = _listMessages[i];
if (myMessage.senderId == widget.myId) {
return InkWell(
onLongPress: () {
if (widget.myId == _listMessages[i].senderId)
showDialog(
context: context,
builder: (context0) {
return Platform.isIOS
? CupertinoAlertDialog(
content: Container(
padding: const EdgeInsets.only(
top: 20,
bottom: 20,
left: 10,
right: 10),
child: Text(
'Delete from every one ?'),
),
actions: [
FlatButton(
onPressed: () {
startDeleteMessage(
_listMessages[i].id);
},
child: Text(
'Delete',
style: TextStyle(
color: Colors.red),
)),
FlatButton(
onPressed: () {
Navigator.pop(context);
},
child: Text('Cancel'))
],
)
: AlertDialog(
contentPadding: EdgeInsets.all(0),
content: Container(
padding: const EdgeInsets.only(
top: 20,
bottom: 20,
left: 10,
right: 10),
child: Text(
'Delete from every one ?')),
actions: <Widget>[
FlatButton(
onPressed: () {
startDeleteMessage(
_listMessages[i].id);
},
child: Text(
'Delete',
style: TextStyle(
color: Colors.red),
)),
FlatButton(
onPressed: () {
Navigator.pop(context);
},
child: Text('Cancel'))
],
);
});
},
child: Bubble(
padding: BubbleEdges.all(9),
margin: BubbleEdges.only(
top: (i < _listMessages.length - 1)
? ScreenUtil().setHeight(5.0)
: ScreenUtil().setHeight(20.0),
left: ScreenUtil().setWidth(100.0),
bottom: i == 0
? ScreenUtil().setHeight(10.0)
: ScreenUtil().setHeight(0.0)),
elevation: 2,
nip: BubbleNip.rightBottom,
color: themeProvider.getThemeData.brightness ==
Brightness.dark
? Color(0xff054640)
: Colors.blue,
style: new BubbleStyle(
radius: Radius.circular(
ScreenUtil().setWidth(40.0))),
nipHeight: ScreenUtil().setHeight(20),
nipWidth: ScreenUtil().setWidth(23),
alignment: Alignment.centerRight,
child: myMessage.isDeleted == 1
? Text('message removed',
textAlign: TextAlign.right,
style: GoogleFonts.roboto(
fontStyle: FontStyle.italic,
fontWeight: FontWeight.w400,
fontSize: 16))
// : bubbleTapped && myMessage.id == chatBubbleId
// ? Text('bubble tapped')
: getMyMessageType(myMessage, themeProvider,
chatBubbleId, bubbleTapped), //this is to get text or photo to chat buble
),
);
} else {
//peer message
return InkWell(
onDoubleTap: () {
print('on tap reciever');
setState(() {
chatBubbleId = myMessage.id;
bubbleTapped = true;
});
},
onLongPress: () {
if (widget.myId == _listMessages[i].senderId)
showDialog(
context: context,
builder: (context0) {
return AlertDialog(
contentPadding: EdgeInsets.all(0),
content: InkWell(
onTap: () {
startDeleteMessage(
_listMessages[i].id);
},
child: Container(
padding: EdgeInsets.only(
top: 20,
bottom: 20,
left: 10,
right: 10),
child: Text(
'Delete from every one'))),
);
});
},
child: Bubble(
padding: BubbleEdges.all(9),
nip: BubbleNip.leftTop,
margin: BubbleEdges.only(top: 10),
color: themeProvider.getThemeData.brightness ==
Brightness.dark
? Color(0xff212e36)
: Color(0xfff0f0f0),
nipHeight: ScreenUtil().setHeight(20),
nipWidth: ScreenUtil().setWidth(23),
style: new BubbleStyle(
radius: Radius.circular(
ScreenUtil().setWidth(40.0))),
alignment: Alignment.centerLeft,
elevation: 2,
child: myMessage.isDeleted == 1
? Text('message removed',
textAlign: TextAlign.right,
style: GoogleFonts.roboto(
fontStyle: FontStyle.italic,
fontWeight: FontWeight.w400,
fontSize: 16))
: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: <Widget>[
getMyMessageType(myMessage, themeProvider,
chatBubbleId, bubbleTapped)
],
),
),
);
}
},
itemCount: _listMessages.length,
),
),
),
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|

