import 'package:flutter/material.dart';
import 'package:date_format/date_format.dart';
import 'package:chatting/chatting_data_page.dart';
import 'package:chatting/touch_callback.dart';

class ChattingItemPage extends StatelessWidget {

  final MessageData messageData;

  ChattingItemPage(this.messageData);

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
          color: Colors.white,
          //仅加一个底部边框,这样列表的每一项信息下面都会有一条
          border:
              Border(bottom: BorderSide(width: 5.0, color: Color(0xFFd9d9d)))),
      height: 64.0,
      //按下回调处理空实现
      child: TouchCallBack(
        onPressed: (){
          Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext ctx){
            return null;
          }));
        },
        child: Row(
          //垂直方 居中显示
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            //展示图像
            Container(
              // 头像左右留一定的外边距
              margin: const EdgeInsets.only(left: 13.0, right: 13.0),
              child:
                  Image.network(messageData.avatar, width: 48.0, height: 48.0),
            ),
            Expanded(
              //主标题和子标题采用垂直布局
              child: Column(
                //垂直方向居中对齐
                mainAxisAlignment: MainAxisAlignment.center,
                //水平方靠左对齐
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  Text(
                    messageData.title,
                    style: TextStyle(
                      fontSize: 16.0,
                      color: Color(0xff353535),
                    ),
                    maxLines: 1,
                  ),
                  Padding(
                    padding: const EdgeInsets.only(top: 8.0),
                  ),
                  Text(
                    messageData.subTitle,
                    style: TextStyle(fontSize: 14.0, color: Color(0xffa9a9a9)),
                    maxLines: 1,
                    //显示不下的文本用省略号代替
                    overflow: TextOverflow.ellipsis,
                  )
                ],
              ),
            ),
            Container(
              //时间顶部对齐
              alignment: AlignmentDirectional.topStart,
              margin: const EdgeInsets.only(right: 12.0, top: 12.0),
              child: Text(
                //格式化时间
                formatDate(messageData.time, [HH, ':', nn, ":", 'ss'])
                    .toString(),
                style: TextStyle(fontSize: 14.0, color: Color(0xffa9a9a9)),
              ),
            )
          ],
        ),
      ),
    );
  }
}