Skip to content

Instantly share code, notes, and snippets.

@chonghorizons
Created November 23, 2021 06:00
Show Gist options
  • Save chonghorizons/0fede5d37b5d99f330729ef23115476c to your computer and use it in GitHub Desktop.
Save chonghorizons/0fede5d37b5d99f330729ef23115476c to your computer and use it in GitHub Desktop.
// Copyright 2017, 2020 The Flutter team. All rights reserved.
// Use of this source code is governed by a BSD-style license
// that can be found in the LICENSE file.
import 'package:flutter/material.dart';
void main() {
runApp(
const FriendlyChatApp(),
);
}
String _name = 'Your Name';
class FriendlyChatApp extends StatelessWidget {
const FriendlyChatApp({
Key? key,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return const MaterialApp(
title: 'FriendlyChat',
home: ChatScreen(),
);
}
}
class ChatMessage extends StatelessWidget {
const ChatMessage({
required this.text,
required this.animationController,
Key? key,
}) : super(key: key);
final String text;
final AnimationController animationController;
@override
Widget build(BuildContext context) {
return SizeTransition(
sizeFactor:
CurvedAnimation(parent: animationController, curve: Curves.easeOut),
axisAlignment: 0.0,
child: Container(
margin: const EdgeInsets.symmetric(vertical: 10.0),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
margin: const EdgeInsets.only(right: 16.0),
child: CircleAvatar(child: Text(_name[0])),
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(_name, style: Theme.of(context).textTheme.headline4),
Container(
margin: const EdgeInsets.only(top: 5.0),
child: Text(text),
),
],
),
],
),
),
);
}
}
class ChatScreen extends StatefulWidget {
const ChatScreen({
Key? key,
}) : super(key: key);
@override
State<ChatScreen> createState() => _ChatScreenState();
}
class _ChatScreenState extends State<ChatScreen> with TickerProviderStateMixin {
final List<ChatMessage> _messages = [];
final _textController = TextEditingController();
final FocusNode _focusNode = FocusNode();
void _handleSubmitted(String text) {
_textController.clear();
var message = ChatMessage(
text: text,
animationController: AnimationController(
duration: const Duration(milliseconds: 700),
vsync: this,
),
);
setState(() {
_messages.insert(0, message);
});
_focusNode.requestFocus();
message.animationController.forward();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('FriendlyChat')),
body: Column(
children: [
Flexible(
child: ListView.builder(
padding: const EdgeInsets.all(8.0),
reverse: true,
itemBuilder: (_, index) => _messages[index],
itemCount: _messages.length,
),
),
const Divider(height: 1.0),
Container(
decoration: BoxDecoration(color: Theme.of(context).cardColor),
child: _buildTextComposer(),
),
],
),
);
}
Widget _buildTextComposer() {
return IconTheme(
data: IconThemeData(color: Theme.of(context).colorScheme.secondary),
child: Container(
margin: const EdgeInsets.symmetric(horizontal: 8.0),
child: Row(
children: [
Flexible(
child: TextField(
controller: _textController,
onSubmitted: _handleSubmitted,
decoration:
const InputDecoration.collapsed(hintText: 'Send a message'),
focusNode: _focusNode,
),
),
Container(
margin: const EdgeInsets.symmetric(horizontal: 4.0),
child: IconButton(
icon: const Icon(Icons.send),
onPressed: () => _handleSubmitted(_textController.text)),
),
],
),
),
);
}
@override
void dispose() {
for (var message in _messages) {
message.animationController.dispose();
}
super.dispose();
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment