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

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

@ -126,12 +126,13 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
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(
height: 58,
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(29.0), borderRadius: BorderRadius.circular(29.0),
color: Colors.white, color: Colors.white,
@ -140,12 +141,27 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
padding: EdgeInsets.only(left: 30, right: 30), padding: EdgeInsets.only(left: 30, right: 30),
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [for (int i = 0; i < icons.length; i++) getBottomNavigationItem(i, isPortrait ? 0 : 6)], children: [for (int i = 0; i < icons.length; i++) getBottomNavigationItem(i, 0, isPortrait)],
), ),
)
: Container(
width: 58,
margin: EdgeInsets.only(top: 50, right: 24),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(29.0),
color: Colors.white,
border: Border.all(color: ColorConsts.borderColor, width: 1),
), ),
Container( padding: EdgeInsets.only(top: 30, bottom: 30),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [for (int i = 0; i < icons.length; i++) getBottomNavigationItem(i, 0, isPortrait)],
),
).expanded,
(isPortrait
? Container(
height: 26, height: 26,
margin: EdgeInsets.only(top: isPortrait ? 16 : 8), margin: EdgeInsets.only(top: 16),
padding: EdgeInsets.only(right: 16, left: 12), padding: EdgeInsets.only(right: 16, left: 12),
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(29.0), borderRadius: BorderRadius.circular(29.0),
@ -157,8 +173,19 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
Icon(Icons.play_arrow_outlined, size: 20, color: Colors.white), Icon(Icons.play_arrow_outlined, size: 20, color: Colors.white),
"تصفح وتحميل الموسوعة".toText(13), "تصفح وتحميل الموسوعة".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,
), ),
).onPress(() { alignment: Alignment.center,
child: Icon(Icons.play_arrow_outlined, size: 20, color: Colors.white),
))
.onPress(() {
if (index != 5) if (index != 5)
setState(() { setState(() {
index = 5; index = 5;
@ -182,10 +209,8 @@ 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,
children: [
SvgPicture.asset( SvgPicture.asset(
icons[_index], icons[_index],
width: sizes[_index] - minusValue, width: sizes[_index] - minusValue,
@ -194,12 +219,23 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
).expanded, ).expanded,
if (index == _index) if (index == _index)
Container( Container(
height: 3, height: isPortrait ? 3 : sizes[_index] - minusValue,
color: ColorConsts.brownColor, color: ColorConsts.brownColor,
width: sizes[_index] - minusValue, width: isPortrait ? sizes[_index] - minusValue : 3,
), ),
], ];
).onPress(() {
Widget child = isPortrait
? 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,14 +61,9 @@ class _AboutScreenState extends State<AboutScreen> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return SizedBox( bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
height: double.infinity, Widget _header = SizedBox(height: isPortrait ? null : double.infinity, width: double.infinity, child: CommonHeader("عن الموسوعة", "assets/icons/new/about_bg.jpg", Color(0xffAE8646)));
child: SingleChildScrollView( Widget _dataView = Column(
physics: const AlwaysScrollableScrollPhysics(),
child: Column(
children: [
CommonHeader("عن الموسوعة", "assets/icons/new/about_bg.jpg", Color(0xffAE8646)),
Column(
children: [ children: [
if ((tareefAlMosasa?.length ?? 0) > 0) if ((tareefAlMosasa?.length ?? 0) > 0)
for (ContentInfoDataModel text in tareefAlMosasa) text.content.toText(13, color: ColorConsts.darkText, textAlign: TextAlign.center), for (ContentInfoDataModel text in tareefAlMosasa) text.content.toText(13, color: ColorConsts.darkText, textAlign: TextAlign.center),
@ -80,9 +75,29 @@ class _AboutScreenState extends State<AboutScreen> {
], ],
).paddingOnly(top: 24) ).paddingOnly(top: 24)
], ],
).paddingOnly(top: 70, left: 35, right: 35, bottom: 125), );
return SizedBox(
height: double.infinity,
child: isPortrait
? SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
child: Column(
children: [
_header,
_dataView.paddingOnly(top: 70, left: 35, right: 35, bottom: 125),
], ],
), ),
)
: Row(
children: [
Expanded(
child: SizedBox(
height: double.infinity,
child: SingleChildScrollView(padding: EdgeInsets.only(left: 25, right: 25, top: 45, bottom: 45), physics: const AlwaysScrollableScrollPhysics(), child: _dataView)),
flex: 6),
Expanded(child: _header, flex: 4),
],
), ),
); );
} }

@ -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,

