landscape screen added, about, home, member, tangheem & tangheem detail

development-design-2.0
Sikander Saleem 3 years ago
parent ca1639fdd9
commit 2083f496b9

@ -124,49 +124,76 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
child: Stack( child: Stack(
children: [ children: [
screens[index], screens[index],
if(MediaQuery.of(context).viewInsets.bottom == 0) if (MediaQuery.of(context).viewInsets.bottom == 0)
Align( Align(
alignment: Alignment.bottomCenter, alignment: isPortrait ? Alignment.bottomCenter : Alignment.centerRight,
child: Column( child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
Container( isPortrait
height: isPortrait ? 58 : 42, ? Container(
decoration: BoxDecoration( height: 58,
borderRadius: BorderRadius.circular(29.0), decoration: BoxDecoration(
color: Colors.white, borderRadius: BorderRadius.circular(29.0),
border: Border.all(color: ColorConsts.borderColor, width: 1), color: Colors.white,
), border: Border.all(color: ColorConsts.borderColor, width: 1),
padding: EdgeInsets.only(left: 30, right: 30), ),
child: Row( padding: EdgeInsets.only(left: 30, right: 30),
mainAxisAlignment: MainAxisAlignment.spaceBetween, child: Row(
children: [for (int i = 0; i < icons.length; i++) getBottomNavigationItem(i, isPortrait ? 0 : 6)], mainAxisAlignment: MainAxisAlignment.spaceBetween,
), children: [for (int i = 0; i < icons.length; i++) getBottomNavigationItem(i, 0, isPortrait)],
), ),
Container( )
height: 26, : Container(
margin: EdgeInsets.only(top: isPortrait ? 16 : 8), width: 58,
padding: EdgeInsets.only(right: 16, left: 12), margin: EdgeInsets.only(top: 50, right: 24),
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(29.0), borderRadius: BorderRadius.circular(29.0),
color: ColorConsts.brownLightColor, color: Colors.white,
), border: Border.all(color: ColorConsts.borderColor, width: 1),
child: Row( ),
mainAxisAlignment: MainAxisAlignment.spaceBetween, padding: EdgeInsets.only(top: 30, bottom: 30),
children: [ child: Column(
Icon(Icons.play_arrow_outlined, size: 20, color: Colors.white), mainAxisAlignment: MainAxisAlignment.spaceBetween,
"تصفح وتحميل الموسوعة".toText(13), children: [for (int i = 0; i < icons.length; i++) getBottomNavigationItem(i, 0, isPortrait)],
], ),
), ).expanded,
).onPress(() { (isPortrait
if (index != 5) ? Container(
setState(() { height: 26,
index = 5; margin: EdgeInsets.only(top: 16),
}); padding: EdgeInsets.only(right: 16, left: 12),
}), decoration: BoxDecoration(
], borderRadius: BorderRadius.circular(29.0),
).paddingOnly(left: 16, right: 16, bottom: 16), color: ColorConsts.brownLightColor,
), ),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Icon(Icons.play_arrow_outlined, size: 20, color: Colors.white),
"تصفح وتحميل الموسوعة".toText(13),
],
))
: Container(
width: 58,
margin: EdgeInsets.only(top: 6, right: 30),
padding: isPortrait ? EdgeInsets.only(right: 16, left: 12) : EdgeInsets.only(top: 4, bottom: 4),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(29.0),
color: ColorConsts.brownLightColor,
),
alignment: Alignment.center,
child: Icon(Icons.play_arrow_outlined, size: 20, color: Colors.white),
))
.onPress(() {
if (index != 5)
setState(() {
index = 5;
});
}),
],
).paddingOnly(left: 16, right: 16, bottom: 16),
),
], ],
), ),
), ),
@ -182,24 +209,33 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
]; ];
List<double> sizes = [26, 26, 36, 26, 26]; List<double> sizes = [26, 26, 36, 26, 26];
Widget getBottomNavigationItem(int _index, int minusValue) { Widget getBottomNavigationItem(int _index, int minusValue, bool isPortrait) {
return Column( List<Widget> list = [
mainAxisSize: MainAxisSize.min, SvgPicture.asset(
children: [ icons[_index],
SvgPicture.asset( width: sizes[_index] - minusValue,
icons[_index], height: sizes[_index] - minusValue,
width: sizes[_index] - minusValue, color: index == _index ? ColorConsts.brownColor : ColorConsts.darkText,
height: sizes[_index] - minusValue, ).expanded,
color: index == _index ? ColorConsts.brownColor : ColorConsts.darkText, if (index == _index)
).expanded, Container(
if (index == _index) height: isPortrait ? 3 : sizes[_index] - minusValue,
Container( color: ColorConsts.brownColor,
height: 3, width: isPortrait ? sizes[_index] - minusValue : 3,
color: ColorConsts.brownColor, ),
width: sizes[_index] - minusValue, ];
),
], Widget child = isPortrait
).onPress(() { ? Column(
mainAxisSize: MainAxisSize.min,
children: list,
)
: Row(
mainAxisSize: MainAxisSize.min,
children: list,
);
return child.onPress(() {
if (_index == 3) { if (_index == 3) {
showMenu(); showMenu();
return; return;

@ -61,29 +61,44 @@ class _AboutScreenState extends State<AboutScreen> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
Widget _header = SizedBox(height: isPortrait ? null : double.infinity, width: double.infinity, child: CommonHeader("عن الموسوعة", "assets/icons/new/about_bg.jpg", Color(0xffAE8646)));
Widget _dataView = Column(
children: [
if ((tareefAlMosasa?.length ?? 0) > 0)
for (ContentInfoDataModel text in tareefAlMosasa) text.content.toText(13, color: ColorConsts.darkText, textAlign: TextAlign.center),
if ((haqooqAlMosasa?.length ?? 0) > 0)
Column(
children: [
"حقوق الموسوعة".toText(13, color: ColorConsts.greyLightColor),
for (ContentInfoDataModel text in haqooqAlMosasa) text.content.toText(13, color: ColorConsts.greyLightColor, textAlign: TextAlign.center)
],
).paddingOnly(top: 24)
],
);
return SizedBox( return SizedBox(
height: double.infinity, height: double.infinity,
child: SingleChildScrollView( child: isPortrait
physics: const AlwaysScrollableScrollPhysics(), ? SingleChildScrollView(
child: Column( physics: const AlwaysScrollableScrollPhysics(),
children: [ child: Column(
CommonHeader("عن الموسوعة", "assets/icons/new/about_bg.jpg", Color(0xffAE8646)), children: [
Column( _header,
_dataView.paddingOnly(top: 70, left: 35, right: 35, bottom: 125),
],
),
)
: Row(
children: [ children: [
if ((tareefAlMosasa?.length ?? 0) > 0) Expanded(
for (ContentInfoDataModel text in tareefAlMosasa) text.content.toText(13, color: ColorConsts.darkText, textAlign: TextAlign.center), child: SizedBox(
if ((haqooqAlMosasa?.length ?? 0) > 0) height: double.infinity,
Column( child: SingleChildScrollView(padding: EdgeInsets.only(left: 25, right: 25, top: 45, bottom: 45), physics: const AlwaysScrollableScrollPhysics(), child: _dataView)),
children: [ flex: 6),
"حقوق الموسوعة".toText(13, color: ColorConsts.greyLightColor), Expanded(child: _header, flex: 4),
for (ContentInfoDataModel text in haqooqAlMosasa) text.content.toText(13, color: ColorConsts.greyLightColor, textAlign: TextAlign.center)
],
).paddingOnly(top: 24)
], ],
).paddingOnly(top: 70, left: 35, right: 35, bottom: 125), ),
],
),
),
); );
} }
} }

@ -211,7 +211,7 @@ class _HomeScreenState extends State<HomeScreen> {
opacity: const AlwaysStoppedAnimation(.73), opacity: const AlwaysStoppedAnimation(.73),
), ),
SingleChildScrollView( SingleChildScrollView(
padding: EdgeInsets.fromLTRB(45, isPortrait ? 138 : 45, 45, 138), padding: isPortrait ? EdgeInsets.fromLTRB(45, 138, 45, 138) : EdgeInsets.fromLTRB(200, 45, 200, 45),
physics: BouncingScrollPhysics(), physics: BouncingScrollPhysics(),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,
@ -297,14 +297,14 @@ class _HomeScreenState extends State<HomeScreen> {
child: TextField( child: TextField(
controller: _searchController, controller: _searchController,
focusNode: _searchFocusNode, focusNode: _searchFocusNode,
style: TextStyle(color: Colors.white, fontSize: 14,fontFamily: "Montserrat"), style: TextStyle(color: Colors.white, fontSize: 14, fontFamily: "Montserrat"),
textAlign: TextAlign.end, textAlign: TextAlign.end,
decoration: InputDecoration( decoration: InputDecoration(
contentPadding: EdgeInsets.fromLTRB(2, 2, 24, 2), contentPadding: EdgeInsets.fromLTRB(2, 2, 24, 2),
alignLabelWithHint: true, alignLabelWithHint: true,
fillColor: ColorConsts.darkText.withOpacity(.65), fillColor: ColorConsts.darkText.withOpacity(.65),
filled: true, filled: true,
hintStyle: TextStyle(color: Colors.white, fontSize: 14,fontFamily: "Montserrat"), hintStyle: TextStyle(color: Colors.white, fontSize: 14, fontFamily: "Montserrat"),
hintText: "البحث عن آية", hintText: "البحث عن آية",
prefixIconConstraints: BoxConstraints(maxHeight: 20), prefixIconConstraints: BoxConstraints(maxHeight: 20),
prefixIcon: InkWell( prefixIcon: InkWell(
@ -343,17 +343,17 @@ class _HomeScreenState extends State<HomeScreen> {
30.height, 30.height,
"شارك هذه الصفحة".toText(13, color: Color(0xffa2a2a2)), "شارك هذه الصفحة".toText(13, color: Color(0xffa2a2a2)),
30.height, 30.height,
if(quickLinks!=null && quickLinks.isNotEmpty) if (quickLinks != null && quickLinks.isNotEmpty)
Row( Row(
children: [ children: [
for (QuickLinksData _quickLink in quickLinks) for (QuickLinksData _quickLink in quickLinks)
commonIconButton(ApiConsts.baseUrl + _quickLink.exposeFilePath, () { commonIconButton(ApiConsts.baseUrl + _quickLink.exposeFilePath, () {
//for live production server //for live production server
// commonIconButton( _quickLink.exposeFilePath, () { // commonIconButton( _quickLink.exposeFilePath, () {
_launchURL(_quickLink.imageUrl); _launchURL(_quickLink.imageUrl);
}, size: 35, isAsset: false), }, size: 35, isAsset: false),
], ],
), ),
], ],
), ),
), ),

@ -134,70 +134,74 @@ class _CommonAppbarState extends State<CommonAppbar> {
// resizeToAvoidBottomInset: true, // resizeToAvoidBottomInset: true,
// drawerScrimColor: Colors.black.withOpacity(.3), // drawerScrimColor: Colors.black.withOpacity(.3),
backgroundColor: ColorConsts.greyF4Color, backgroundColor: ColorConsts.greyF4Color,
body: Stack( body: SizedBox(
children: [ width: double.infinity,
// Container( child: Stack(
// color: Colors.white, alignment: Alignment.topRight,
// height: 100, children: [
// padding: EdgeInsets.only(top: 8, bottom: 8, right: 16), // Container(
// child: Row( // color: Colors.white,
// crossAxisAlignment: CrossAxisAlignment.center, // height: 100,
// children: [ // padding: EdgeInsets.only(top: 8, bottom: 8, right: 16),
// if (!widget.isFirst) // child: Row(
// IconButton( // crossAxisAlignment: CrossAxisAlignment.center,
// icon: Icon(widget.showDrawer ? Icons.menu : Icons.arrow_back_ios, color: ColorConsts.textGrey), // children: [
// padding: EdgeInsets.only(left: 16), // if (!widget.isFirst)
// onPressed: () { // IconButton(
// if (widget.showDrawer) { // icon: Icon(widget.showDrawer ? Icons.menu : Icons.arrow_back_ios, color: ColorConsts.textGrey),
// _scaffoldKey.currentState.openDrawer(); // padding: EdgeInsets.only(left: 16),
// } else { // onPressed: () {
// Navigator.pop(context); // if (widget.showDrawer) {
// } // _scaffoldKey.currentState.openDrawer();
// }, // } else {
// ), // Navigator.pop(context);
// if (!widget.showDrawer) // }
// IconButton( // },
// icon: Icon(Icons.home, color: ColorConsts.textGrey), // ),
// padding: EdgeInsets.only(left: 16), // if (!widget.showDrawer)
// onPressed: () { // IconButton(
// Navigator.popUntil(context, ModalRoute.withName(HomeScreen.routeName)); // icon: Icon(Icons.home, color: ColorConsts.textGrey),
// }, // padding: EdgeInsets.only(left: 16),
// ), // onPressed: () {
// Expanded(child: SizedBox()), // Navigator.popUntil(context, ModalRoute.withName(HomeScreen.routeName));
// Hero( // },
// tag: "logo", // ),
// child: SvgPicture.asset( // Expanded(child: SizedBox()),
// "assets/logos/tangheem_logo.svg", // Hero(
// height: 100, // tag: "logo",
// width: 100, // child: SvgPicture.asset(
// alignment: Alignment.centerRight, // "assets/logos/tangheem_logo.svg",
// ), // height: 100,
// ) // width: 100,
// ], // alignment: Alignment.centerRight,
// ), // ),
// ), // )
Directionality(textDirection: TextDirection.rtl, child: widget.child), // ],
ElevatedButton( // ),
onPressed: () => Navigator.pop(context), // ),
child: Icon( Directionality(textDirection: TextDirection.rtl, child: widget.child),
Icons.arrow_back_ios, ElevatedButton(
color: ColorConsts.darkText, onPressed: () => Navigator.pop(context),
).paddingOnly(left: 8), child: Icon(
style: ElevatedButton.styleFrom( Icons.arrow_forward_ios,
backgroundColor: Color(0xfff4f4f4), color: ColorConsts.darkText,
shape: CircleBorder(), //<-- SEE HERE ).paddingOnly(left: 4),
padding: EdgeInsets.all(8), style: ElevatedButton.styleFrom(
), backgroundColor: Color(0xfff4f4f4),
).paddingOnly(left: 8, top: 50), shape: CircleBorder(), //<-- SEE HERE
// IconButton( padding: EdgeInsets.all(8),
// highlightColor: Colors.green, ),
// icon: Icon(Icons.arrow_back_ios, color: ColorConsts.textGrey), ).paddingOnly(right: 8, top: 50),
// padding: EdgeInsets.only(left: 16), // IconButton(
// onPressed: () { // highlightColor: Colors.green,
// Navigator.pop(context); // icon: Icon(Icons.arrow_back_ios, color: ColorConsts.textGrey),
// }, // padding: EdgeInsets.only(left: 16),
// ), // onPressed: () {
], // Navigator.pop(context);
// },
// ),
],
),
), ),
); );
} }

@ -52,80 +52,86 @@ class _MemberScreenState extends State<MemberScreen> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return SizedBox( bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
height: double.infinity,
child: SingleChildScrollView( Widget _header = SizedBox(height: isPortrait ? null : double.infinity, width: double.infinity, child: CommonHeader("اللجنة الإشرافية", "assets/icons/new/commette_bg.jpg", Color(0xff416A6C)));
physics: const AlwaysScrollableScrollPhysics(), Widget _dataListView = membersList.isEmpty
child: Column( ? NoDataUI()
children: [ : ListView.separated(
CommonHeader("اللجنة الإشرافية", "assets/icons/new/commette_bg.jpg", Color(0xff416A6C)), physics: const NeverScrollableScrollPhysics(),
membersList == null shrinkWrap: true,
? SizedBox() itemCount: membersList.length,
: membersList.isEmpty padding: EdgeInsets.only(left: 25, right: 25, top: 25, bottom: isPortrait ? 125 : 25),
? NoDataUI() separatorBuilder: (context, index) {
: ListView.separated( return Divider(color: Color(0xffC7C7C7), height: 1, thickness: 1);
physics: const NeverScrollableScrollPhysics(), },
shrinkWrap: true, itemBuilder: (context, index) {
itemCount: membersList.length, String encodedImage = membersList.elementAt(index).picture;
padding: EdgeInsets.only(left: 25, right: 25, top: 25, bottom: 125), if (encodedImage.contains("data:image/png;base64,")) {
separatorBuilder: (context, index) { encodedImage = encodedImage.replaceAll("data:image/png;base64,", "");
return Divider(color: Color(0xffC7C7C7), height: 1, thickness: 1); }
}, if (encodedImage.contains("data:image/jpeg;base64,")) {
itemBuilder: (context, index) { encodedImage = encodedImage.replaceAll("data:image/jpeg;base64,", "");
String encodedImage = membersList.elementAt(index).picture; }
if (encodedImage.contains("data:image/png;base64,")) { var temp = base64Decode(encodedImage);
encodedImage = encodedImage.replaceAll("data:image/png;base64,", "");
}
if (encodedImage.contains("data:image/jpeg;base64,")) {
encodedImage = encodedImage.replaceAll("data:image/jpeg;base64,", "");
}
var temp = base64Decode(encodedImage);
return Row( return Row(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Column( Column(
crossAxisAlignment: CrossAxisAlignment.end, crossAxisAlignment: CrossAxisAlignment.end,
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
(membersList[index].firstName + " " + membersList[index].lastName).toText(13, color: ColorConsts.darkText, textAlign: TextAlign.end), (membersList[index].firstName + " " + membersList[index].lastName).toText(13, color: ColorConsts.darkText, textAlign: TextAlign.end),
membersList[index].description.trim().toText(13, color: ColorConsts.grey9FColor, textAlign: TextAlign.end), membersList[index].description.trim().toText(13, color: ColorConsts.grey9FColor, textAlign: TextAlign.end),
], ],
).expanded, ).expanded,
21.width, 21.width,
Container( Container(
width: 82.0, width: 82.0,
height: 82.0, height: 82.0,
decoration: BoxDecoration( decoration: BoxDecoration(
image: membersList.length < 1 image: membersList.length < 1
? null ? null
: DecorationImage( : DecorationImage(
fit: BoxFit.cover, fit: BoxFit.cover,
image: MemoryImage(temp), image: MemoryImage(temp),
), ),
borderRadius: BorderRadius.all( borderRadius: BorderRadius.all(
Radius.circular(10.0), Radius.circular(10.0),
),
),
child: membersList.length < 1
? ClipRRect(
borderRadius: BorderRadius.all(
Radius.circular(10.0),
),
child: SvgPicture.asset(
"assets/icons/chat_user.svg",
clipBehavior: Clip.antiAlias,
),
)
: null,
),
],
).paddingOnly(top: 25, bottom: 25);
},
), ),
], ),
), child: membersList.length < 1
), ? ClipRRect(
borderRadius: BorderRadius.all(
Radius.circular(10.0),
),
child: SvgPicture.asset(
"assets/icons/chat_user.svg",
clipBehavior: Clip.antiAlias,
),
)
: null,
),
],
).paddingOnly(top: 25, bottom: 25);
},
);
return SizedBox(
height: double.infinity,
child: isPortrait
? SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
child: Column(
children: [_header, membersList == null ? SizedBox() : _dataListView],
),
)
: Row(
children: [
Expanded(child: SingleChildScrollView(physics: const AlwaysScrollableScrollPhysics(), child: _dataListView), flex: 6),
Expanded(child: _header, flex: 4),
],
),
); );
} }
} }

