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.
206 lines
7.5 KiB
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,
|
|
);
|
|
}
|
|
}
|