bookmark, change password, member & user profile screen added.

development-design-2.0
Sikander Saleem 3 years ago
parent a1041637d0
commit f9706254d5

@ -58,95 +58,164 @@ class _BookmarkScreenState extends State<BookmarkScreen> {
@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: <Widget>[
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: <Widget>[
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),
],
),
);
}
}

@ -65,6 +65,47 @@ class _ChangePasswordScreenState extends State<ChangePasswordScreen> {
@override
Widget build(BuildContext context) {
bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
List<Widget> _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<ChangePasswordScreen> {
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),
],
),
);

@ -55,7 +55,7 @@ class _MemberScreenState extends State<MemberScreen> {
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(),

@ -55,6 +55,38 @@ class _UserProfileScreenState extends State<UserProfileScreen> {
@override
Widget build(BuildContext context) {
bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
List<Widget> _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<UserProfileScreen> {
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),

Loading…
Cancel
Save