@ -159,357 +159,336 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
Widget _header = SizedBox(
height: isPortrait ? null : double.infinity,
width: double.infinity, width: double.infinity,
child: _ayatTangheemTypeMappedFirstData == null child: CommonHeader(_ayatTangheemTypeMappedFirstData.tangheemTypeName ?? "", "assets/icons/new/quran_bg.jpg", Color(0xffAE8646),
? SizedBox() isCustom: true, message: _ayatTangheemTypeMappedFirstData.tangheemTypeDescription ?? "", onTap: (headerEnum) {
: Column( if (headerEnum == CommonHeaderEnum.ShareAsText) {
crossAxisAlignment: CrossAxisAlignment.start, _shareAyaAsLink();
children: [ } else if (headerEnum == CommonHeaderEnum.ShareAsImage) {
Expanded( _shareAyaAsImage();
child: ListView( } else if (headerEnum == CommonHeaderEnum.ZoomOut) {
physics: BouncingScrollPhysics(), if (fontSize <= 12) {
padding: EdgeInsets.only(bottom: 16), Utils.showToast("وصل حجم الخط إلى الحد الأدنى للحجم");
children: [ return;
CommonHeader(_ayatTangheemTypeMappedFirstData.tangheemTypeName ?? "", "assets/icons/new/quran_bg.jpg", Color(0xffAE8646), }
isCustom: true, message: _ayatTangheemTypeMappedFirstData.tangheemTypeDescription ?? "", onTap: (headerEnum) { fontSize -= 2;
if (headerEnum == CommonHeaderEnum.ShareAsText) { prefs.setInt(GlobalConsts.fontZoomSize, fontSize);
_shareAyaAsLink(); setState(() {});
} else if (headerEnum == CommonHeaderEnum.ShareAsImage) { } else if (headerEnum == CommonHeaderEnum.ZoomIn) {
_shareAyaAsImage(); if (fontSize >= 36) {
} else if (headerEnum == CommonHeaderEnum.ZoomOut) { Utils.showToast("وصل حجم الخط إلى الحد الأقصى للحجم");
if (fontSize <= 12) { return;
Utils.showToast("وصل حجم الخط إلى الحد الأدنى للحجم"); }
return; fontSize += 2;
} prefs.setInt(GlobalConsts.fontZoomSize, fontSize);
fontSize -= 2; setState(() {});
prefs.setInt(GlobalConsts.fontZoomSize, fontSize); }
setState(() {}); }),
} else if (headerEnum == CommonHeaderEnum.ZoomIn) { );
if (fontSize >= 36) {
Utils.showToast("وصل حجم الخط إلى الحد الأقصى للحجم"); Widget _dataListView = SingleChildScrollView(
return; physics: NeverScrollableScrollPhysics(),
} child: RepaintBoundary(
fontSize += 2; key: _globalKey,
prefs.setInt(GlobalConsts.fontZoomSize, fontSize); child: Material(
setState(() {}); color: ColorConsts.greyF4Color,
} child: ListView.builder(
}), physics: NeverScrollableScrollPhysics(),
SingleChildScrollView( shrinkWrap: true,
physics: NeverScrollableScrollPhysics(), padding: EdgeInsets.only(top: 24, bottom: 24),
child: RepaintBoundary( itemCount: ayatTangheemTypeMappedDataList.length > 5 ? 5 : ayatTangheemTypeMappedDataList.length,
key: _globalKey, itemBuilder: (context, index) {
child: Material( final _ayatTangheemTypeMappedData = ayatTangheemTypeMappedDataList[index];
color: ColorConsts.greyF4Color, _ayatTangheemTypeMappedData.property?.sort((a, b) => a.orderNo.compareTo(b.orderNo));
child: ListView.builder( List<TangheemProperty> _tangheemInsideTableList = [];
physics: NeverScrollableScrollPhysics(), List<TangheemProperty> _tangheemAboveTableList = [];
shrinkWrap: true, List<TangheemProperty> _tangheemBelowTableList = [];
padding: EdgeInsets.all(0), List<String> _tangheemWords = [];
itemCount: ayatTangheemTypeMappedDataList.length > 5 ? 5 : ayatTangheemTypeMappedDataList.length,
itemBuilder: (context, index) { List<TangheemProperty> _tempPropertyList = [];
final _ayatTangheemTypeMappedData = ayatTangheemTypeMappedDataList[index]; _tempPropertyList.addAll(_ayatTangheemTypeMappedData?.property ?? <TangheemProperty>[]);
_ayatTangheemTypeMappedData.property?.sort((a, b) => a.orderNo.compareTo(b.orderNo)); int firstIndex = _tempPropertyList.indexWhere((element) => element.isInsideTable);
List<TangheemProperty> _tangheemInsideTableList = [];
List<TangheemProperty> _tangheemAboveTableList = []; if (firstIndex >= 0) {
List<TangheemProperty> _tangheemBelowTableList = []; var _tempPropertyListTop = _tempPropertyList.take(firstIndex);
List<String> _tangheemWords = []; _tempPropertyListTop = _tempPropertyListTop.where((element) => (element.propertyValue ?? "").isNotEmpty)?.toList() ?? [];
_tangheemAboveTableList = _tempPropertyListTop;
List<TangheemProperty> _tempPropertyList = []; _tempPropertyListTop.forEach((element) {
_tempPropertyList.addAll(_ayatTangheemTypeMappedData?.property ?? <TangheemProperty>[]); _tempPropertyList.remove(element);
int firstIndex = _tempPropertyList.indexWhere((element) => element.isInsideTable); });
var _tempPropertyListInside = _tempPropertyList?.where((element) => (element.isInsideTable))?.toList() ?? [];
if (firstIndex >= 0) { _tempPropertyListInside.forEach((element) {
var _tempPropertyListTop = _tempPropertyList.take(firstIndex); _tempPropertyList.remove(element);
_tempPropertyListTop = _tempPropertyListTop.where((element) => (element.propertyValue ?? "").isNotEmpty)?.toList() ?? []; });
_tangheemAboveTableList = _tempPropertyListTop; _tempPropertyListInside = _tempPropertyListInside.where((element) => (element.propertyValue ?? "").isNotEmpty)?.toList() ?? [];
_tempPropertyListTop.forEach((element) { _tangheemInsideTableList = _tempPropertyListInside;
_tempPropertyList.remove(element); var _tempPropertyListBelow = _tempPropertyList;
}); _tempPropertyListBelow = _tempPropertyListBelow.where((element) => (element.propertyValue ?? "").isNotEmpty)?.toList() ?? [];
var _tempPropertyListInside = _tempPropertyList?.where((element) => (element.isInsideTable))?.toList() ?? []; _tangheemBelowTableList = _tempPropertyListBelow;
_tempPropertyListInside.forEach((element) { }
_tempPropertyList.remove(element);
}); _tangheemWords.add(_ayatTangheemTypeMappedData.highlightText ?? "");
_tempPropertyListInside = _tempPropertyListInside.where((element) => (element.propertyValue ?? "").isNotEmpty)?.toList() ?? []; // _tangheemInsideTableList =
_tangheemInsideTableList = _tempPropertyListInside; // _ayatTangheemTypeMappedData?.property?.where((element) => (element.isInsideTable) && (element.propertyValue ?? "").isNotEmpty)?.toList() ?? [];
var _tempPropertyListBelow = _tempPropertyList; // _tangheemAboveTableList =
_tempPropertyListBelow = _tempPropertyListBelow.where((element) => (element.propertyValue ?? "").isNotEmpty)?.toList() ?? []; // _ayatTangheemTypeMappedData?.property?.where((element) => (!element.isInsideTable) && (element.propertyValue ?? "").isNotEmpty)?.toList() ?? [];
_tangheemBelowTableList = _tempPropertyListBelow; //
} //
_tangheemWords.add(_ayatTangheemTypeMappedData.highlightText ?? ""); var _tempTangheemIndexWord = "";
// _tangheemInsideTableList = if (ayatTangheemTypeMappedDataList.length == 1) {
// _ayatTangheemTypeMappedData?.property?.where((element) => (element.isInsideTable) && (element.propertyValue ?? "").isNotEmpty)?.toList() ?? []; _tempTangheemIndexWord = "";
// _tangheemAboveTableList = } else {
// _ayatTangheemTypeMappedData?.property?.where((element) => (!element.isInsideTable) && (element.propertyValue ?? "").isNotEmpty)?.toList() ?? []; _tempTangheemIndexWord = getArabicIndexWord(index) + " ";
// }
//
Widget innerTableWidget = (_tangheemInsideTableList.isNotEmpty)
var _tempTangheemIndexWord = ""; ? Column(
if (ayatTangheemTypeMappedDataList.length == 1) { children: [
_tempTangheemIndexWord = ""; Container(
} else { height: 38,
_tempTangheemIndexWord = getArabicIndexWord(index) + " "; width: double.infinity,
} alignment: Alignment.center,
decoration: BoxDecoration(
Widget innerTableWidget = (_tangheemInsideTableList.isNotEmpty) color: Color(0xff40696B),
? Column( borderRadius: BorderRadius.only(
children: [ topLeft: Radius.circular(20),
Container( topRight: Radius.circular(20),
height: 38, ),
width: double.infinity, ),
alignment: Alignment.center, child: "خط النبر و التنغيم ل${_ayatTangheemTypeMappedData.tangheemTypeName ?? ""}".toText(16),
decoration: BoxDecoration( ),
color: Color(0xff40696B), tangheemInsideTablePropertyView(_tangheemInsideTableList)
borderRadius: BorderRadius.only( ],
topLeft: Radius.circular(20), )
topRight: Radius.circular(20), : SizedBox();
),
), Widget aboveTableWidget = (_tangheemAboveTableList.isNotEmpty)
child: "خط النبر و التنغيم ل${_ayatTangheemTypeMappedData.tangheemTypeName ?? ""}".toText(16), ? Container(
), padding: EdgeInsets.only(left: 20, right: 20),
tangheemInsideTablePropertyView(_tangheemInsideTableList) decoration: BoxDecoration(
], color: Colors.white,
) // border: Border(
: SizedBox(); // left: BorderSide(color: ColorConsts.greyE0Color, width: 1),
// right: BorderSide(color: ColorConsts.greyE0Color, width: 1),
Widget aboveTableWidget = (_tangheemAboveTableList.isNotEmpty) // bottom: BorderSide(color: ColorConsts.greyE0Color, width: 1),
? Container( // top: BorderSide(color: ColorConsts.greyE0Color, width: 0),
padding: EdgeInsets.only(left: 20, right: 20), // ),
decoration: BoxDecoration(
color: Colors.white, borderRadius: BorderRadius.only(
// border: Border( topRight: Radius.circular(20),
// left: BorderSide(color: ColorConsts.greyE0Color, width: 1), topLeft: Radius.circular(20),
// right: BorderSide(color: ColorConsts.greyE0Color, width: 1), ),
// bottom: BorderSide(color: ColorConsts.greyE0Color, width: 1), ),
// top: BorderSide(color: ColorConsts.greyE0Color, width: 0), child: ListView.separated(
// ), itemCount: _tangheemAboveTableList.length,
physics: NeverScrollableScrollPhysics(),
borderRadius: BorderRadius.only( padding: EdgeInsets.zero,
topRight: Radius.circular(20), shrinkWrap: true,
topLeft: Radius.circular(20), separatorBuilder: (context, index) {
), return Divider(color: ColorConsts.greyB7Color, height: 4, thickness: 0);
), },
child: ListView.separated( itemBuilder: (context, index) {
itemCount: _tangheemAboveTableList.length, return Row(
physics: NeverScrollableScrollPhysics(), children: [
padding: EdgeInsets.zero, _tangheemAboveTableList[index].propertyText.toText(13, color: ColorConsts.greyB7Color),
shrinkWrap: true, Container(
separatorBuilder: (context, index) { width: 1,
return Divider(color: ColorConsts.greyB7Color, height: 4, thickness: 0); height: 18,
}, color: ColorConsts.greyB7Color,
itemBuilder: (context, index) { margin: EdgeInsets.only(left: 8, right: 8),
return Row( ),
children: [ Expanded(
_tangheemAboveTableList[index].propertyText.toText(13, color: ColorConsts.greyB7Color), child: Container(
Container( padding: EdgeInsets.only(left: 4, right: 8),
width: 1, // alignment: Alignment.centerRight,
height: 18, child: Html(
color: ColorConsts.greyB7Color, data: _tangheemAboveTableList[index]?.propertyValue ?? "",
margin: EdgeInsets.only(left: 8, right: 8), style: {
), 'html': Style(textAlign: TextAlign.left),
Expanded( },
child: Container(
padding: EdgeInsets.only(left: 4, right: 8),
// alignment: Alignment.centerRight,
child: Html(
data: _tangheemAboveTableList[index]?.propertyValue ?? "",
style: {
'html': Style(textAlign: TextAlign.left),
},
),
),
)
],
);
}),
)
: SizedBox();
Widget belowTableWidget = (_tangheemBelowTableList.isNotEmpty) ? tangheemOutSideTablePropertyView(_tangheemBelowTableList) : SizedBox();
Widget relatedTangheemWidget = (_dataList.isNotEmpty)
? Container(
width: double.infinity,
padding: EdgeInsets.only(top: 18, bottom: 18, left: 12, right: 12),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
// border: Border.all(color: ColorConsts.greyE0Color, width: 1),
),
child: Column(
children: [
"قائمة الأساليب اللغوية في هذه الآية".toText(13, color: ColorConsts.darkText),
12.height,
Wrap(
spacing: 8,
runSpacing: 8,
alignment: WrapAlignment.center,
children: [
for (int index = 0; index < _dataList.length; index++)
InkWell(
onTap: () {
List<AyatTangheemTypeMappedData> list = _dataList;
var removedData = list[index];
list.remove(removedData);
list.insert(0, removedData);
list = list
?.where((element) => (element.ayahNos.contains(removedData.ayahNos)) && (element.tangheemTypeId == removedData.tangheemTypeId))
?.toList() ??
[];
TangheemDetailParams tangheem =
TangheemDetailParams(selectedTangheemTypeId: _dataList[index].ayaTangheemTypeId, ayatTangheemTypeMappedDataList: list);
Navigator.pushNamed(context, TangheemDetailScreen.routeName, arguments: tangheem);
},
child: Container(
padding: EdgeInsets.only(left: 12, right: 12, top: 6, bottom: 6),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Color(0xff91C1BC),
),
child: _dataList[index].tangheemTypeName.toText(12)),
),
],
),
],
),
)
: SizedBox();
Widget aboveInnerMerge = Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(20),
), ),
), ),
child: Column( )
children: [aboveTableWidget, innerTableWidget], ],
), );
); }),
)
: SizedBox();
Widget aboveInnerBelowMerge = Container( Widget belowTableWidget = (_tangheemBelowTableList.isNotEmpty) ? tangheemOutSideTablePropertyView(_tangheemBelowTableList) : SizedBox();
decoration: BoxDecoration(
color: Colors.white, borderRadius: BorderRadius.circular(20), boxShadow: [BoxShadow(color: ColorConsts.greyE0Color, offset: Offset(0.0, 1.0), blurRadius: 0)]
// border: Border.all(color: ColorConsts.greyE0Color, width: 1),
),
child: Column(
children: [aboveInnerMerge, belowTableWidget],
),
);
return ListView( Widget relatedTangheemWidget = (_dataList.isNotEmpty)
physics: NeverScrollableScrollPhysics(), ? Container(
shrinkWrap: true, width: double.infinity,
padding: EdgeInsets.only(top: 21, bottom: 21, left: 24, right: 24), padding: EdgeInsets.only(top: 18, bottom: 18, left: 12, right: 12),
children: [ decoration: BoxDecoration(
" جملة ${_ayatTangheemTypeMappedData.tangheemTypeName} $_tempTangheemIndexWord".toText(22, color: ColorConsts.darkText, textAlign: TextAlign.center, height: 22), borderRadius: BorderRadius.circular(20),
// border: Border.all(color: ColorConsts.greyE0Color, width: 1),
12.height,Row( ),
crossAxisAlignment: CrossAxisAlignment.center, child: Column(
mainAxisSize: MainAxisSize.min, children: [
children: [ "قائمة الأساليب اللغوية في هذه الآية".toText(13, color: ColorConsts.darkText),
SvgPicture.asset("assets/icons/new/surah_right.svg", height: 13, width: 11, color: ColorConsts.darkText), 12.height,
12.width, Wrap(
_ayatTangheemTypeMappedData.surahNameAr.toText(13, color: ColorConsts.darkText, textAlign: TextAlign.center, height: 22), spacing: 8,
12.width, runSpacing: 8,
SvgPicture.asset("assets/icons/new/surah_left.svg", height: 13, width: 11, color: ColorConsts.darkText) alignment: WrapAlignment.center,
], children: [
).center, for (int index = 0; index < _dataList.length; index++)
Container( InkWell(
margin: EdgeInsets.only(top: 21, bottom: 21), onTap: () {
padding: EdgeInsets.all(12), List<AyatTangheemTypeMappedData> list = _dataList;
decoration: BoxDecoration( var removedData = list[index];
color: Colors.white, list.remove(removedData);
borderRadius: BorderRadius.circular(20), list.insert(0, removedData);
border: Border.all(color: ColorConsts.greyE0Color, width: 1), list = list?.where((element) => (element.ayahNos.contains(removedData.ayahNos)) && (element.tangheemTypeId == removedData.tangheemTypeId))?.toList() ?? [];
),
child: TextHighLightLengthWidget( TangheemDetailParams tangheem = TangheemDetailParams(selectedTangheemTypeId: _dataList[index].ayaTangheemTypeId, ayatTangheemTypeMappedDataList: list);
text: _ayatTangheemTypeMappedData.reverseAyatNumber(), Navigator.pushNamed(context, TangheemDetailScreen.routeName, arguments: tangheem);
startIndex: _ayatTangheemTypeMappedData.startIndex, },
endIndex: _ayatTangheemTypeMappedData.endIndex, child: Container(
textAlign: TextAlign.start, padding: EdgeInsets.only(left: 12, right: 12, top: 6, bottom: 6),
fontSize: fontSize.toDouble(),
highlightAya: _ayatTangheemTypeMappedData.highlightText,
highlightAyaNos: _ayatTangheemTypeMappedData.highlightAyaNos ?? "",
ayahTextList: _ayatTangheemTypeMappedData.ayahTextList,
),
),
Container(
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.transparent, borderRadius: BorderRadius.circular(10),
borderRadius: BorderRadius.circular(20), color: Color(0xff91C1BC),
border: Border.all(color: ColorConsts.greyE0Color, width: 1),
), ),
child: Column( child: _dataList[index].tangheemTypeName.toText(12)),
children: [aboveInnerBelowMerge, relatedTangheemWidget], ),
), ],
)
],
);
},
),
), ),
), ],
), ),
// if (MediaQuery.of(context).orientation == Orientation.portrait) )
AyaPlayerWidget( : SizedBox();
surahName: _ayatTangheemTypeMappedFirstData?.surahNameAr ?? "",
ayaTangheemTypeId: _ayatTangheemTypeMappedFirstData?.tangheemTypeId ?? "", Widget aboveInnerMerge = Container(
globalKey: _globalKey, decoration: BoxDecoration(
numberInSurah: _ayatTangheemTypeMappedFirstData?.ayatNumberInSurahs, color: Colors.white,
ayaNo: _ayatTangheemTypeMappedFirstData?.ayahNo, borderRadius: BorderRadius.only(
surahNo: _ayatTangheemTypeMappedFirstData?.surahNo, topLeft: Radius.circular(20),
voiceNoteList: voiceNoteList) topRight: Radius.circular(20),
.paddingOnly(left: 24, right: 24),
SizedBox(height: 16),
AyaRecordWidget().paddingOnly(left: 24, right: 24),
SizedBox(height: 16),
discussionView(_discussionModel?.data ?? []).paddingOnly(left: 24, right: 24),
SizedBox(height: 16),
],
), ),
), ),
if (false) child: Column(
Column( children: [aboveTableWidget, innerTableWidget],
),
);
Widget aboveInnerBelowMerge = Container(
decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.circular(20), boxShadow: [BoxShadow(color: ColorConsts.greyE0Color, offset: Offset(0.0, 1.0), blurRadius: 0)]
// border: Border.all(color: ColorConsts.greyE0Color, width: 1),
),
child: Column(
children: [aboveInnerMerge, belowTableWidget],
),
);
return ListView(
physics: NeverScrollableScrollPhysics(),
shrinkWrap: true,
padding: EdgeInsets.only(top: 21, bottom: 21, left: 24, right: 24),
children: [
" جملة ${_ayatTangheemTypeMappedData.tangheemTypeName} $_tempTangheemIndexWord".toText(22, color: ColorConsts.darkText, textAlign: TextAlign.center, height: 22),
12.height,
Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Container( SvgPicture.asset("assets/icons/new/surah_right.svg", height: 13, width: 11, color: ColorConsts.darkText),
height: 24, 12.width,
margin: EdgeInsets.only(bottom: 8, top: 8), _ayatTangheemTypeMappedData.surahNameAr.toText(13, color: ColorConsts.darkText, textAlign: TextAlign.center, height: 22),
// color: Colors.transparent, 12.width,
child: TextButton( SvgPicture.asset("assets/icons/new/surah_left.svg", height: 13, width: 11, color: ColorConsts.darkText)
onPressed: () {
setState(() {
showAyaPlayer = !showAyaPlayer;
});
},
child: Text(
showAyaPlayer ? "إخفاء التسجيلات" : "إظهار التسجيلات",
style: TextStyle(color: Colors.black87, fontSize: 12),
),
style: TextButton.styleFrom(
backgroundColor: ColorConsts.gradientOrange,
foregroundColor: ColorConsts.primaryBlue,
padding: EdgeInsets.only(top: 4, bottom: 4, right: 8, left: 8),
textStyle: TextStyle(color: Colors.white, fontSize: 12),
),
),
),
if (showAyaPlayer)
AyaPlayerWidget(
surahName: _ayatTangheemTypeMappedFirstData?.surahNameAr ?? "",
ayaTangheemTypeId: _ayatTangheemTypeMappedFirstData?.tangheemTypeId ?? "",
ayaNo: _ayatTangheemTypeMappedFirstData?.ayahNo,
numberInSurah: _ayatTangheemTypeMappedFirstData?.ayatNumberInSurahs,
surahNo: _ayatTangheemTypeMappedFirstData?.surahNo,
globalKey: _globalKey,
voiceNoteList: voiceNoteList),
], ],
).center,
Container(
margin: EdgeInsets.only(top: 21, bottom: 21),
padding: EdgeInsets.all(12),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(20),
border: Border.all(color: ColorConsts.greyE0Color, width: 1),
),
child: TextHighLightLengthWidget(
text: _ayatTangheemTypeMappedData.reverseAyatNumber(),
startIndex: _ayatTangheemTypeMappedData.startIndex,
endIndex: _ayatTangheemTypeMappedData.endIndex,
textAlign: TextAlign.start,
fontSize: fontSize.toDouble(),
highlightAya: _ayatTangheemTypeMappedData.highlightText,
highlightAyaNos: _ayatTangheemTypeMappedData.highlightAyaNos ?? "",
ayahTextList: _ayatTangheemTypeMappedData.ayahTextList,
),
),
Container(
decoration: BoxDecoration(
color: Colors.transparent,
borderRadius: BorderRadius.circular(20),
border: Border.all(color: ColorConsts.greyE0Color, width: 1),
),
child: Column(
children: [aboveInnerBelowMerge, relatedTangheemWidget],
),
) )
], ],
), );
},
),
),
),
);
Widget _ayaPlayer = AyaPlayerWidget(
surahName: _ayatTangheemTypeMappedFirstData?.surahNameAr ?? "",
ayaTangheemTypeId: _ayatTangheemTypeMappedFirstData?.tangheemTypeId ?? "",
globalKey: _globalKey,
numberInSurah: _ayatTangheemTypeMappedFirstData?.ayatNumberInSurahs,
ayaNo: _ayatTangheemTypeMappedFirstData?.ayahNo,
surahNo: _ayatTangheemTypeMappedFirstData?.surahNo,
voiceNoteList: voiceNoteList)
.paddingOnly(left: 24, right: 24);
return Container(
width: double.infinity,
child: _ayatTangheemTypeMappedFirstData == null
? SizedBox()
: isPortrait
? ListView(
physics: BouncingScrollPhysics(),
padding: EdgeInsets.only(bottom: 16),
children: [
_header,
_dataListView,
_ayaPlayer,
SizedBox(height: 16),
AyaRecordWidget().paddingOnly(left: 24, right: 24),
SizedBox(height: 16),
discussionView(_discussionModel?.data ?? []).paddingOnly(left: 24, right: 24),
SizedBox(height: 16),
],
)
: Row(
children: [
Expanded(child: _header, flex: 4),
Expanded(
child: ListView(
children: [
_dataListView,
_ayaPlayer,
SizedBox(height: 16),
AyaRecordWidget().paddingOnly(left: 24, right: 24),
SizedBox(height: 16),
discussionView(_discussionModel?.data ?? []).paddingOnly(left: 24, right: 24),
SizedBox(height: 16),
],
),
flex: 6),
],
),
); );
} }

