Skip to content

Instantly share code, notes, and snippets.

@SonNg2k
Forked from elisar4/main.dart
Last active August 20, 2021 12:55
Show Gist options
  • Save SonNg2k/bdb9d67ef504f31d01892137174e3288 to your computer and use it in GitHub Desktop.
Save SonNg2k/bdb9d67ef504f31d01892137174e3288 to your computer and use it in GitHub Desktop.
Flutter iOS Keyboard Animation
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: KeyboardSensitiveView(),
);
}
}
class KeyboardSensitiveView extends StatelessWidget {
@override
Widget build(BuildContext context) {
/// Rebuilt every time the keyboard kicks in and disappears
final mq = MediaQuery.of(context);
final bottomOffset = mq.viewInsets.bottom + mq.padding.bottom;
return Scaffold(
/// Must disable default scaffold insets (which is not animated)
resizeToAvoidBottomInset: false,
appBar: AppBar(title: Text('Keyboard Animation')),
body: AnimatedContainer(
curve: Curves.easeOutQuad,
duration: const Duration(milliseconds: 350),
margin: EdgeInsets.only(bottom: bottomOffset),
child: SafeArea(
/// Adding [SafeArea.bottom] above with " + mq.padding.bottom"
bottom: false,
child: Stack(children: [
Align(
alignment: Alignment.bottomLeft,
child: TextComposer(),
),
]),
),
),
);
}
}
class TextComposer extends StatefulWidget {
TextComposer({Key key}) : super(key: key);
@override
_TextComposerState createState() => _TextComposerState();
}
class _TextComposerState extends State<TextComposer> {
@override
Widget build(BuildContext context) {
return Container(
color: Colors.grey[100],
padding: const EdgeInsets.symmetric(vertical: 6),
child: Row(
children: [
SizedBox(
width: 60,
child: Icon(Icons.add_a_photo),
),
Flexible(
child: TextField(
style: Theme.of(context).textTheme.title,
decoration: InputDecoration(
border: InputBorder.none,
hintText: 'Enter text...',
),
),
),
SizedBox(
width: 60,
child: Icon(Icons.send),
),
],
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment