Chat Animation In Flutter :

Chat Animation.dart
import 'package:flutter/material.dart'; const String _name = "Flutter Tutorial"; void main() { runApp( new MaterialApp( title: "Friendlychat", home: ChatScreen(), ), ); } class ChatScreen extends StatefulWidget { @override State<StatefulWidget> createState() { return ChatScreenState(); } //new } // Add the ChatScreenState class definition in main.dart. class ChatScreenState extends State<ChatScreen> with TickerProviderStateMixin { final List<ChatMessage> _messages = <ChatMessage>[]; final TextEditingController _textController = new TextEditingController(); bool _isComposing = false; void _handleSubmitted(String text) { setState(() { _isComposing = false; }); _textController.clear(); ChatMessage message = new ChatMessage( text: text, animationController: new AnimationController( //new duration: new Duration(milliseconds: 700), //new vsync: this, //new ), //new ); //new setState(() { _messages.insert(0, message); }); message.animationController.forward(); //new } @override void dispose() { //new for (ChatMessage message in _messages) //new message.animationController.dispose(); //new super.dispose(); //new } //new @override //new Widget build(BuildContext context) { return new Scaffold( appBar: new AppBar(title: new Text("Friendlychat")), body: new Column( children: <Widget>[ new Flexible( child: new ListView.builder( padding: new EdgeInsets.all(8.0), //new reverse: true, //new itemBuilder: (_, int index) => _messages[index], //new itemCount: _messages.length, //new ), //new ), //new new Divider(height: 1.0), //new new Container( //new decoration: new BoxDecoration(color: Theme.of(context).cardColor), //new child: _buildTextComposer(), //modified ), //new ], //new ), //new ); } Widget _buildTextComposer() { return new IconTheme( //new data: new IconThemeData(color: Theme.of(context).accentColor), //new child: new Container( //modified margin: const EdgeInsets.symmetric(horizontal: 8.0), child: new Row( children: <Widget>[ new Flexible( child: new TextField( controller: _textController, onChanged: (String text) { //new setState(() { //new _isComposing = text.length > 0; //new }); //new }, onSubmitted: _handleSubmitted, decoration: new InputDecoration.collapsed(hintText: "Send a message"), ), ), new Container( margin: new EdgeInsets.symmetric(horizontal: 4.0), child: new IconButton( icon: new Icon(Icons.send), onPressed: _isComposing ? () => _handleSubmitted(_textController.text) //modified : null, ), ), ], ), ), //new ); } } class ChatMessage extends StatelessWidget { ChatMessage({this.text, this.animationController}); final String text; final AnimationController animationController; @override Widget build(BuildContext context) { final animation = Tween(begin: 0.0, end: 1.0).animate(animationController); return new SizeTransition( sizeFactor: new CurvedAnimation( //new parent: animationController, curve: Curves.easeOut), //new axisAlignment: 0.0, child: new Container( //modified margin: const EdgeInsets.symmetric(vertical: 10.0), child: new Row( crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[ new Container( margin: const EdgeInsets.only(right: 16.0), child: new CircleAvatar(child: new Text(_name[0])), ), new Expanded( child: new Column( crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[ new Text(_name, style: Theme.of(context).textTheme.subhead), new Container( margin: const EdgeInsets.only(top: 5.0), child: new Text(text), ), ], ), ), ], ), ) //new ); } }
The flutter tutorial is a website that bring you the latest and amazing resources of code. All the languages codes are included in this website. The languages like flutter, android, java,kotlin etc.with the help of this languages any user can develop the beautiful application
For more information about Flutter. visit www.fluttertutorial.in