design updates

design_update
hussam al-habibeh 6 years ago
parent a6f86572e6
commit 3fc3a0fe4b

@ -28,8 +28,7 @@ class LoginPage extends StatelessWidget {
return AnimatedSwitcher( return AnimatedSwitcher(
duration: Duration(microseconds: 350), duration: Duration(microseconds: 350),
child: BaseView<AuthenticationViewModel>( child: BaseView<AuthenticationViewModel>(
builder: (_, model, widget) => builder: (_, model, widget) => AppScaffold(
AppScaffold(
isShowAppBar: false, isShowAppBar: false,
body: SingleChildScrollView( body: SingleChildScrollView(
child: Center( child: Center(
@ -55,10 +54,12 @@ class LoginPage extends StatelessWidget {
margin: EdgeInsets.only( margin: EdgeInsets.only(
right: projectViewModel.isArabic right: projectViewModel.isArabic
? 0 ? 0
: MediaQuery.of(context).size.width * 0.15, : MediaQuery.of(context).size.width *
0.15,
left: !projectViewModel.isArabic left: !projectViewModel.isArabic
? 0 ? 0
: MediaQuery.of(context).size.width * 0.15), : MediaQuery.of(context).size.width *
0.15),
), ),
], ],
), ),
@ -88,50 +89,52 @@ class LoginPage extends StatelessWidget {
SizedBox( SizedBox(
height: 30, height: 30,
), ),
Row(
mainAxisAlignment: MainAxisAlignment.center, // Row(
children: <Widget>[ // mainAxisAlignment: MainAxisAlignment.center,
CircleContainer( // children: <Widget>[
onTap: () => projectViewModel.changeLanguage('en'), // CircleContainer(
child: Text( // onTap: () =>
TranslationBase.of(context).lanEnglish, // projectViewModel.changeLanguage('en'),
style: TextStyle( // child: Text(
fontSize: 12, // TranslationBase.of(context).lanEnglish,
color: projectViewModel.isArabic // style: TextStyle(
? Colors.black // fontSize: 12,
: Colors.white), // color: projectViewModel.isArabic
), // ? Colors.black
color: projectViewModel.isArabic // : Colors.white),
? Colors.transparent // ),
: Theme.of(context).primaryColor, // color: projectViewModel.isArabic
borderWidth: projectViewModel.isArabic ? 3 : 0, // ? Colors.transparent
borderColor: projectViewModel.isArabic // : Theme.of(context).primaryColor,
? Theme.of(context).primaryColor // borderWidth: projectViewModel.isArabic ? 3 : 0,
: Colors.transparent, // borderColor: projectViewModel.isArabic
), // ? Theme.of(context).primaryColor
SizedBox( // : Colors.transparent,
width: 20, // ),
), // SizedBox(
CircleContainer( // width: 20,
onTap: () => // ),
projectViewModel.changeLanguage('ar'), // CircleContainer(
child: Text( // onTap: () =>
TranslationBase.of(context).lanArabic, // projectViewModel.changeLanguage('ar'),
style: TextStyle( // child: Text(
fontSize: 12, // TranslationBase.of(context).lanArabic,
color: !projectViewModel.isArabic // style: TextStyle(
? Colors.black // fontSize: 12,
: Colors.white), // color: !projectViewModel.isArabic
), // ? Colors.black
color: !projectViewModel.isArabic // : Colors.white),
? Colors.transparent // ),
: Theme.of(context).primaryColor, // color: !projectViewModel.isArabic
borderWidth: !projectViewModel.isArabic ? 3 : 0, // ? Colors.transparent
borderColor: !projectViewModel.isArabic // : Theme.of(context).primaryColor,
? Theme.of(context).primaryColor // borderWidth: !projectViewModel.isArabic ? 3 : 0,
: Colors.transparent), // borderColor: !projectViewModel.isArabic
], // ? Theme.of(context).primaryColor
), // : Colors.transparent),
// ],
// ),
SizedBox( SizedBox(
height: 10, height: 10,
), ),
@ -148,7 +151,8 @@ class LoginPage extends StatelessWidget {
children: <Widget>[ children: <Widget>[
Expanded( Expanded(
child: Text( child: Text(
TranslationBase.of(context).enterCredentialsMsg, TranslationBase.of(context)
.enterCredentialsMsg,
style: TextStyle( style: TextStyle(
fontSize: 13, color: Colors.grey), fontSize: 13, color: Colors.grey),
), ),
@ -173,7 +177,8 @@ class LoginPage extends StatelessWidget {
return null; return null;
}, },
onSaved: (value) { onSaved: (value) {
loginRequest.userID = int.parse(value.trim()); loginRequest.userID =
int.parse(value.trim());
}, },
), ),
), ),
@ -195,6 +200,7 @@ class LoginPage extends StatelessWidget {
onSaved: (value) { onSaved: (value) {
loginRequest.password = value; loginRequest.password = value;
}, },
type: 'password',
), ),
), ),
SizedBox( SizedBox(
@ -222,7 +228,8 @@ class LoginPage extends StatelessWidget {
), ),
SizedBox( SizedBox(
height: 10, height: 10,
),Container( ),
Container(
margin: EdgeInsets.all(10), margin: EdgeInsets.all(10),
height: MediaQuery.of(context).size.height * 0.22, height: MediaQuery.of(context).size.height * 0.22,
child: Column( child: Column(
@ -244,7 +251,6 @@ class LoginPage extends StatelessWidget {
), ),
), ),
), ),
), ),
), ),
); );
@ -257,10 +263,9 @@ class LoginPage extends StatelessWidget {
if (model.state == ViewState.ErrorLocal) { if (model.state == ViewState.ErrorLocal) {
Utils.showErrorToast(model.error); Utils.showErrorToast(model.error);
} else { } else {
Navigator.push( Navigator.push(context,
context, MaterialPageRoute(builder: (context) => DashboardScreen())); MaterialPageRoute(builder: (context) => DashboardScreen()));
} }
} }
} }
} }

