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

/**
 * CurvedAnimation对象与SizeTransition类结合使用可以产生一个简单的动画效果。缓解效果会使消息在动画开始时快速滑动，并减慢速度直到停止。
 */


class ChatMessagePage extends StatefulWidget {

  ChatMessagePage({this.text,this.animationController,this.messageData});

  final MessageData messageData ;

  final String text;

  final AnimationController animationController;

  @override
  _ChatMessagePageState createState() => _ChatMessagePageState();
}

class _ChatMessagePageState extends State<ChatMessagePage> {

  @override
  Widget build(BuildContext context) {

    return SizeTransition(
      sizeFactor: CurvedAnimation(
        parent: widget.animationController,
        curve: Curves.easeOut
      ),
      axisAlignment: 0.0,
      child: cellContaint(context),
    );
  }

  Widget cellContaint (BuildContext context){
    var sendId = widget.messageData.sendId;
    var toId = widget.messageData.toId;
    var currentId = 12;
    if(sendId == currentId){
      print(sendId);
      return Container(
        padding:const EdgeInsets.fromLTRB(300.0,0.0,10,0.0),
        margin: const EdgeInsets.symmetric(vertical: 10.0),
        child: Row(

          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            new Container(
              margin: const EdgeInsets.only(right: 16.0),
              child: new CircleAvatar(child: new Text(widget.messageData.title[0])),
            ),
            new Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  new Text(widget.messageData.title, style: Theme.of(context).textTheme.subhead),
                  new Container(
                    margin: const EdgeInsets.only(top: 5.0),
                    child: new Text(widget.text, textAlign: TextAlign.right,),
                  )
                ]
            )
          ],
        ),
      );
    }else{
      return Container(
        padding:const EdgeInsets.fromLTRB(0.0,0.0,0.0,0.0),
        margin: const EdgeInsets.symmetric(vertical: 10.0),
        child: Row(

          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            new Container(
              margin: const EdgeInsets.only(right: 16.0),
              child: new CircleAvatar(child: new Text(widget.messageData.title[0])),
            ),
            new Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  new Text(widget.messageData.title, style: Theme.of(context).textTheme.subhead),
                  new Container(
                    margin: const EdgeInsets.only(top: 5.0),
                    child: new Text(widget.text, textAlign: TextAlign.right,),
                  )
                ]
            )
          ],
        ),
      );
    }

  }
}