@ -1,5 +1,6 @@
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:tangheem/api/tangheem_user_api_client.dart'; import 'package:tangheem/api/tangheem_user_api_client.dart';
import 'package:tangheem/classes/colors.dart'; import 'package:tangheem/classes/colors.dart';
import 'package:tangheem/classes/utils.dart'; import 'package:tangheem/classes/utils.dart';
@ -110,116 +111,141 @@ class _TangheemScreenState extends State<TangheemScreen> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return _dataList == null bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
? SizedBox()
: ListView( Widget _header = Stack(
controller: _controller, alignment: Alignment.center,
//physics: BouncingScrollPhysics(), children: [
children: [ SizedBox(
Stack( height: isPortrait ? null : double.infinity,
alignment: Alignment.center, width: double.infinity,
children: [ child: AspectRatio(
SizedBox( aspectRatio: 375 / 215,
// height: double.infinity, child: Image.asset("assets/icons/new/quran_bg.jpg", fit: BoxFit.cover, alignment: Alignment(isPortrait ? -0.3 : -0.45, 0.5)),
width: double.infinity, ),
child: AspectRatio( ),
aspectRatio: 375 / 215, Column(
child: Image.asset("assets/icons/new/quran_bg.jpg", fit: BoxFit.cover, alignment: Alignment(-0.3, 0.5)), mainAxisSize: MainAxisSize.min,
), children: [
Image.asset('assets/icons/new/Tangeem-logo-W.png', width: 50),
26.height,
(widget.tangheemTypeName ?? "").toText(30),
8.height,
"${widget.surah?.nameAR ?? ""}".toText(12, color: ColorConsts.brownB6CColor),
],
).paddingOnly(top: 16),
],
);
Widget _dataListView = _dataList?.isEmpty ?? true
? NoDataUI().paddingOnly(top: 215)
: ListView.separated(
// controller: _controller,
// physics: BouncingScrollPhysics(),
physics: isPortrait ? NeverScrollableScrollPhysics() : null,
shrinkWrap: isPortrait,
padding: EdgeInsets.only(left: 24, right: 24, top: isPortrait ? 24 : 36, bottom: isPortrait ? 24 : 36),
itemCount: _dataList.length,
separatorBuilder: (context, index) {
return SizedBox(height: 12);
},
itemBuilder: (context, index) {
return InkWell(
onTap: () {
if (widget.tangheemQuery == null) {
List<AyatTangheemTypeMappedData> list = <AyatTangheemTypeMappedData>[] + _dataList;
var removedData = _dataList[index];
list.remove(removedData);
list.insert(0, removedData);
list = list?.where((element) => (element.ayahNos.contains(removedData.ayahNos)) && (element.tangheemTypeId == removedData.tangheemTypeId))?.toList() ?? [];
TangheemDetailParams tangheem = TangheemDetailParams(selectedTangheemTypeId: removedData.ayaTangheemTypeId, ayatTangheemTypeMappedDataList: list);
Navigator.pushNamed(context, TangheemDetailScreen.routeName, arguments: tangheem);
} else {
var removedData = _dataList[index];
getTangheemDataForTangheem(removedData.surahNo, removedData.ayatNumberInSurahs, removedData.tangheemTypeId, removedData.ayaTangheemTypeId);
}
},
borderRadius: BorderRadius.circular(4),
child: Container(
padding: EdgeInsets.fromLTRB(12, 12, 12, 12),
decoration: BoxDecoration(
color: ColorConsts.brownLightECColor,
borderRadius: BorderRadius.circular(20),
border: Border.all(color: ColorConsts.brownB7Color, width: 0.35),
), ),
Column( // decoration: BoxDecoration(
// color: Colors.white,
// borderRadius: BorderRadius.circular(20),
// border: Border.all(color: ColorConsts.greyE0Color, width: 1),
// ),
child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
Image.asset('assets/icons/new/Tangeem-logo-W.png', width: 50), Row(
26.height, // mainAxisSize: MainAxisSize.min,
(widget.tangheemTypeName ?? "").toText(30), mainAxisAlignment: MainAxisAlignment.spaceBetween,
8.height, children: [
"${widget.surah?.nameAR ?? ""}".toText(12, color: ColorConsts.brownB6CColor), Row(
], mainAxisSize: MainAxisSize.min,
).paddingOnly(top: 16), children: [
], SvgPicture.asset("assets/icons/new/surah_right.svg", height: 13, width: 11, color: ColorConsts.brownB7Color),
), 6.width,
_dataList.isEmpty (_dataList[index].surahNameAr + ":").toText(12, color: ColorConsts.brownB7Color),
? NoDataUI().paddingOnly(top: 215) 6.width,
: ListView.separated( SvgPicture.asset("assets/icons/new/surah_left.svg", height: 13, width: 11, color: ColorConsts.brownB7Color),
// controller: _controller, ],
// physics: BouncingScrollPhysics(),
physics: NeverScrollableScrollPhysics(),
shrinkWrap: true,
padding: EdgeInsets.only(left: 24, right: 24, top: 24, bottom: 24),
itemCount: _dataList.length,
separatorBuilder: (context, index) {
return SizedBox(height: 12);
},
itemBuilder: (context, index) {
return InkWell(
onTap: () {
if (widget.tangheemQuery == null) {
List<AyatTangheemTypeMappedData> list = <AyatTangheemTypeMappedData>[] + _dataList;
var removedData = _dataList[index];
list.remove(removedData);
list.insert(0, removedData);
list = list?.where((element) => (element.ayahNos.contains(removedData.ayahNos)) && (element.tangheemTypeId == removedData.tangheemTypeId))?.toList() ?? [];
TangheemDetailParams tangheem = TangheemDetailParams(selectedTangheemTypeId: removedData.ayaTangheemTypeId, ayatTangheemTypeMappedDataList: list);
Navigator.pushNamed(context, TangheemDetailScreen.routeName, arguments: tangheem);
} else {
var removedData = _dataList[index];
getTangheemDataForTangheem(removedData.surahNo, removedData.ayatNumberInSurahs, removedData.tangheemTypeId, removedData.ayaTangheemTypeId);
}
},
borderRadius: BorderRadius.circular(4),
child: Container(
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(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Row(
mainAxisSize: MainAxisSize.min,
children: [
(_dataList[index].surahNameAr + ":").toText(12, color: ColorConsts.primaryBlue),
Text(
" ${_dataList[index].ayatNumberInSurahs}",
style: TextStyle(fontSize: 14, fontFamily: "BArabics", color: ColorConsts.secondaryOrange),
),
4.width,
"(${_dataList[index].tangheemTypeName})".toText(12, color: ColorConsts.secondaryOrange),
],
),
TextHighLightLengthWidget(
text: _dataList[index].reverseAyatNumber(),
startIndex: _dataList[index].startIndex,
endIndex: _dataList[index].endIndex,
textAlign: TextAlign.start,
highlightAya: _dataList[index].highlightText,
highlightAyaNos: _dataList[index].highlightAyaNos ?? "",
ayahTextList: _dataList[index].ayahTextList,
),
// TextHighLightWidget(
// text: _dataList[index].reverseAyatNumber(),
// valueColor: ColorConsts.secondaryOrange,
// highlights: [_dataList[index].highlightText],
// textAlign: TextAlign.start,
// style: TextStyle(
// fontFamily: "UthmanicHafs",
// fontSize: 16,
// color: ColorConsts.primaryBlue,
// fontWeight: FontWeight.bold,
// ),
// ),
],
),
), ),
); Text(
}, "الآية ${_dataList[index].ayatNumberInSurahs}",
), style: TextStyle(fontSize: 12, color: ColorConsts.brownB7Color),
], ),
],
),
TextHighLightLengthWidget(
text: _dataList[index].reverseAyatNumber(),
startIndex: _dataList[index].startIndex,
endIndex: _dataList[index].endIndex,
textAlign: TextAlign.start,
highLightColor: ColorConsts.brownB7Color,
highlightAya: _dataList[index].highlightText,
highlightAyaNos: _dataList[index].highlightAyaNos ?? "",
ayahTextList: _dataList[index].ayahTextList,
),
// TextHighLightWidget(
// text: _dataList[index].reverseAyatNumber(),
// valueColor: ColorConsts.secondaryOrange,
// highlights: [_dataList[index].highlightText],
// textAlign: TextAlign.start,
// style: TextStyle(
// fontFamily: "UthmanicHafs",
// fontSize: 16,
// color: ColorConsts.primaryBlue,
// fontWeight: FontWeight.bold,
// ),
// ),
],
),
),
);
},
); );
return _dataList == null
? SizedBox()
: isPortrait
? ListView(
controller: _controller,
//physics: BouncingScrollPhysics(),
children: [_header, _dataListView],
)
: Row(
children: [
Expanded(child: _header, flex: 4),
Expanded(child: _dataListView, flex: 6),
],
);
} }
} }