@ -475,7 +475,7 @@ class _DashboardScreenState extends State<DashboardScreen> {
raduis: 25.0, raduis: 25.0,
height: MediaQuery.of(context).orientation == height: MediaQuery.of(context).orientation ==
Orientation.portrait Orientation.portrait
? MediaQuery.of(context).size.height * 0.109 ? MediaQuery.of(context).size.height * 0.120
: MediaQuery.of(context).size.height * 0.209, : MediaQuery.of(context).size.height * 0.209,
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
@ -543,12 +543,23 @@ class _DashboardScreenState extends State<DashboardScreen> {
fontSize: 15.0, fontSize: 15.0,
), ),
), ),
Expanded(
child: Text(
model.orders[index].orderID
.toString(),
style: TextStyle(
fontSize: 15.0,
fontWeight: FontWeight.w400,
letterSpacing: 8.0),
),
),
], ],
), ),
), ),
Padding( Padding(
padding: EdgeInsets.all(8.0), padding: EdgeInsets.all(8.0),
child: CircleContainer( child: CircleContainer(
borderWidth: 0.9,
child: Text( child: Text(
model.orders[index].distanceInKilometers model.orders[index].distanceInKilometers
.toString() + .toString() +

@ -38,7 +38,7 @@ class _OrdersListScreenState extends State<OrdersListScreen> {
raduis: 25.0, raduis: 25.0,
height: MediaQuery.of(context).orientation == height: MediaQuery.of(context).orientation ==
Orientation.portrait Orientation.portrait
? MediaQuery.of(context).size.height * 0.109 ? MediaQuery.of(context).size.height * 0.120
: MediaQuery.of(context).size.height * 0.209, : MediaQuery.of(context).size.height * 0.209,
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
@ -96,12 +96,22 @@ class _OrdersListScreenState extends State<OrdersListScreen> {
fontSize: 15.0, fontSize: 15.0,
), ),
), ),
Expanded(
child: Text(
model.orders[index].orderID.toString(),
style: TextStyle(
fontSize: 18.0,
fontWeight: FontWeight.w400,
letterSpacing: 8.0),
),
),
], ],
), ),
), ),
Padding( Padding(
padding: EdgeInsets.all(8.0), padding: EdgeInsets.all(8.0),
child: CircleContainer( child: CircleContainer(
borderWidth: 0.8,
child: Text( child: Text(
model.orders[index].distanceInKilometers model.orders[index].distanceInKilometers
.toString() + .toString() +

@ -14,7 +14,7 @@ class RootPage extends StatelessWidget {
Widget buildRoot(APP_STATUS status) { Widget buildRoot(APP_STATUS status) {
switch (status) { switch (status) {
case APP_STATUS.UNAUTHENTICATED: case APP_STATUS.UNAUTHENTICATED:
return LoginPage (); return LoginPage();
break; break;
case APP_STATUS.AUTHENTICATED: case APP_STATUS.AUTHENTICATED:
return DashboardScreen(); return DashboardScreen();

@ -39,7 +39,8 @@ class NumberTextInputFormatter extends TextInputFormatter {
final _mobileFormatter = NumberTextInputFormatter(); final _mobileFormatter = NumberTextInputFormatter();
class TextFields extends StatefulWidget { class TextFields extends StatefulWidget {
TextFields({Key key, TextFields({
Key key,
this.type, this.type,
this.hintText, this.hintText,
this.suffixIcon, this.suffixIcon,
@ -76,8 +77,9 @@ class TextFields extends StatefulWidget {
this.borderWidth = 1.5, this.borderWidth = 1.5,
this.fieldTextColor, this.fieldTextColor,
this.textAlign = TextAlign.start, this.textAlign = TextAlign.start,
this.borderRadius}) this.borderRadius,
: super(key: key); this.obscureText,
}) : super(key: key);
final String hintText; final String hintText;
final String initialValue; final String initialValue;
@ -116,6 +118,7 @@ class TextFields extends StatefulWidget {
final double borderWidth; final double borderWidth;
final Color fieldTextColor; final Color fieldTextColor;
final TextAlign textAlign; final TextAlign textAlign;
final bool obscureText;
@override @override
_TextFieldsState createState() => _TextFieldsState(); _TextFieldsState createState() => _TextFieldsState();
@ -162,9 +165,7 @@ class _TextFieldsState extends State<TextFields> {
}); });
}, },
child: Icon(EvaIcons.eye, child: Icon(EvaIcons.eye,
size: 24.0, color: Theme size: 24.0, color: Theme.of(context).primaryColor))
.of(context)
.primaryColor))
: InkWell( : InkWell(
onTap: () { onTap: () {
this.setState(() { this.setState(() {
@ -218,9 +219,7 @@ class _TextFieldsState extends State<TextFields> {
blurRadius: focus ? 34.0 : 12.0) blurRadius: focus ? 34.0 : 12.0)
]), ]),
child: TextFormField( child: TextFormField(
keyboardAppearance: Theme keyboardAppearance: Theme.of(context).brightness,
.of(context)
.brightness,
scrollPhysics: BouncingScrollPhysics(), scrollPhysics: BouncingScrollPhysics(),
autovalidate: widget.autoValidate, autovalidate: widget.autoValidate,
onTap: widget.onTap, onTap: widget.onTap,
@ -248,11 +247,7 @@ class _TextFieldsState extends State<TextFields> {
autofocus: widget.autoFocus ?? false, autofocus: widget.autoFocus ?? false,
validator: widget.validator, validator: widget.validator,
onSaved: widget.onSaved, onSaved: widget.onSaved,
style: Theme style: Theme.of(context).textTheme.body2.copyWith(
.of(context)
.textTheme
.body2
.copyWith(
fontSize: widget.fontSize, fontSize: widget.fontSize,
fontWeight: widget.fontWeight, fontWeight: widget.fontWeight,
color: widget.color), color: widget.color),
@ -268,9 +263,7 @@ class _TextFieldsState extends State<TextFields> {
hintStyle: TextStyle( hintStyle: TextStyle(
fontSize: widget.fontSize, fontSize: widget.fontSize,
fontWeight: widget.fontWeight, fontWeight: widget.fontWeight,
color: Theme color: Theme.of(context).hintColor),
.of(context)
.hintColor),
contentPadding: widget.padding != null contentPadding: widget.padding != null
? widget.padding ? widget.padding
: EdgeInsets.symmetric( : EdgeInsets.symmetric(
@ -281,9 +274,7 @@ class _TextFieldsState extends State<TextFields> {
? Colors.transparent ? Colors.transparent
: widget.fieldTextColor != null : widget.fieldTextColor != null
? widget.fieldTextColor ? widget.fieldTextColor
: Theme : Theme.of(context).backgroundColor,
.of(context)
.backgroundColor,
suffixIcon: _buildSuffixIcon(), suffixIcon: _buildSuffixIcon(),
prefixIcon: widget.type != "search" prefixIcon: widget.type != "search"
? widget.prefixIcon != null ? widget.prefixIcon != null
@ -304,8 +295,7 @@ class _TextFieldsState extends State<TextFields> {
height: widget.borderOnlyError ? 0.0 : null), height: widget.borderOnlyError ? 0.0 : null),
errorBorder: OutlineInputBorder( errorBorder: OutlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: Theme color: Theme.of(context)
.of(context)
.errorColor .errorColor
.withOpacity(widget.bare ? 0.0 : 0.5), .withOpacity(widget.bare ? 0.0 : 0.5),
width: widget.borderWidth), width: widget.borderWidth),
@ -316,8 +306,7 @@ class _TextFieldsState extends State<TextFields> {
: BorderRadius.circular(widget.borderRadiusValue)), : BorderRadius.circular(widget.borderRadiusValue)),
focusedErrorBorder: OutlineInputBorder( focusedErrorBorder: OutlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: Theme color: Theme.of(context)
.of(context)
.errorColor .errorColor
.withOpacity(widget.bare ? 0.0 : 0.5), .withOpacity(widget.bare ? 0.0 : 0.5),
width: widget.borderWidth), width: widget.borderWidth),
@ -328,8 +317,7 @@ class _TextFieldsState extends State<TextFields> {
: BorderRadius.circular(widget.borderRadiusValue)), : BorderRadius.circular(widget.borderRadiusValue)),
focusedBorder: OutlineInputBorder( focusedBorder: OutlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: Theme color: Theme.of(context)
.of(context)
.dividerColor .dividerColor
.withOpacity(widget.bare ? 0.0 : 1.0), .withOpacity(widget.bare ? 0.0 : 1.0),
width: widget.borderWidth), width: widget.borderWidth),
@ -339,18 +327,10 @@ class _TextFieldsState extends State<TextFields> {
? widget.borderRadius ? widget.borderRadius
: BorderRadius.circular(widget.borderRadiusValue)), : BorderRadius.circular(widget.borderRadiusValue)),
disabledBorder: disabledBorder:
OutlineInputBorder(borderSide: BorderSide(color: Theme OutlineInputBorder(borderSide: BorderSide(color: Theme.of(context).dividerColor.withOpacity(widget.bare ? 0.0 : 1.0), width: widget.borderWidth), borderRadius: widget.bare ? BorderRadius.circular(0.0) : widget.borderRadius != null ? widget.borderRadius : BorderRadius.circular(widget.borderRadiusValue)),
.of(context)
.dividerColor
.withOpacity(widget.bare ? 0.0 : 1.0),
width: widget.borderWidth),
borderRadius: widget.bare ? BorderRadius.circular(0.0) : widget
.borderRadius != null ? widget.borderRadius : BorderRadius
.circular(widget.borderRadiusValue)),
enabledBorder: OutlineInputBorder( enabledBorder: OutlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: Theme color: Theme.of(context)
.of(context)
.dividerColor .dividerColor
.withOpacity(widget.bare ? 0.0 : 1.0), .withOpacity(widget.bare ? 0.0 : 1.0),
width: widget.borderWidth), width: widget.borderWidth),

Loading…
Cancel
Save