Skip to content

Instantly share code, notes, and snippets.

@jkmpariab
Created July 31, 2019 14:19
Show Gist options
  • Save jkmpariab/18962517075bf2c8c9d88677a74d1a2f to your computer and use it in GitHub Desktop.
Save jkmpariab/18962517075bf2c8c9d88677a74d1a2f to your computer and use it in GitHub Desktop.
pageview transition animation between pages stucks on curves.XXXIn that overshoot its bound
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
home: LogInPage(),
);
}
}
class LogInPage extends StatefulWidget {
@override
_LogInPageState createState() => _LogInPageState();
}
class _LogInPageState extends State<LogInPage> {
PageController _pageController;
@override
void initState() {
super.initState();
_pageController = PageController();
}
@override
void dispose() {
_pageController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: PageView(
children: <Widget>[
_SignInPane(onTapToSignUp: _onTapToSignUp),
_SignUpPane(onTapToSignIn: _onTapToSignIn),
],
controller: _pageController,
physics: NeverScrollableScrollPhysics(),
),
);
}
void _onTapToSignUp() async {
await _pageController.nextPage(duration: const Duration(milliseconds: 250), curve: Curves.elasticIn);
}
void _onTapToSignIn() async {
await _pageController.previousPage(duration: const Duration(milliseconds: 250), curve: Curves.easeOutBack);
}
}
//
// Sign-In pane
//
class _SignInPane extends StatefulWidget {
_SignInPane({Key key, @required this.onTapToSignUp})
: assert(onTapToSignUp != null),
super(key: key);
final VoidCallback onTapToSignUp;
@override
_SignInPaneState createState() => _SignInPaneState();
}
class _SignInPaneState extends State<_SignInPane> {
GlobalKey<FormState> _loginFormGlobalKey;
TextEditingController _usernameController;
TextEditingController _passwordController;
@override
void initState() {
super.initState();
_loginFormGlobalKey = GlobalKey<FormState>();
_usernameController = TextEditingController();
_passwordController = TextEditingController();
}
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Padding(
padding: EdgeInsets.symmetric(horizontal: 45.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 30.0),
child: Text('You should login to use this app'),
),
Padding(
padding: EdgeInsets.symmetric(vertical: 20.0),
child: CircleAvatar(
radius: 42.0,
backgroundColor: Theme.of(context).primaryColorDark,
foregroundColor: Colors.white,
child: Icon(
Icons.person,
size: 75.0,
),
),
),
Divider(),
Form(
key: _loginFormGlobalKey,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Padding(
padding:
EdgeInsets.symmetric(vertical: 8.0),
child: TextFormField(
controller: _usernameController,
validator: (str) {
if (str.trim().length < 5) return 'Username length is less than required!';
return null;
},
),
),
Padding(
padding:
EdgeInsets.symmetric(vertical: 8.0),
child: TextFormField(
controller: _passwordController,
obscureText: true,
validator: (str) {
if (str.trim().length < 8) return 'Password length is less than required!';
return null;
},
),
),
],
),
),
Padding(
padding: EdgeInsets.symmetric(vertical: 16.0),
child: SizedBox(
width: double.infinity,
child: RaisedButton(
child: Text('submit'),
onPressed: () {},
),
),
),
RichText(
text: TextSpan(
style: TextStyle(fontSize: 15.0),
children: <InlineSpan>[
TextSpan(
text: 'You have no account? ',
style: TextStyle(color: Colors.grey[700])),
TextSpan(
text: 'sign up',
style: TextStyle(
color: Theme.of(context).primaryColor,
),
recognizer: TapGestureRecognizer()
..onTap = widget.onTapToSignUp,
),
],
),
),
],
),
),
);
}
}
//
// Sign-Up pane
//
class _SignUpPane extends StatefulWidget {
_SignUpPane({Key key, @required this.onTapToSignIn})
: assert(onTapToSignIn != null),
super(key: key);
final VoidCallback onTapToSignIn;
@override
_SignUpPaneState createState() => _SignUpPaneState();
}
class _SignUpPaneState extends State<_SignUpPane> {
GlobalKey<FormState> _loginFormGlobalLey;
@override
void initState() {
super.initState();
_loginFormGlobalLey = GlobalKey<FormState>();
}
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Padding(
padding: EdgeInsets.symmetric(horizontal: 45.0),
child: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 30.0),
child: Text('Create new account'),
),
Divider(),
Form(
key: _loginFormGlobalLey,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Padding(
padding:
EdgeInsets.symmetric(vertical: 8.0),
child: TextFormField(),
),
Padding(
padding:
EdgeInsets.symmetric(vertical: 8.0),
child: TextFormField(
obscureText: true,
),
),
Padding(
padding:
EdgeInsets.symmetric(vertical: 8.0),
child: TextFormField(
obscureText: true,
),
),
],
),
),
Padding(
padding: EdgeInsets.symmetric(vertical: 16.0),
child: SizedBox(
width: double.infinity,
child: RaisedButton(
child: Text('submit'),
onPressed: () {},
),
),
),
RichText(
text: TextSpan(
style: TextStyle(fontSize: 15.0),
children: <InlineSpan>[
TextSpan(
text: 'You have an account? ',
style: TextStyle(color: Colors.grey[700])),
TextSpan(
text: 'sign in',
style: TextStyle(
color: Theme.of(context).primaryColor,
),
recognizer: TapGestureRecognizer()
..onTap = widget.onTapToSignIn,
),
],
),
),
],
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment