From f9706254d5a988f46b9bc70b77ba2b1356e1de9a Mon Sep 17 00:00:00 2001 From: Sikander Saleem Date: Mon, 15 May 2023 10:10:39 +0300 Subject: [PATCH] bookmark, change password, member & user profile screen added. --- lib/ui/screens/bookmark_screen.dart | 223 ++++++++++++++------- lib/ui/screens/change_password_screen.dart | 149 ++++++++------ lib/ui/screens/member_screen.dart | 2 +- lib/ui/screens/user_profile_screen.dart | 138 ++++++++----- 4 files changed, 320 insertions(+), 192 deletions(-) diff --git a/lib/ui/screens/bookmark_screen.dart b/lib/ui/screens/bookmark_screen.dart index c895466..45c4c2d 100644 --- a/lib/ui/screens/bookmark_screen.dart +++ b/lib/ui/screens/bookmark_screen.dart @@ -58,95 +58,164 @@ class _BookmarkScreenState extends State { @override Widget build(BuildContext context) { - return Stack( + bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait; + Widget _header = Stack( + alignment: Alignment.center, children: [ - Stack( - alignment: Alignment.center, + SizedBox( + height: isPortrait ? null : double.infinity, + width: double.infinity, + child: AspectRatio( + aspectRatio: 375 / 215, + child: Image.asset("assets/icons/new/quran_bg.jpg", fit: BoxFit.cover, alignment: Alignment(isPortrait ? -0.3 : -0.45, 0.5)), + ), + ), + Column( + mainAxisSize: MainAxisSize.min, children: [ - AspectRatio( - aspectRatio: 375 / 215, - child: Image.asset("assets/icons/new/quran_bg.jpg", fit: BoxFit.cover, alignment: Alignment(-0.3, 0.5)), - ), - Column( - mainAxisSize: MainAxisSize.min, - children: [ - Image.asset('assets/icons/new/Tangeem-logo-W.png', width: 50), - 26.height, - "المرجعية".toText(30), - ], - ).paddingOnly(top: 16), + Image.asset('assets/icons/new/Tangeem-logo-W.png', width: 50), + 26.height, + "المرجعية".toText(30), ], - ), - _bookMarkList.isEmpty - ? NoDataUI().paddingOnly(top: 215) - : ListView.separated( - physics: BouncingScrollPhysics(), - padding: EdgeInsets.only(left: 24, right: 24, top: 215, bottom: 24), - itemCount: _bookMarkList.length, - separatorBuilder: (context, index) { - return SizedBox(height: 8); - }, - itemBuilder: (context, index) { - return Slidable( - controller: _slidableController, - actionPane: SlidableBehindActionPane(), - secondaryActions: [ - ClipRRect( - borderRadius: BorderRadius.circular(20), - child: IconSlideAction( - color: Colors.redAccent, - icon: Icons.delete, - closeOnTap: true, - onTap: () { - _bookMarkList.removeAt(index); - BookMarkModel.saveToPrefs(_bookMarkList); - Utils.showToast("تم حذف المرجع"); - setState(() {}); - }, - ), + ).paddingOnly(top: 16), + ], + ); + + Widget _dataListView = (_bookMarkList?.isEmpty ?? true) + ? NoDataUI().paddingOnly(top: isPortrait ? 215 : 0) + : ListView.separated( + physics: isPortrait ? NeverScrollableScrollPhysics() : null, + shrinkWrap: isPortrait, + padding: EdgeInsets.all(24), + itemCount: _bookMarkList.length, + separatorBuilder: (context, index) => 12.height, + itemBuilder: (context, index) { + return Row(children: [ + Container( + width: double.infinity, + padding: EdgeInsets.symmetric(vertical: 6, horizontal: 12), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(20), + border: Border.all(color: ColorConsts.greyLightColor, width: 1), + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + Row( + mainAxisSize: MainAxisSize.min, + children: [ + Icon(Icons.bookmark, color: ColorConsts.dark2Text, size: 18), + 8.width, + (_bookMarkList[index].surahNameAR).toText(16, color: ColorConsts.darkText), + 12.width, + Text( + "الآية رقم ${_bookMarkList[index].numberInSurah}", + style: TextStyle(fontSize: 14, color: ColorConsts.brownB7Color), + ), + ], ), + // Text( + // _bookMarkList[index].reverseAyatNumber(), + // textAlign: TextAlign.start, + // style: TextStyle( + // fontFamily: "UthmanicHafs", + // fontSize: 16, + // color: ColorConsts.primaryBlue, + // fontWeight: FontWeight.bold, + // ), + // ), ], - child: Container( - width: double.infinity, - padding: EdgeInsets.fromLTRB(12, 12, 12, 12), - decoration: BoxDecoration( - color: Colors.white, - borderRadius: BorderRadius.circular(20), - border: Border.all(color: ColorConsts.greyE0Color, width: 1), - ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, + ), + ).onPress(() { + Navigator.pushNamed(context, QuranScreen.routeName, arguments: _bookMarkList[index]); + }).expanded, + 12.width, + Icon(Icons.cancel_outlined, color: ColorConsts.greyLightColor).onPress(() { + _bookMarkList.removeAt(index); + BookMarkModel.saveToPrefs(_bookMarkList); + Utils.showToast("تم حذف المرجع"); + setState(() {}); + }), + 8.width, + Icon(Icons.arrow_forward_ios_rounded, color: ColorConsts.brownB7Color).onPress(() { + Navigator.pushNamed(context, QuranScreen.routeName, arguments: _bookMarkList[index]); + }), + ]); + return Slidable( + controller: _slidableController, + actionPane: SlidableBehindActionPane(), + secondaryActions: [ + ClipRRect( + borderRadius: BorderRadius.circular(20), + child: IconSlideAction( + color: Colors.redAccent, + icon: Icons.delete, + closeOnTap: true, + onTap: () { + _bookMarkList.removeAt(index); + BookMarkModel.saveToPrefs(_bookMarkList); + Utils.showToast("تم حذف المرجع"); + setState(() {}); + }, + ), + ), + ], + child: Container( + width: double.infinity, + padding: EdgeInsets.fromLTRB(12, 12, 12, 12), + decoration: BoxDecoration( + color: Colors.white, + borderRadius: BorderRadius.circular(20), + border: Border.all(color: ColorConsts.greyE0Color, width: 1), + ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + Row( mainAxisSize: MainAxisSize.min, children: [ - Row( - mainAxisSize: MainAxisSize.min, - children: [ - (_bookMarkList[index].surahNameAR + ":").toText(12, color: ColorConsts.primaryBlue), - Text( - " ${_bookMarkList[index].numberInSurah}", - style: TextStyle(fontSize: 14, fontFamily: "BArabics", color: ColorConsts.secondaryOrange), - ), - ], - ), + (_bookMarkList[index].surahNameAR + ":").toText(12, color: ColorConsts.primaryBlue), Text( - _bookMarkList[index].reverseAyatNumber(), - textAlign: TextAlign.start, - style: TextStyle( - fontFamily: "UthmanicHafs", - fontSize: 16, - color: ColorConsts.primaryBlue, - fontWeight: FontWeight.bold, - ), + " ${_bookMarkList[index].numberInSurah}", + style: TextStyle(fontSize: 14, fontFamily: "BArabics", color: ColorConsts.secondaryOrange), ), ], ), - ).onPress(() { - Navigator.pushNamed(context, QuranScreen.routeName, arguments: _bookMarkList[index]); - }), - ); - }, + Text( + _bookMarkList[index].reverseAyatNumber(), + textAlign: TextAlign.start, + style: TextStyle( + fontFamily: "UthmanicHafs", + fontSize: 16, + color: ColorConsts.primaryBlue, + fontWeight: FontWeight.bold, + ), + ), + ], + ), + ).onPress(() { + Navigator.pushNamed(context, QuranScreen.routeName, arguments: _bookMarkList[index]); + }), + ); + }, + ); + + return SizedBox( + height: double.infinity, + child: isPortrait + ? SingleChildScrollView( + child: Column( + children: [_header, _dataListView], ), - ], + ) + : Row( + children: [ + Expanded(child: _header, flex: 4), + Expanded(child: _dataListView, flex: 6), + ], + ), ); } } diff --git a/lib/ui/screens/change_password_screen.dart b/lib/ui/screens/change_password_screen.dart index 129bd84..854f402 100644 --- a/lib/ui/screens/change_password_screen.dart +++ b/lib/ui/screens/change_password_screen.dart @@ -65,6 +65,47 @@ class _ChangePasswordScreenState extends State { @override Widget build(BuildContext context) { + bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait; + + List _actionsList = [ + "تغيير كلمة المرور".toText(20), + 24.height, + LoginTextFieldWidget(hint: "كلمة المرور الحالية", controller: _currentPasswordController, iconData: Icons.lock_rounded, isPassword: true, isForChangePassword: true), + 10.height, + LoginTextFieldWidget(hint: "كلمة المرور الجديدة", controller: _passwordController, iconData: Icons.lock_rounded, isForChangePassword: true), + 10.height, + LoginTextFieldWidget(hint: "تأكيد كلمة المرور الجديدة", controller: _confirmPasswordController, iconData: Icons.lock_rounded, isPassword: true, isForChangePassword: true), + 16.height, + Container( + height: 45, + // width: 165, + alignment: Alignment.center, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(32), + border: Border.all(color: ColorConsts.brownLightColor, width: 2), + ), + child: "إعادة تعيين كلمة لمرور".toText(13), + ).onPress(() { + if (_currentPasswordController.text.length < 1) { + Utils.showToast("يرجى إاخال كلمة المرور"); + return; + } + if (_passwordController.text.length < 1) { + Utils.showToast("يرجى إاخال كلمة المرور"); + return; + } + if (_confirmPasswordController.text.length < 1) { + Utils.showToast("يرجى تأكيد كلمة المرور"); + return; + } + if (_passwordController.text != _confirmPasswordController.text) { + Utils.showToast("خطأ في تطابق كلمات المرور"); + return; + } + updatePassword(AppState().userEmail, _currentPasswordController.text, _passwordController.text); + }), + ]; + return SizedBox( width: double.infinity, child: Stack( @@ -73,69 +114,57 @@ class _ChangePasswordScreenState extends State { Image.asset( "assets/icons/new/home_dark.jpg", fit: BoxFit.cover, - height: double.infinity, + height: isPortrait ? double.infinity : null, + width: isPortrait ? null : double.infinity, opacity: const AlwaysStoppedAnimation(1), ), Container(color: ColorConsts.darkText.withOpacity(0.8)), - Column( - mainAxisSize: MainAxisSize.min, - children: [ - 100.height, - Image.asset('assets/icons/new/Tangeem-logo-W.png', width: 50), - 100.height, - Container( - width: 54, - height: 54, - decoration: BoxDecoration( - shape: BoxShape.circle, - color: ColorConsts.dark2Text, - ), - child: SvgPicture.asset( - "assets/icons/new/user_acount.svg", - color: Colors.white, - ), - ), - 14.height, - (AppState().userName ?? "").toText(18), - 50.height, - "تغيير كلمة المرور".toText(20), - 24.height, - LoginTextFieldWidget(hint: "كلمة المرور الحالية", controller: _currentPasswordController, iconData: Icons.lock_rounded, isPassword: true, isForChangePassword: true), - 10.height, - LoginTextFieldWidget(hint: "كلمة المرور الجديدة", controller: _passwordController, iconData: Icons.lock_rounded, isForChangePassword: true), - 10.height, - LoginTextFieldWidget(hint: "تأكيد كلمة المرور الجديدة", controller: _confirmPasswordController, iconData: Icons.lock_rounded, isPassword: true, isForChangePassword: true), - 16.height, - Container( - height: 45, - // width: 165, - alignment: Alignment.center, - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(32), - border: Border.all(color: ColorConsts.brownLightColor, width: 2), - ), - child: "إعادة تعيين كلمة لمرور".toText(13), - ).onPress(() { - if (_currentPasswordController.text.length < 1) { - Utils.showToast("يرجى إاخال كلمة المرور"); - return; - } - if (_passwordController.text.length < 1) { - Utils.showToast("يرجى إاخال كلمة المرور"); - return; - } - if (_confirmPasswordController.text.length < 1) { - Utils.showToast("يرجى تأكيد كلمة المرور"); - return; - } - if (_passwordController.text != _confirmPasswordController.text) { - Utils.showToast("خطأ في تطابق كلمات المرور"); - return; - } - updatePassword(AppState().userEmail, _currentPasswordController.text, _passwordController.text); - }) - ], - ).paddingOnly(left: 65, right: 65), + isPortrait + ? Column( + mainAxisSize: MainAxisSize.min, + children: [ + 100.height, + Image.asset('assets/icons/new/Tangeem-logo-W.png', width: 50), + 100.height, + Container( + width: 54, + height: 54, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: ColorConsts.dark2Text, + ), + child: SvgPicture.asset( + "assets/icons/new/user_acount.svg", + color: Colors.white, + ), + ), + 14.height, + (AppState().userName ?? "").toText(18), + 50.height, + ..._actionsList, + ], + ).paddingOnly(left: 65, right: 65) + : Row( + children: [ + Column( + mainAxisSize: MainAxisSize.min, + children: [ + Container( + width: 78, + height: 78, + decoration: BoxDecoration(shape: BoxShape.circle, color: ColorConsts.dark2Text), + child: SvgPicture.asset( + "assets/icons/new/user_acount.svg", + color: Colors.white, + ), + ), + 14.height, + (AppState().userName ?? "").toText(25), + ], + ).expanded, + Column(mainAxisAlignment: MainAxisAlignment.center, children: _actionsList).expanded + ], + ).paddingOnly(right: 65, left: 65), ], ), ); diff --git a/lib/ui/screens/member_screen.dart b/lib/ui/screens/member_screen.dart index a41b260..845cd04 100644 --- a/lib/ui/screens/member_screen.dart +++ b/lib/ui/screens/member_screen.dart @@ -55,7 +55,7 @@ class _MemberScreenState extends State { bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait; Widget _header = SizedBox(height: isPortrait ? null : double.infinity, width: double.infinity, child: CommonHeader("اللجنة الإشرافية", "assets/icons/new/commette_bg.jpg", Color(0xff416A6C))); - Widget _dataListView = membersList.isEmpty + Widget _dataListView = membersList?.isEmpty ?? true ? NoDataUI() : ListView.separated( physics: const NeverScrollableScrollPhysics(), diff --git a/lib/ui/screens/user_profile_screen.dart b/lib/ui/screens/user_profile_screen.dart index 1d2f228..cbc5053 100644 --- a/lib/ui/screens/user_profile_screen.dart +++ b/lib/ui/screens/user_profile_screen.dart @@ -55,6 +55,38 @@ class _UserProfileScreenState extends State { @override Widget build(BuildContext context) { + bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait; + + List _actionsList = [ + button("تغيير كلمة المرور", isPortrait).onPress(() { + Navigator.pushNamed(context, ChangePasswordScreen.routeName); + }), + Container(width: 50, height: 1, color: ColorConsts.dark99Text).paddingOnly(top: 15, bottom: 15), + button("تسجيل الخروج", isPortrait).onPress(() async { + SharedPreferences prefs = await SharedPreferences.getInstance(); + await prefs.remove(GlobalConsts.userAuthData); + AppState().setAuthenticationModel(null); + Utils.showToast("تسجيل خروج المستخدم"); + Navigator.pop(context); + }), + Container(width: 50, height: 1, color: ColorConsts.dark99Text).paddingOnly(top: 15, bottom: 15), + button("حذف الحساب", isPortrait).onPress(() { + showDialog( + context: context, + barrierColor: Colors.white.withOpacity(0.2), + builder: (BuildContext context) => GeneralDialog( + message: "هل تود حذف حسابك عبر تطبيق تنغيم؟", + backgroundColor: Color(0xff598A8D), + buttonTitle: "تأكيد الحذف", + buttonBorderColor: ColorConsts.brownLightColor, + onTap: () { + Navigator.pop(context); + deleteUserAccount(); + }, + ), + ); + }), + ]; return SizedBox( width: double.infinity, child: Stack( @@ -63,70 +95,68 @@ class _UserProfileScreenState extends State { Image.asset( "assets/icons/new/home_dark.jpg", fit: BoxFit.cover, - height: double.infinity, + height: isPortrait ? double.infinity : null, + width: isPortrait ? null : double.infinity, opacity: const AlwaysStoppedAnimation(1), ), Container(color: ColorConsts.darkText.withOpacity(0.8)), - Column( - mainAxisSize: MainAxisSize.min, - children: [ - 100.height, - Image.asset('assets/icons/new/Tangeem-logo-W.png', width: 50), - 100.height, - Container( - width: 78, - height: 78, - decoration: BoxDecoration( - shape: BoxShape.circle, - color: ColorConsts.dark2Text, - ), - child: SvgPicture.asset( - "assets/icons/new/user_acount.svg", - color: Colors.white, - ), - ), - 14.height, - (AppState().userName ?? "").toText(25), - 50.height, - button("تغيير كلمة المرور").onPress(() { - Navigator.pushNamed(context, ChangePasswordScreen.routeName); - }), - Container(width: 50, height: 1, color: ColorConsts.dark99Text).paddingOnly(top: 15, bottom: 15), - button("تسجيل الخروج").onPress(() async { - SharedPreferences prefs = await SharedPreferences.getInstance(); - await prefs.remove(GlobalConsts.userAuthData); - AppState().setAuthenticationModel(null); - Utils.showToast("تسجيل خروج المستخدم"); - Navigator.pop(context); - }), - Container(width: 50, height: 1, color: ColorConsts.dark99Text).paddingOnly(top: 15, bottom: 15), - button("حذف الحساب").onPress(() { - showDialog( - context: context, - barrierColor: Colors.white.withOpacity(0.2), - builder: (BuildContext context) => GeneralDialog( - message: "هل تود حذف حسابك عبر تطبيق تنغيم؟", - backgroundColor: Color(0xff598A8D), - buttonTitle: "تأكيد الحذف", - buttonBorderColor: ColorConsts.brownLightColor, - onTap: () { - Navigator.pop(context); - deleteUserAccount(); - }, - ), - ); - }), - ], - ), + isPortrait + ? Column( + mainAxisSize: MainAxisSize.min, + children: [ + 100.height, + Image.asset('assets/icons/new/Tangeem-logo-W.png', width: 50), + 100.height, + Container( + width: 78, + height: 78, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: ColorConsts.dark2Text, + ), + child: SvgPicture.asset( + "assets/icons/new/user_acount.svg", + color: Colors.white, + ), + ), + 14.height, + (AppState().userName ?? "").toText(25), + 50.height, + ..._actionsList + ], + ) + : Row( + children: [ + Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Image.asset('assets/icons/new/Tangeem-logo-W.png', width: 75), + 30.height, + Container( + width: 78, + height: 78, + decoration: BoxDecoration(shape: BoxShape.circle, color: ColorConsts.dark2Text), + child: SvgPicture.asset( + "assets/icons/new/user_acount.svg", + color: Colors.white, + ), + ), + 24.height, + (AppState().userName ?? "").toText(25), + ], + ).expanded, + Column(mainAxisAlignment: MainAxisAlignment.center, children: _actionsList).expanded, + ], + ).paddingOnly(right: 36, left: 36), ], ), ); } - Widget button(String title) { + Widget button(String title, bool isPortrait) { return Container( height: 36, - width: 165, + width: isPortrait ? 165 : 200, alignment: Alignment.center, decoration: BoxDecoration( borderRadius: BorderRadius.circular(32),