beep
/
frontend_flutter
4
2
Fork 0
Code Issues 14 Pull Requests 4 Releases Activity

feat: welcome page and keyboard with scroll support

pull/55/head
Sudharshan S. 2019-05-26 15:59:34 +08:00
parent 5f3967c065
commit 0da2867da5
Signed by: sudharshan
GPG Key ID: C861C97AAF3D9559
6 changed files with 184 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
lib/src/resources/user_api_provider.dart
View File

@ -12,14 +12,19 @@ class UserApiProvider {
CacheHttp cache = CacheHttp();
LoginManager loginManager = LoginManager();
Future<User> createUser(User user) async {
Future<User> createUser(
String firstName, String lastName, String phoneNumber) async {
final jwt = loginManager.getToken();
final response = await http.post("$baseUrlCore/user",
headers: {
HttpHeaders.contentTypeHeader: "application/json",
HttpHeaders.authorizationHeader: "Bearer $jwt"
},
body: user.toJson());
body: jsonEncode({
"first_name": firstName,
"last_name": lastName,
"phone_number": phoneNumber
}));
return User.fromJson(jsonDecode(response.body));
}

13
lib/src/ui/login/welcome.dart
View File

@ -5,6 +5,7 @@ import "../../services/conversation_manager.dart";
import "./widgets/welcome_page.dart";
import "./widgets/login_page.dart";
import "./widgets/otp_page.dart";
import "./widgets/register_page.dart";
class Welcome extends StatelessWidget {
final String logo = "assets/logo.png";
@ -27,14 +28,6 @@ class Welcome extends StatelessWidget {
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Row(mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[
Image.asset(logo,
semanticLabel: "Beep logo", width: 30.0, height: 50.0),
Padding(
padding: EdgeInsets.only(left: 10.0),
child: Text("Beep",
style: Theme.of(context).accentTextTheme.display3)),
]),
Expanded(
child: Navigator(
initialRoute: "welcome/hello",
@ -44,6 +37,10 @@ class Welcome extends StatelessWidget {
case "welcome/hello":
builder = (BuildContext _) => WelcomePage();
break;
case "welcome/register":
builder = (BuildContext _) =>
RegisterPage(loginManager: loginManager);
break;
case "welcome/login":
builder = (BuildContext _) =>
LoginPage(loginManager: loginManager);

30
lib/src/ui/login/widgets/input.dart Normal file
View File

@ -0,0 +1,30 @@
import "package:flutter/material.dart";
class Input extends StatelessWidget {
final TextEditingController controller;
final String hintText;
Input({@required this.controller, @required this.hintText});
@override
Widget build(BuildContext context) {
return ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(5.0)),
child: Row(mainAxisSize: MainAxisSize.max, children: <Widget>[
Expanded(
child: TextField(
controller: controller,
autocorrect: false,
cursorWidth: 2.0,
cursorColor: Colors.white,
style: Theme.of(context).accentTextTheme.title,
decoration: InputDecoration(
border: InputBorder.none,
filled: true,
fillColor: Color(0x10000000),
hintText: hintText,
hintStyle: Theme.of(context).accentTextTheme.title,
))),
]));
}
}

63
lib/src/ui/login/widgets/login_page.dart
View File

@ -29,36 +29,41 @@ class _LoginPageState extends State<LoginPage> {
return Padding(
padding: EdgeInsets.only(left: 15.0, right: 15.0),
child: Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
Expanded(
child: SingleChildScrollView(
child:
Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 10.0, bottom: 20.0),
child: SvgPicture.asset(phoneSvg,
height: MediaQuery.of(context).size.height / 5)),
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("First things first.",
textAlign: TextAlign.left,
style: Theme.of(context).accentTextTheme.display3),
Text(
"Enter your phone number, to connect to your existing Beep account.",
style: Theme.of(context)
.accentTextTheme
.title
.copyWith(fontWeight: FontWeight.w400)),
Padding(
padding: EdgeInsets.only(top: 20.0),
child: PhoneInput(controller: controller)),
])
]))),
Padding(
padding: EdgeInsets.only(top: 10.0, bottom: 20.0),
child: SvgPicture.asset(phoneSvg,
height: MediaQuery.of(context).size.height / 5)),
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("First things first.",
textAlign: TextAlign.left,
style: Theme.of(context).accentTextTheme.display3),
Text(
"Enter your phone number, to connect to your existing Beep account.",
style: Theme.of(context)
.accentTextTheme
.title
.copyWith(fontWeight: FontWeight.w400)),
Padding(
padding: EdgeInsets.only(top: 20.0),
child: PhoneInput(controller: controller)),
]),
Spacer(),
TextButton(
text: "Continue",
onClickCallback: () async {
print(await widget.loginManager.getToken());
await widget.loginManager
.initAuthentication("+65${controller.text}");
Navigator.pushNamed(context, 'welcome/otp');
}),
padding: EdgeInsets.only(top: 10.0),
child: TextButton(
text: "Continue",
onClickCallback: () async {
await widget.loginManager
.initAuthentication("+65${controller.text}");
Navigator.pushNamed(context, 'welcome/otp');
})),
]));
}
}

