jmrh-app/lib/widget/item_comment.dart

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:jmrh/constant/styles.dart';

class ItemComment extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 16, vertical: 10),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          ClipOval(
            child: CachedNetworkImage(
              width: 28,
              height: 28,
              imageUrl: 'https://zhumj.oss-cn-hangzhou.aliyuncs.com/image/user.jpg',
            ),
          ),
          Expanded(
            child: Container(
              margin: EdgeInsets.only(left: 6),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '唐丛茸',
                    style: TextStyle(color: COLOR_USERNAME, fontSize: 13, fontWeight: FontWeight.bold),
                  ),
                  Container(
                    margin: EdgeInsets.only(top: 4),
                    child: Text(
                      '评论内容评论内容，评论内容评论内容评论，内容评论内容评论内容评论内容',
                      style: TextStyle(color: COLOR_TEXT_1, fontSize: 14),
                    ),
                  ),
                  Container(
                    margin: EdgeInsets.only(top: 4),
                    child: Row(
                      children: [
                        Text(
                          '15分钟前',
                          style: TextStyle(fontSize: 12, color: COLOR_TEXT_2),
                        ),
                        Container(
                          margin: EdgeInsets.only(left: 15),
                          child: Text(
                            '回复Ta',
                            style: TextStyle(fontSize: 12, color: COLOR_TEXT_2),
                          ),
                        )
                      ],
                    ),
                  ),
                  Container(
                    width: double.infinity,
                    margin: EdgeInsets.only(top: 10),
                    decoration: BoxDecoration(
                      color: COLOR_BORDER,
                      borderRadius: BorderRadius.all(
                        Radius.circular(2),
                      ),
                    ),
                    padding: EdgeInsets.symmetric(horizontal: 8, vertical: 10),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        RichText(
                          text: TextSpan(children: [
                            TextSpan(text: '夏秋雨', style: TextStyle(color: COLOR_USERNAME, fontSize: 13)),
                            TextSpan(text: '：评论内容评论内容评论内容评论内容', style: TextStyle(color: COLOR_TEXT_1, fontSize: 13)),
                          ]),
                        ),
                        RichText(
                          text: TextSpan(children: [
                            TextSpan(text: '唐丛茸', style: TextStyle(color: COLOR_USERNAME, fontSize: 13)),
                            TextSpan(text: ' 回复 ', style: TextStyle(color: COLOR_TEXT_1, fontSize: 13)),
                            TextSpan(text: '夏秋雨', style: TextStyle(color: COLOR_USERNAME, fontSize: 13)),
                            TextSpan(
                                text: '：评论内容评论内容评论内容评论内容评论内容', style: TextStyle(color: COLOR_TEXT_1, fontSize: 13)),
                          ]),
                        ),
                        RichText(
                          text: TextSpan(children: [
                            TextSpan(text: '查看全部5条回复', style: TextStyle(color: COLOR_USERNAME, fontSize: 13)),
                          ]),
                        ),
                      ],
                    ),
                  )
                ],
              ),
            ),
          )
        ],
      ),
    );
  }
}