@ -134,7 +134,10 @@ 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(
width: double.infinity,
child: Stack(
alignment: Alignment.topRight,
children: [ children: [
// Container( // Container(
// color: Colors.white, // color: Colors.white,
@ -180,15 +183,15 @@ class _CommonAppbarState extends State<CommonAppbar> {
ElevatedButton( ElevatedButton(
onPressed: () => Navigator.pop(context), onPressed: () => Navigator.pop(context),
child: Icon( child: Icon(
Icons.arrow_back_ios, Icons.arrow_forward_ios,
color: ColorConsts.darkText, color: ColorConsts.darkText,
).paddingOnly(left: 8), ).paddingOnly(left: 4),
style: ElevatedButton.styleFrom( style: ElevatedButton.styleFrom(
backgroundColor: Color(0xfff4f4f4), backgroundColor: Color(0xfff4f4f4),
shape: CircleBorder(), //<-- SEE HERE shape: CircleBorder(), //<-- SEE HERE
padding: EdgeInsets.all(8), padding: EdgeInsets.all(8),
), ),
).paddingOnly(left: 8, top: 50), ).paddingOnly(right: 8, top: 50),
// IconButton( // IconButton(
// highlightColor: Colors.green, // highlightColor: Colors.green,
// icon: Icon(Icons.arrow_back_ios, color: ColorConsts.textGrey), // icon: Icon(Icons.arrow_back_ios, color: ColorConsts.textGrey),
@ -199,6 +202,7 @@ class _CommonAppbarState extends State<CommonAppbar> {
// ), // ),
], ],
), ),
),
); );
} }

