创建评论列表项目动作小部件(CommentListItemActions)

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

评论列表项目里面可以显示评论的回复数量,还有回复或者编辑评论用的一些按钮等等,这些东西可以单独放在一个小部件里。

新建一个文件,放在 lib/comment/index/components 里面,名字是 comment_list_item_actions.dart ,文件里定义一个小部件,名字是 CommentListItemActions ,添加一个属性,类型是 Comment 名字是 comment,在构造方法里添加一个参数,this.comment 。

小部件的 build 方法里声明一个 totalReplies,值是一个 GestureDetector,设置一下 onTap,暂时提供一个空白的函数。它的 child 是一个 Container,用 padding 设置一下边距,EdgeInsets.only,right 是 8 。

child 是一个 Row 小部件,小部件的 children 里面添加一个 Text 小部件,文字是 comment.totalReplies 后面加上条回复这几个字。

然后再添加一个小图标,小图标用的是 Icons.arrow_drop_down。下面声明一个 showTotalReplies,值可以判断一下 comment.totalReplies != 0 。

在小部件的这个容器里面,把它的 child 设置成一个 Row 小部件,它的 children 里面判断一下 showTotalReplies,然后添加一个 totalReplies。

comment_list_item

打开 comment_list_item,修改一下 actions 的值,新建一个 CommentListItemActions ,提供一个 comment 参数。

观察

观察一下评论列表,如果评论有回复的话,就会在评论列表项目里面显示这条评论被回复的数量。

创建评论列表项目动作小部件(CommentListItemActions)《 Flutter 移动端实例:回复列表 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点