@ -17,11 +17,12 @@ class CommonHeader extends StatelessWidget {
final Function(CommonHeaderEnum) onTap; final Function(CommonHeaderEnum) onTap;
CommonHeader(this.title, this.assetImage, this.gradiantColor, {Key key, this.ratio, this.isCustom = false, this.message, this.onTap}) CommonHeader(this.title, this.assetImage, this.gradiantColor, {Key key, this.ratio, this.isCustom = false, this.message, this.onTap}) : assert((isCustom == true && message == null) ? false : true);
: assert((isCustom == true && message == null) ? false : true);
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
return AspectRatio( return AspectRatio(
aspectRatio: ratio ?? 469 / 313, aspectRatio: ratio ?? 469 / 313,
child: Stack( child: Stack(
@ -53,7 +54,7 @@ class CommonHeader extends StatelessWidget {
), ),
isCustom isCustom
? Column( ? Column(
mainAxisAlignment: MainAxisAlignment.end, mainAxisAlignment: isPortrait ? MainAxisAlignment.end : MainAxisAlignment.center,
children: [ children: [
title.toText(30), title.toText(30),
message.toText(16, textAlign: TextAlign.center).paddingOnly(top: 16, left: 50, right: 50), message.toText(16, textAlign: TextAlign.center).paddingOnly(top: 16, left: 50, right: 50),
@ -99,7 +100,7 @@ class CommonHeader extends StatelessWidget {
}), }),
], ],
), ),
32.height, if (isPortrait) 32.height,
], ],
) )
: Column( : Column(
@ -109,7 +110,7 @@ class CommonHeader extends StatelessWidget {
26.height, 26.height,
title.toText(30), title.toText(30),
], ],
), ).paddingOnly(right: isPortrait ? 0 : 120),
], ],
), ),
); );

Loading…
Cancel
Save