@ -52,22 +52,16 @@ 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(
children: [
CommonHeader("اللجنة الإشرافية", "assets/icons/new/commette_bg.jpg", Color(0xff416A6C)),
membersList == null
? SizedBox()
: membersList.isEmpty
? NoDataUI() ? NoDataUI()
: ListView.separated( : ListView.separated(
physics: const NeverScrollableScrollPhysics(), physics: const NeverScrollableScrollPhysics(),
shrinkWrap: true, shrinkWrap: true,
itemCount: membersList.length, itemCount: membersList.length,
padding: EdgeInsets.only(left: 25, right: 25, top: 25, bottom: 125), padding: EdgeInsets.only(left: 25, right: 25, top: 25, bottom: isPortrait ? 125 : 25),
separatorBuilder: (context, index) { separatorBuilder: (context, index) {
return Divider(color: Color(0xffC7C7C7), height: 1, thickness: 1); return Divider(color: Color(0xffC7C7C7), height: 1, thickness: 1);
}, },
@ -122,10 +116,22 @@ class _MemberScreenState extends State<MemberScreen> {
], ],
).paddingOnly(top: 25, bottom: 25); ).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,19 +159,12 @@ 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()
: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: ListView(
physics: BouncingScrollPhysics(),
padding: EdgeInsets.only(bottom: 16),
children: [
CommonHeader(_ayatTangheemTypeMappedFirstData.tangheemTypeName ?? "", "assets/icons/new/quran_bg.jpg", Color(0xffAE8646),
isCustom: true, message: _ayatTangheemTypeMappedFirstData.tangheemTypeDescription ?? "", onTap: (headerEnum) { isCustom: true, message: _ayatTangheemTypeMappedFirstData.tangheemTypeDescription ?? "", onTap: (headerEnum) {
if (headerEnum == CommonHeaderEnum.ShareAsText) { if (headerEnum == CommonHeaderEnum.ShareAsText) {
_shareAyaAsLink(); _shareAyaAsLink();
@ -195,7 +188,9 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
setState(() {}); setState(() {});
} }
}), }),
SingleChildScrollView( );
Widget _dataListView = SingleChildScrollView(
physics: NeverScrollableScrollPhysics(), physics: NeverScrollableScrollPhysics(),
child: RepaintBoundary( child: RepaintBoundary(
key: _globalKey, key: _globalKey,
@ -204,7 +199,7 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
child: ListView.builder( child: ListView.builder(
physics: NeverScrollableScrollPhysics(), physics: NeverScrollableScrollPhysics(),
shrinkWrap: true, shrinkWrap: true,
padding: EdgeInsets.all(0), padding: EdgeInsets.only(top: 24, bottom: 24),
itemCount: ayatTangheemTypeMappedDataList.length > 5 ? 5 : ayatTangheemTypeMappedDataList.length, itemCount: ayatTangheemTypeMappedDataList.length > 5 ? 5 : ayatTangheemTypeMappedDataList.length,
itemBuilder: (context, index) { itemBuilder: (context, index) {
final _ayatTangheemTypeMappedData = ayatTangheemTypeMappedDataList[index]; final _ayatTangheemTypeMappedData = ayatTangheemTypeMappedDataList[index];
@ -351,13 +346,9 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
var removedData = list[index]; var removedData = list[index];
list.remove(removedData); list.remove(removedData);
list.insert(0, removedData); list.insert(0, removedData);
list = list list = list?.where((element) => (element.ayahNos.contains(removedData.ayahNos)) && (element.tangheemTypeId == removedData.tangheemTypeId))?.toList() ?? [];
?.where((element) => (element.ayahNos.contains(removedData.ayahNos)) && (element.tangheemTypeId == removedData.tangheemTypeId))
?.toList() ??
[];
TangheemDetailParams tangheem = TangheemDetailParams tangheem = TangheemDetailParams(selectedTangheemTypeId: _dataList[index].ayaTangheemTypeId, ayatTangheemTypeMappedDataList: list);
TangheemDetailParams(selectedTangheemTypeId: _dataList[index].ayaTangheemTypeId, ayatTangheemTypeMappedDataList: list);
Navigator.pushNamed(context, TangheemDetailScreen.routeName, arguments: tangheem); Navigator.pushNamed(context, TangheemDetailScreen.routeName, arguments: tangheem);
}, },
child: Container( child: Container(
@ -389,8 +380,7 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
); );
Widget aboveInnerBelowMerge = Container( Widget aboveInnerBelowMerge = Container(
decoration: BoxDecoration( decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.circular(20), boxShadow: [BoxShadow(color: ColorConsts.greyE0Color, offset: Offset(0.0, 1.0), blurRadius: 0)]
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), // border: Border.all(color: ColorConsts.greyE0Color, width: 1),
), ),
child: Column( child: Column(
@ -404,8 +394,8 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
padding: EdgeInsets.only(top: 21, bottom: 21, left: 24, right: 24), padding: EdgeInsets.only(top: 21, bottom: 21, left: 24, right: 24),
children: [ children: [
" جملة ${_ayatTangheemTypeMappedData.tangheemTypeName} $_tempTangheemIndexWord".toText(22, color: ColorConsts.darkText, textAlign: TextAlign.center, height: 22), " جملة ${_ayatTangheemTypeMappedData.tangheemTypeName} $_tempTangheemIndexWord".toText(22, color: ColorConsts.darkText, textAlign: TextAlign.center, height: 22),
12.height,
12.height,Row( Row(
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
@ -451,9 +441,8 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
), ),
), ),
), ),
), );
// if (MediaQuery.of(context).orientation == Orientation.portrait) Widget _ayaPlayer = AyaPlayerWidget(
AyaPlayerWidget(
surahName: _ayatTangheemTypeMappedFirstData?.surahNameAr ?? "", surahName: _ayatTangheemTypeMappedFirstData?.surahNameAr ?? "",
ayaTangheemTypeId: _ayatTangheemTypeMappedFirstData?.tangheemTypeId ?? "", ayaTangheemTypeId: _ayatTangheemTypeMappedFirstData?.tangheemTypeId ?? "",
globalKey: _globalKey, globalKey: _globalKey,
@ -461,53 +450,43 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
ayaNo: _ayatTangheemTypeMappedFirstData?.ayahNo, ayaNo: _ayatTangheemTypeMappedFirstData?.ayahNo,
surahNo: _ayatTangheemTypeMappedFirstData?.surahNo, surahNo: _ayatTangheemTypeMappedFirstData?.surahNo,
voiceNoteList: voiceNoteList) voiceNoteList: voiceNoteList)
.paddingOnly(left: 24, right: 24), .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), SizedBox(height: 16),
AyaRecordWidget().paddingOnly(left: 24, right: 24), AyaRecordWidget().paddingOnly(left: 24, right: 24),
SizedBox(height: 16), SizedBox(height: 16),
discussionView(_discussionModel?.data ?? []).paddingOnly(left: 24, right: 24), discussionView(_discussionModel?.data ?? []).paddingOnly(left: 24, right: 24),
SizedBox(height: 16), SizedBox(height: 16),
], ],
), )
), : Row(
if (false)
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Container( Expanded(child: _header, flex: 4),
height: 24, Expanded(
margin: EdgeInsets.only(bottom: 8, top: 8), child: ListView(
// color: Colors.transparent, children: [
child: TextButton( _dataListView,
onPressed: () { _ayaPlayer,
setState(() { SizedBox(height: 16),
showAyaPlayer = !showAyaPlayer; AyaRecordWidget().paddingOnly(left: 24, right: 24),
}); SizedBox(height: 16),
}, discussionView(_discussionModel?.data ?? []).paddingOnly(left: 24, right: 24),
child: Text( SizedBox(height: 16),
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),
], ],
) ),
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,21 +111,17 @@ 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,
//physics: BouncingScrollPhysics(),
children: [
Stack(
alignment: Alignment.center, alignment: Alignment.center,
children: [ children: [
SizedBox( SizedBox(
// height: double.infinity, height: isPortrait ? null : double.infinity,
width: double.infinity, width: double.infinity,
child: AspectRatio( child: AspectRatio(
aspectRatio: 375 / 215, aspectRatio: 375 / 215,
child: Image.asset("assets/icons/new/quran_bg.jpg", fit: BoxFit.cover, alignment: Alignment(-0.3, 0.5)), child: Image.asset("assets/icons/new/quran_bg.jpg", fit: BoxFit.cover, alignment: Alignment(isPortrait ? -0.3 : -0.45, 0.5)),
), ),
), ),
Column( Column(
@ -138,15 +135,16 @@ class _TangheemScreenState extends State<TangheemScreen> {
], ],
).paddingOnly(top: 16), ).paddingOnly(top: 16),
], ],
), );
_dataList.isEmpty
Widget _dataListView = _dataList?.isEmpty ?? true
? NoDataUI().paddingOnly(top: 215) ? NoDataUI().paddingOnly(top: 215)
: ListView.separated( : ListView.separated(
// controller: _controller, // controller: _controller,
// physics: BouncingScrollPhysics(), // physics: BouncingScrollPhysics(),
physics: NeverScrollableScrollPhysics(), physics: isPortrait ? NeverScrollableScrollPhysics() : null,
shrinkWrap: true, shrinkWrap: isPortrait,
padding: EdgeInsets.only(left: 24, right: 24, top: 24, bottom: 24), padding: EdgeInsets.only(left: 24, right: 24, top: isPortrait ? 24 : 36, bottom: isPortrait ? 24 : 36),
itemCount: _dataList.length, itemCount: _dataList.length,
separatorBuilder: (context, index) { separatorBuilder: (context, index) {
return SizedBox(height: 12); return SizedBox(height: 12);
@ -170,26 +168,40 @@ class _TangheemScreenState extends State<TangheemScreen> {
borderRadius: BorderRadius.circular(4), borderRadius: BorderRadius.circular(4),
child: Container( child: Container(
padding: EdgeInsets.fromLTRB(12, 12, 12, 12), padding: EdgeInsets.fromLTRB(12, 12, 12, 12),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.white, color: ColorConsts.brownLightECColor,
borderRadius: BorderRadius.circular(20), borderRadius: BorderRadius.circular(20),
border: Border.all(color: ColorConsts.greyE0Color, width: 1), border: Border.all(color: ColorConsts.brownB7Color, width: 0.35),
), ),
// decoration: BoxDecoration(
// color: Colors.white,
// borderRadius: BorderRadius.circular(20),
// border: Border.all(color: ColorConsts.greyE0Color, width: 1),
// ),
child: Column( child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [
Row(
// mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [ children: [
Row( Row(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
(_dataList[index].surahNameAr + ":").toText(12, color: ColorConsts.primaryBlue), SvgPicture.asset("assets/icons/new/surah_right.svg", height: 13, width: 11, color: ColorConsts.brownB7Color),
6.width,
(_dataList[index].surahNameAr + ":").toText(12, color: ColorConsts.brownB7Color),
6.width,
SvgPicture.asset("assets/icons/new/surah_left.svg", height: 13, width: 11, color: ColorConsts.brownB7Color),
],
),
Text( Text(
" ${_dataList[index].ayatNumberInSurahs}", "الآية ${_dataList[index].ayatNumberInSurahs}",
style: TextStyle(fontSize: 14, fontFamily: "BArabics", color: ColorConsts.secondaryOrange), style: TextStyle(fontSize: 12, color: ColorConsts.brownB7Color),
), ),
4.width,
"(${_dataList[index].tangheemTypeName})".toText(12, color: ColorConsts.secondaryOrange),
], ],
), ),
TextHighLightLengthWidget( TextHighLightLengthWidget(
@ -197,6 +209,7 @@ class _TangheemScreenState extends State<TangheemScreen> {
startIndex: _dataList[index].startIndex, startIndex: _dataList[index].startIndex,
endIndex: _dataList[index].endIndex, endIndex: _dataList[index].endIndex,
textAlign: TextAlign.start, textAlign: TextAlign.start,
highLightColor: ColorConsts.brownB7Color,
highlightAya: _dataList[index].highlightText, highlightAya: _dataList[index].highlightText,
highlightAyaNos: _dataList[index].highlightAyaNos ?? "", highlightAyaNos: _dataList[index].highlightAyaNos ?? "",
ayahTextList: _dataList[index].ayahTextList, ayahTextList: _dataList[index].ayahTextList,
@ -218,7 +231,20 @@ class _TangheemScreenState extends State<TangheemScreen> {
), ),
); );
}, },
), );
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