95
lib/src/ui/login/widgets/register_page.dart Normal file
View File

@ -0,0 +1,95 @@
import "package:flutter/material.dart";
import "package:flutter_svg/flutter_svg.dart";
import "../../widgets/text_button.dart";
import "../../../services/login_manager.dart";
import "../../../resources/user_api_provider.dart";
import "phone_input.dart";
import "input.dart";
class RegisterPage extends StatefulWidget {
final LoginManager loginManager;
RegisterPage({@required this.loginManager});
@override
_RegisterPageState createState() => _RegisterPageState();
}
class _RegisterPageState extends State<RegisterPage> {
final String phoneSvg = "assets/phoneno.svg";
final phoneController = TextEditingController();
final firstNameController = TextEditingController();
final lastNameController = TextEditingController();
final userApiProvider = UserApiProvider();
@override
void dispose() {
phoneController.dispose();
firstNameController.dispose();
lastNameController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.only(left: 15.0, right: 15.0),
child: Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
Expanded(
child: SingleChildScrollView(
child:
Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 10.0, bottom: 20.0),
child: SvgPicture.asset(phoneSvg,
height: MediaQuery.of(context).size.height / 5)),
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("Let's get you going.",
textAlign: TextAlign.left,
style: Theme.of(context).accentTextTheme.display3),
Text("Enter your info to create your very own Beep account.",
style: Theme.of(context)
.accentTextTheme
.title
.copyWith(fontWeight: FontWeight.w400)),
Padding(
padding: EdgeInsets.only(top: 20.0),
child: Input(
controller: firstNameController,
hintText: "First name")),
Padding(
padding: EdgeInsets.only(top: 10.0),
child: Input(
controller: lastNameController,
hintText: "Last name")),
Padding(
padding: EdgeInsets.only(top: 10.0),
child: PhoneInput(controller: phoneController)),
])
]))),
Padding(
padding: EdgeInsets.only(top: 10.0),
child: TextButton(
text: "Continue",
onClickCallback: () async {
final firstName = firstNameController.text;
final lastName = lastNameController.text;
final phoneNumber = "+65${phoneController.text}";
// Creating the new user
await userApiProvider.createUser(
firstName, lastName, phoneNumber);
await widget.loginManager
.initAuthentication("+65$phoneNumber");
Navigator.pushNamed(context, 'welcome/otp');
})),
]));
}
}

14
lib/src/ui/login/widgets/welcome_page.dart
View File

@ -5,12 +5,21 @@ import "../../widgets/text_button.dart";
class WelcomePage extends StatelessWidget {
final String welcomeSvg = "assets/welcome.svg";
final String logo = "assets/logo.png";
@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.only(left: 15.0, right: 15.0),
child: Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
Row(mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[
Image.asset(logo,
semanticLabel: "Beep logo", width: 30.0, height: 50.0),
Padding(
padding: EdgeInsets.only(left: 10.0),
child: Text("Beep",
style: Theme.of(context).accentTextTheme.display3)),
]),
Spacer(),
SvgPicture.asset(welcomeSvg,
width: MediaQuery.of(context).size.width - 40.0),
@ -25,7 +34,10 @@ class WelcomePage extends StatelessWidget {
text: "Login",
onClickCallback: () =>
Navigator.pushNamed(context, "welcome/login")),
TextButton(text: "Sign Up", onClickCallback: () => print("hello")),
TextButton(
text: "Sign Up",
onClickCallback: () =>
Navigator.pushNamed(context, "welcome/register")),
]));
}
}