From 43d4002abc1a6b7735052f92dd77b2130bc9b40d Mon Sep 17 00:00:00 2001 From: Elham Rababah Date: Thu, 3 Sep 2020 11:16:40 +0300 Subject: [PATCH] make dashboard_screen scrollable --- lib/pages/dashboard/dashboard_screen.dart | 842 +++++++++--------- .../data_display/dialog/custom_dialog.dart | 2 +- 2 files changed, 430 insertions(+), 414 deletions(-) diff --git a/lib/pages/dashboard/dashboard_screen.dart b/lib/pages/dashboard/dashboard_screen.dart index 86b5ac8..8b5cf96 100644 --- a/lib/pages/dashboard/dashboard_screen.dart +++ b/lib/pages/dashboard/dashboard_screen.dart @@ -5,7 +5,9 @@ import 'package:driverapp/core/viewModels/orders_view_model.dart'; import 'package:driverapp/pages/delivery/information_page.dart'; import 'package:driverapp/pages/orders/pending_orders_page.dart'; import 'package:driverapp/uitl/app_toast.dart'; +import 'package:driverapp/uitl/translations_delegate_base.dart'; import 'package:driverapp/uitl/utils.dart'; +import 'package:driverapp/widgets/data_display/circle-container.dart'; import 'package:driverapp/widgets/others/app_scaffold_widget.dart'; import 'package:driverapp/widgets/others/network_base_view.dart'; import 'package:driverapp/widgets/others/rounded_container.dart'; @@ -13,11 +15,7 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:hexcolor/hexcolor.dart'; -import 'package:driverapp/widgets/data_display/circle-container.dart'; -import 'package:font_awesome_flutter/font_awesome_flutter.dart'; import '../base/base_view.dart'; -import 'package:driverapp/config/shared_pref_kay.dart'; -import 'package:driverapp/uitl/translations_delegate_base.dart'; class DashboardScreen extends StatefulWidget { @override @@ -32,478 +30,496 @@ class _DashboardScreenState extends State { onModelReady: (model) => model.getPendingOrders(), builder: (BuildContext context, OrdersViewModel model, Widget child) => AppScaffold( - body: Column( - // mainAxisAlignment: MainAxisAlignment.center, - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Padding( - padding: EdgeInsets.all(16.0), - child: Column( - children: [ - SafeArea( - child: Column( - mainAxisAlignment: MainAxisAlignment.start, - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - TranslationBase.of(context).haveGreatDay, - style: TextStyle( - fontSize: 14.5, - color: Color(0xff636363), - fontWeight: FontWeight.w300), - ), - Padding( - padding: EdgeInsets.only(top: 4.5), - child: Text( - 'Drive Name', - //model.user.userName, - style: TextStyle( - fontWeight: FontWeight.w400, - fontSize: 25.0), - ), - ), - ], - ), - ), - ], - ), - ), - Padding( - padding: EdgeInsets.all(16.0), - child: SafeArea( + body: Container( + height: MediaQuery.of(context).size.height * .95, + child: ListView( + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Padding( + padding: EdgeInsets.all(16.0), child: Column( children: [ - CircleAvatar( - radius: 25.5, - backgroundColor: Color(0xff30B7B9), - child: CircleAvatar( - backgroundColor: Color(0xff30B7B9), - maxRadius: 26.0, - child: Image.asset( - 'assets/images/driver.png', - fit: BoxFit.contain, - ), - ), - ), - ], - ), - ), - ), - ], - ), - Row( - children: [ - Expanded( - child: Column( - children: [ - Padding( - padding: EdgeInsets.symmetric(horizontal: 10.0), - child: Container( - height: MediaQuery.of(context).size.height * 0.16, - width: MediaQuery.of(context).size.width * 0.44, - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(15.0), - gradient: LinearGradient( - colors: [Color(0xff17AFB8), Color(0xff49C1BC)]), - ), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, + SafeArea( + child: Column( + mainAxisAlignment: MainAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.start, children: [ - Expanded( - child: Padding( - padding: EdgeInsets.all(2.0), - child: Column( - mainAxisAlignment: - MainAxisAlignment.spaceEvenly, - children: [ - Text( - TranslationBase.of(context).youHave, - style: TextStyle( - color: Colors.white, - fontSize: 10.0), - ), - Text( - '5', - style: TextStyle( - color: Colors.white, - fontSize: 25.0), - ), - Text( - TranslationBase.of(context) - .undeliveredPackages, - style: TextStyle( - color: Colors.white, fontSize: 9.5), - ) - ], - ), - ), + Text( + TranslationBase.of(context).haveGreatDay, + style: TextStyle( + fontSize: 14.5, + color: Color(0xff636363), + fontWeight: FontWeight.w300), ), Padding( - padding: EdgeInsets.only(right: 9.5), - child: Container( - width: 110, - height: 110, - decoration: BoxDecoration( - color: Colors.white10, - shape: BoxShape.circle), - child: Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Image.asset( - 'assets/images/closed_box.png', - height: - MediaQuery.of(context).size.height * - 0.10, - width: - MediaQuery.of(context).size.width * - 0.20, - scale: 0.9, - fit: BoxFit.contain, - ), - ], - ), + padding: EdgeInsets.only(top: 4.5), + child: Text( + 'Drive Name', + //model.user.userName, + style: TextStyle( + fontWeight: FontWeight.w400, + fontSize: 25.0), ), ), ], ), ), - ) - ], + ], + ), ), - ), - Expanded( - child: Column( - children: [ - Padding( - padding: EdgeInsets.symmetric(horizontal: 10.0), - child: Container( - height: MediaQuery.of(context).size.height * 0.16, - width: MediaQuery.of(context).size.width * 0.45, - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(15.0), - gradient: LinearGradient( - colors: [Color(0xff17AFB8), Color(0xff49C1BC)]), + Padding( + padding: EdgeInsets.all(16.0), + child: SafeArea( + child: Column( + children: [ + CircleAvatar( + radius: 25.5, + backgroundColor: Color(0xff30B7B9), + child: CircleAvatar( + backgroundColor: Color(0xff30B7B9), + maxRadius: 26.0, + child: Image.asset( + 'assets/images/driver.png', + fit: BoxFit.contain, + ), + ), ), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Expanded( - child: Padding( - padding: EdgeInsets.all(2.0), - child: Column( - mainAxisAlignment: - MainAxisAlignment.spaceEvenly, - children: [ - Text( - TranslationBase.of(context).youHave, - style: TextStyle( - color: Colors.white, - fontSize: 10.0), - ), - Text( - '25', - style: TextStyle( - color: Colors.white, - fontSize: 25.0), - ), - Text( - TranslationBase.of(context) - .deliveredPackages, - style: TextStyle( - color: Colors.white, - fontSize: 10.0), - ) - ], + ], + ), + ), + ), + ], + ), + Row( + children: [ + Expanded( + child: Column( + children: [ + Padding( + padding: EdgeInsets.symmetric(horizontal: 10.0), + child: Container( + height: MediaQuery.of(context).size.height * 0.16, + width: MediaQuery.of(context).size.width * 0.44, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(15.0), + gradient: LinearGradient(colors: [ + Color(0xff17AFB8), + Color(0xff49C1BC) + ]), + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Expanded( + child: Padding( + padding: EdgeInsets.all(2.0), + child: Column( + mainAxisAlignment: + MainAxisAlignment.spaceEvenly, + children: [ + Text( + TranslationBase.of(context).youHave, + style: TextStyle( + color: Colors.white, + fontSize: 10.0), + ), + Text( + '5', + style: TextStyle( + color: Colors.white, + fontSize: 25.0), + ), + Text( + TranslationBase.of(context) + .undeliveredPackages, + style: TextStyle( + color: Colors.white, + fontSize: 9.5), + ) + ], + ), ), ), - ), - Padding( - padding: EdgeInsets.only(right: 9.5), - child: Container( - width: 110, - height: 110, - decoration: BoxDecoration( - color: Colors.white10, - shape: BoxShape.circle), - child: Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Image.asset( - 'assets/images/opend_box.png', - height: - MediaQuery.of(context).size.height * - 0.10, - width: - MediaQuery.of(context).size.width * - 0.20, - scale: 0.9, - fit: BoxFit.contain, - ), - ], + Padding( + padding: EdgeInsets.only(right: 9.5), + child: Container( + width: 110, + height: 110, + decoration: BoxDecoration( + color: Colors.white10, + shape: BoxShape.circle), + child: Column( + mainAxisAlignment: + MainAxisAlignment.center, + children: [ + Image.asset( + 'assets/images/closed_box.png', + height: MediaQuery.of(context) + .size + .height * + 0.10, + width: MediaQuery.of(context) + .size + .width * + 0.20, + scale: 0.9, + fit: BoxFit.contain, + ), + ], + ), ), ), - ), - ], + ], + ), ), - ), - ) - ], + ) + ], + ), ), - ), - ], - ), - Padding( - padding: EdgeInsets.symmetric(vertical: 16.0, horizontal: 15.0), - child: Row( - children: [ Expanded( - child: InkWell( - child: Container( - height: MediaQuery.of(context).orientation == - Orientation.portrait - ? MediaQuery.of(context).size.height * 0.18 - : MediaQuery.of(context).size.height * 0.28, - width: MediaQuery.of(context).size.width * 0.50, - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(15.0), - gradient: LinearGradient( - colors: [Hexcolor("#45B7AE"), Hexcolor("#119FA9")], - ), - ), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceEvenly, - children: [ - Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Image.asset( - 'assets/images/qr_code.png', - width: - MediaQuery.of(context).size.width * 0.26, - height: - MediaQuery.of(context).size.height * 0.14, - fit: BoxFit.contain, - ) - ], + child: Column( + children: [ + Padding( + padding: EdgeInsets.symmetric(horizontal: 10.0), + child: Container( + height: MediaQuery.of(context).size.height * 0.16, + width: MediaQuery.of(context).size.width * 0.45, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(15.0), + gradient: LinearGradient(colors: [ + Color(0xff17AFB8), + Color(0xff49C1BC) + ]), ), - Column( - mainAxisAlignment: MainAxisAlignment.spaceEvenly, - crossAxisAlignment: CrossAxisAlignment.start, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - InkWell( - onTap: () { - _scanQrAndGetPatient(context, model); - }, + Expanded( child: Padding( - padding: EdgeInsets.only(top: 8.0), - child: Text( - TranslationBase.of(context).scan, - style: TextStyle( - fontSize: 35.0, - color: Colors.white, - fontWeight: FontWeight.w400, - ), + padding: EdgeInsets.all(2.0), + child: Column( + mainAxisAlignment: + MainAxisAlignment.spaceEvenly, + children: [ + Text( + TranslationBase.of(context).youHave, + style: TextStyle( + color: Colors.white, + fontSize: 10.0), + ), + Text( + '25', + style: TextStyle( + color: Colors.white, + fontSize: 25.0), + ), + Text( + TranslationBase.of(context) + .deliveredPackages, + style: TextStyle( + color: Colors.white, + fontSize: 10.0), + ) + ], ), ), ), Padding( - padding: EdgeInsets.only(top: 0.0), - child: Text( - TranslationBase.of(context) - .toAddPackageToQue, - style: TextStyle( - fontSize: 15.0, - color: Colors.white, - letterSpacing: 0.2, - wordSpacing: 0.5, + padding: EdgeInsets.only(right: 9.5), + child: Container( + width: 110, + height: 110, + decoration: BoxDecoration( + color: Colors.white10, + shape: BoxShape.circle), + child: Column( + mainAxisAlignment: + MainAxisAlignment.center, + children: [ + Image.asset( + 'assets/images/opend_box.png', + height: MediaQuery.of(context) + .size + .height * + 0.10, + width: MediaQuery.of(context) + .size + .width * + 0.20, + scale: 0.9, + fit: BoxFit.contain, + ), + ], ), ), ), ], - ) - ], - ), - ), + ), + ), + ) + ], ), - ) + ), ], ), - ), - NetworkBaseView( - baseViewModel: model, - child: Padding( - padding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 1.0), + Padding( + padding: EdgeInsets.symmetric(vertical: 16.0, horizontal: 15.0), child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Column( - children: [ - Text( - TranslationBase.of(context).nearestDropOffs, - style: TextStyle( - fontSize: 21.0, - fontWeight: FontWeight.w400, + Expanded( + child: InkWell( + child: Container( + height: MediaQuery.of(context).orientation == + Orientation.portrait + ? MediaQuery.of(context).size.height * 0.18 + : MediaQuery.of(context).size.height * 0.28, + width: MediaQuery.of(context).size.width * 0.50, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(15.0), + gradient: LinearGradient( + colors: [ + Hexcolor("#45B7AE"), + Hexcolor("#119FA9") + ], + ), ), - ), - ], - ), - Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - InkWell( child: Row( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ - Text( - TranslationBase.of(context).seeAll, - style: TextStyle( - fontSize: 14.5, color: Color(0xff42B6AD)), - ), - Icon( - Icons.arrow_forward_ios, - size: 15.0, - color: Color(0xff42B6AD), + Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Image.asset( + 'assets/images/qr_code.png', + width: MediaQuery.of(context).size.width * + 0.26, + height: MediaQuery.of(context).size.height * + 0.14, + fit: BoxFit.contain, + ) + ], ), + Column( + mainAxisAlignment: + MainAxisAlignment.spaceEvenly, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + InkWell( + onTap: () { + _scanQrAndGetPatient(context, model); + }, + child: Padding( + padding: EdgeInsets.only(top: 8.0), + child: Text( + TranslationBase.of(context).scan, + style: TextStyle( + fontSize: 35.0, + color: Colors.white, + fontWeight: FontWeight.w400, + ), + ), + ), + ), + Padding( + padding: EdgeInsets.only(top: 0.0), + child: Text( + TranslationBase.of(context) + .toAddPackageToQue, + style: TextStyle( + fontSize: 15.0, + color: Colors.white, + letterSpacing: 0.2, + wordSpacing: 0.5, + ), + ), + ), + ], + ) ], ), - onTap: () => Navigator.push( - context, - MaterialPageRoute( - builder: (context) => OrdersListScreen()), - ), ), - ], - ), + ), + ) ], ), ), - ), - NetworkBaseView( - baseViewModel: model, - child: Expanded( - child: ListView.builder( - shrinkWrap: true, - scrollDirection: Axis.vertical, - itemCount: //model.orders == null ? 0 : model.orders.length, - 3, - itemBuilder: (BuildContext context, int index) { - return Padding( - padding: EdgeInsets.symmetric(horizontal: 12.2), - child: InkWell( - child: RoundedContainer( - raduis: 25.0, - height: MediaQuery.of(context).orientation == - Orientation.portrait - ? MediaQuery.of(context).size.height * 0.109 - : MediaQuery.of(context).size.height * 0.209, - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Expanded( - flex: 1, - child: Column( - mainAxisAlignment: MainAxisAlignment.start, - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Padding( - padding: EdgeInsets.only( - left: 15.0, top: 14.0), - child: Image.asset( - 'assets/images/location.png', - height: MediaQuery.of(context) - .orientation == - Orientation.portrait - ? MediaQuery.of(context) - .size - .height * - 0.06 - : MediaQuery.of(context) - .size - .height * - 0.11, - width: MediaQuery.of(context) - .orientation == - Orientation.portrait - ? MediaQuery.of(context) - .size - .width * - 0.05 - : MediaQuery.of(context) - .size - .width * - 0.09, - ), - ) - ], + NetworkBaseView( + baseViewModel: model, + child: Padding( + padding: + EdgeInsets.symmetric(horizontal: 20.0, vertical: 1.0), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Column( + children: [ + Text( + TranslationBase.of(context).nearestDropOffs, + style: TextStyle( + fontSize: 21.0, + fontWeight: FontWeight.w400, + ), + ), + ], + ), + Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + InkWell( + child: Row( + children: [ + Text( + TranslationBase.of(context).seeAll, + style: TextStyle( + fontSize: 14.5, color: Color(0xff42B6AD)), ), - ), - if (model.orders.length != 0) + Icon( + Icons.arrow_forward_ios, + size: 15.0, + color: Color(0xff42B6AD), + ), + ], + ), + onTap: () => Navigator.push( + context, + MaterialPageRoute( + builder: (context) => OrdersListScreen()), + ), + ), + ], + ), + ], + ), + ), + ), + NetworkBaseView( + baseViewModel: model, + child: Expanded( + child: ListView.builder( + shrinkWrap: true, + scrollDirection: Axis.vertical, + itemCount: //model.orders == null ? 0 : model.orders.length, + 3, + itemBuilder: (BuildContext context, int index) { + return Padding( + padding: EdgeInsets.symmetric(horizontal: 12.2), + child: InkWell( + child: RoundedContainer( + raduis: 25.0, + height: MediaQuery.of(context).orientation == + Orientation.portrait + ? MediaQuery.of(context).size.height * 0.109 + : MediaQuery.of(context).size.height * 0.209, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ Expanded( - flex: 5, + flex: 1, child: Column( + mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: [ Padding( - padding: EdgeInsets.only(top: 20.0), - child: Text( - model.orders[index].firstName + - ' ' + - model.orders[index].lastName, - style: TextStyle(fontSize: 18.0), + padding: EdgeInsets.only( + left: 15.0, top: 14.0), + child: Image.asset( + 'assets/images/location.png', + height: MediaQuery.of(context) + .orientation == + Orientation.portrait + ? MediaQuery.of(context) + .size + .height * + 0.06 + : MediaQuery.of(context) + .size + .height * + 0.11, + width: MediaQuery.of(context) + .orientation == + Orientation.portrait + ? MediaQuery.of(context) + .size + .width * + 0.05 + : MediaQuery.of(context) + .size + .width * + 0.09, ), - ), - Text( - model.orders[index].mobileNumber, - style: TextStyle( - color: Color(0xff30B7B9), - fontWeight: FontWeight.w600, - fontSize: 15.0, + ) + ], + ), + ), + if (model.orders.length != 0) + Expanded( + flex: 5, + child: Column( + crossAxisAlignment: + CrossAxisAlignment.start, + children: [ + Padding( + padding: EdgeInsets.only(top: 20.0), + child: Text( + model.orders[index].firstName + + ' ' + + model.orders[index].lastName, + style: TextStyle(fontSize: 18.0), + ), ), - ), - Expanded( - child: Text( - 'Olaya ST, Behind kfc next to king , ', + Text( + model.orders[index].mobileNumber, style: TextStyle( - color: Color(0xff636363)), + color: Color(0xff30B7B9), + fontWeight: FontWeight.w600, + fontSize: 15.0, + ), ), - ), - ], + Expanded( + child: Text( + 'Olaya ST, Behind kfc next to king , ', + style: TextStyle( + color: Color(0xff636363)), + ), + ), + ], + ), ), - ), - Padding( - padding: EdgeInsets.all(8.0), - child: CircleContainer( - child: Text( - model.orders[index].distanceInKilometers - .toString() + - ' K.m\naway', - style: TextStyle( - color: Color(0xff42B6AD), - fontWeight: FontWeight.w800, - fontStyle: FontStyle.normal), + Padding( + padding: EdgeInsets.all(8.0), + child: CircleContainer( + child: Text( + model.orders[index].distanceInKilometers + .toString() + + ' K.m\naway', + style: TextStyle( + color: Color(0xff42B6AD), + fontWeight: FontWeight.w800, + fontStyle: FontStyle.normal), + ), ), ), - ), - ], + ], + ), ), + onTap: () { + Navigator.push( + context, + MaterialPageRoute( + builder: (context) => + InformationPage(model.orders[index]))); + }, ), - onTap: () { - Navigator.push( - context, - MaterialPageRoute( - builder: (context) => - InformationPage(model.orders[index]))); - }, - ), - ); - }, + ); + }, + ), ), ), - ), - ], + ], + ), ), ), ); diff --git a/lib/widgets/data_display/dialog/custom_dialog.dart b/lib/widgets/data_display/dialog/custom_dialog.dart index 64315c6..5b1cb9c 100644 --- a/lib/widgets/data_display/dialog/custom_dialog.dart +++ b/lib/widgets/data_display/dialog/custom_dialog.dart @@ -20,7 +20,7 @@ class CustomDialog extends StatelessWidget { return BaseView( builder: (_, model, w) => Center( child: Container( - height: MediaQuery.of(context).size.height * 0.35, + height: MediaQuery.of(context).size.height * 0.50, width: MediaQuery.of(context).size.width * 0.95, child: Dialog( shape: RoundedRectangleBorder(