You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
driver-app/lib/pages/authentication/login_page.dart

206 lines
7.5 KiB
Dart

import 'package:driverapp/app-icons/driver_app_icons.dart';
import 'package:driverapp/core/viewModels/authentication_view_model.dart';
import 'package:driverapp/pages/base/base_view.dart';
import 'package:driverapp/widgets/buttons/secondary_button.dart';
import 'package:driverapp/widgets/input/text_field.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:hexcolor/hexcolor.dart';
class LoginPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return AnimatedSwitcher(
duration: Duration(microseconds: 350),
child: BaseView<AuthenticationViewModel>(
builder: (_, model, widget) => Scaffold(
//baseViewModel: model,
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
FractionallySizedBox(
widthFactor: 0.80,
child: Column(
children: <Widget>[
SizedBox(
height: 40,
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
child: Icon(
DriverApp.logo,
size: 70,
color: Theme.of(context).primaryColor,
),
margin: EdgeInsets.only(
right:
MediaQuery.of(context).size.width * 0.15),
),
],
),
SizedBox(
height: 20,
),
Column(
children: <Widget>[
Text(
"Driver",
style: TextStyle(
fontSize: 50, fontWeight: FontWeight.bold),
),
Text(
"Delivery",
style: TextStyle(fontSize: 36, letterSpacing: 1),
),
Text(
"APP",
style: TextStyle(
fontSize: 33,
letterSpacing: 33,
fontWeight: FontWeight.w400),
),
],
),
SizedBox(
height: 30,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
CircleContainer(
child: Text(
"English",
style: TextStyle(
fontSize: 12, color: Colors.white),
),
color: Theme.of(context).primaryColor, borderWidth: 0,borderColor: Colors.transparent,),
SizedBox(
width: 20,
),
CircleContainer(
child: Text(
"Arabic",
style: TextStyle(
fontSize: 12, color: Colors.black),
),
color: Colors.transparent, borderColor: Theme.of(context).primaryColor,borderWidth: 3,),
],
),
SizedBox(
height: 10,
),
Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Padding(
padding: const EdgeInsets.symmetric(horizontal: 20),
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Text(
"Please insert username and password to login",
style: TextStyle(
fontSize: 13, color: Colors.grey),
),
SizedBox(
height: 10,
)
],
),
),
SizedBox(
height: 10,
),
Container(
child: TextFields(
onChanged: (value) => {},
hintText: "User Name",
),
),
SizedBox(
height: 20,
),
Container(
child: TextFields(
borderRadiusValue: 6,
onChanged: (value) => {},
hintText: "Password",
),
),
SizedBox(
height: 25,
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Text(
"Forgot Password?",
style: TextStyle(
fontSize: 14,
color: Theme.of(context).primaryColor),
),
],
),
],
),
],
),
),
SizedBox(
height: 20,
),
SizedBox(
height: 10,
)
],
),
),
bottomSheet: Container(
margin: EdgeInsets.all(10),
height: MediaQuery.of(context).size.height * 0.12,
child: Column(
children: <Widget>[
SecondaryButton(label: "Login"),
SizedBox(
height: 30,
)
],
)),
),
),
);
}
}
class CircleContainer extends StatelessWidget {
const CircleContainer(
{this.child,
this.color = Colors.white,
this.borderColor,
this.borderWidth = 2.0});
final Widget child;
final Color color;
final Color borderColor;
final double borderWidth;
@override
Widget build(BuildContext context) {
return Container(
child: Center(child: child),
decoration: BoxDecoration(
shape: BoxShape.circle,
color: color,
border: Border.all(
color: borderColor ?? Hexcolor("#707070"),
width: borderWidth)),
height: 60,
width: 60,
);
}
}