Haroon6138
/
tangheem
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

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

Browse Source
development-design-2.0
Sikander Saleem 3 years ago
parent ca1639fdd9
commit 2083f496b9
8 changed files with 744 additions and 677 deletions
Show Stats Download Patch File Download Diff File

66
lib/new_ui/common_home_parent.dart
Unescape Escape View File

@ -126,12 +126,13 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
screens[index],
if (MediaQuery.of(context).viewInsets.bottom == 0)
Align(
alignment: Alignment.bottomCenter,
alignment: isPortrait ? Alignment.bottomCenter : Alignment.centerRight,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Container(
height: isPortrait ? 58 : 42,
isPortrait
? Container(
height: 58,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(29.0),
color: Colors.white,
@ -140,12 +141,27 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
padding: EdgeInsets.only(left: 30, right: 30),
child: Row(
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,
margin: EdgeInsets.only(top: isPortrait ? 16 : 8),
margin: EdgeInsets.only(top: 16),
padding: EdgeInsets.only(right: 16, left: 12),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(29.0),
@ -157,8 +173,19 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
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,
),
).onPress(() {
alignment: Alignment.center,
child: Icon(Icons.play_arrow_outlined, size: 20, color: Colors.white),
))
.onPress(() {
if (index != 5)
setState(() {
index = 5;
@ -182,10 +209,8 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
];
List<double> sizes = [26, 26, 36, 26, 26];
Widget getBottomNavigationItem(int _index, int minusValue) {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
Widget getBottomNavigationItem(int _index, int minusValue, bool isPortrait) {
List<Widget> list = [
SvgPicture.asset(
icons[_index],
width: sizes[_index] - minusValue,
@ -194,12 +219,23 @@ class _CommonHomeParentState extends State<CommonHomeParent> {
).expanded,
if (index == _index)
Container(
height: 3,
height: isPortrait ? 3 : sizes[_index] - minusValue,
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) {
showMenu();
return;

33
lib/new_ui/screens/about_screen.dart
Unescape Escape View File

@ -61,14 +61,9 @@ class _AboutScreenState extends State<AboutScreen> {
@override
Widget build(BuildContext context) {
return SizedBox(
height: double.infinity,
child: SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
child: Column(
children: [
CommonHeader("عن الموسوعة", "assets/icons/new/about_bg.jpg", Color(0xffAE8646)),
Column(
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),
@ -80,9 +75,29 @@ class _AboutScreenState extends State<AboutScreen> {
],
).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),
],
),
);
}

2
lib/new_ui/screens/home_screen.dart
Unescape Escape View File

@ -211,7 +211,7 @@ class _HomeScreenState extends State<HomeScreen> {
opacity: const AlwaysStoppedAnimation(.73),
),
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(),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,

12
lib/ui/common_appbar.dart
Unescape Escape View File

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

30
lib/ui/screens/member_screen.dart
Unescape Escape View File

@ -52,22 +52,16 @@ class _MemberScreenState extends State<MemberScreen> {
@override
Widget build(BuildContext context) {
return SizedBox(
height: double.infinity,
child: SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
child: Column(
children: [
CommonHeader("اللجنة الإشرافية", "assets/icons/new/commette_bg.jpg", Color(0xff416A6C)),
membersList == null
? SizedBox()
: membersList.isEmpty
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
? NoDataUI()
: ListView.separated(
physics: const NeverScrollableScrollPhysics(),
shrinkWrap: true,
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) {
return Divider(color: Color(0xffC7C7C7), height: 1, thickness: 1);
},
@ -122,10 +116,22 @@ class _MemberScreenState extends State<MemberScreen> {
],
).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),
],
),
),
);
}
}

111
lib/ui/screens/tangheem_detail_screen.dart
Unescape Escape View File

@ -159,19 +159,12 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
@override
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,
child: _ayatTangheemTypeMappedFirstData == null
? 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),
child: CommonHeader(_ayatTangheemTypeMappedFirstData.tangheemTypeName ?? "", "assets/icons/new/quran_bg.jpg", Color(0xffAE8646),
isCustom: true, message: _ayatTangheemTypeMappedFirstData.tangheemTypeDescription ?? "", onTap: (headerEnum) {
if (headerEnum == CommonHeaderEnum.ShareAsText) {
_shareAyaAsLink();
@ -195,7 +188,9 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
setState(() {});
}
}),
SingleChildScrollView(
);
Widget _dataListView = SingleChildScrollView(
physics: NeverScrollableScrollPhysics(),
child: RepaintBoundary(
key: _globalKey,
@ -204,7 +199,7 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
child: ListView.builder(
physics: NeverScrollableScrollPhysics(),
shrinkWrap: true,
padding: EdgeInsets.all(0),
padding: EdgeInsets.only(top: 24, bottom: 24),
itemCount: ayatTangheemTypeMappedDataList.length > 5 ? 5 : ayatTangheemTypeMappedDataList.length,
itemBuilder: (context, index) {
final _ayatTangheemTypeMappedData = ayatTangheemTypeMappedDataList[index];
@ -351,13 +346,9 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
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() ??
[];
list = list?.where((element) => (element.ayahNos.contains(removedData.ayahNos)) && (element.tangheemTypeId == removedData.tangheemTypeId))?.toList() ?? [];
TangheemDetailParams tangheem =
TangheemDetailParams(selectedTangheemTypeId: _dataList[index].ayaTangheemTypeId, ayatTangheemTypeMappedDataList: list);
TangheemDetailParams tangheem = TangheemDetailParams(selectedTangheemTypeId: _dataList[index].ayaTangheemTypeId, ayatTangheemTypeMappedDataList: list);
Navigator.pushNamed(context, TangheemDetailScreen.routeName, arguments: tangheem);
},
child: Container(
@ -389,8 +380,7 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
);
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)]
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(
@ -404,8 +394,8 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
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(
12.height,
Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
@ -451,9 +441,8 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
),
),
),
),
// if (MediaQuery.of(context).orientation == Orientation.portrait)
AyaPlayerWidget(
);
Widget _ayaPlayer = AyaPlayerWidget(
surahName: _ayatTangheemTypeMappedFirstData?.surahNameAr ?? "",
ayaTangheemTypeId: _ayatTangheemTypeMappedFirstData?.tangheemTypeId ?? "",
globalKey: _globalKey,
@ -461,53 +450,43 @@ class _TangheemDetailScreenState extends State<TangheemDetailScreen> {
ayaNo: _ayatTangheemTypeMappedFirstData?.ayahNo,
surahNo: _ayatTangheemTypeMappedFirstData?.surahNo,
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),
AyaRecordWidget().paddingOnly(left: 24, right: 24),
SizedBox(height: 16),
discussionView(_discussionModel?.data ?? []).paddingOnly(left: 24, right: 24),
SizedBox(height: 16),
],
),
),
if (false)
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
)
: Row(
children: [
Container(
height: 24,
margin: EdgeInsets.only(bottom: 8, top: 8),
// color: Colors.transparent,
child: TextButton(
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),
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),
],
),
);

70
lib/ui/screens/tangheem_screen.dart
Unescape Escape View File

@ -1,5 +1,6 @@
import 'package:flutter/cupertino.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/classes/colors.dart';
import 'package:tangheem/classes/utils.dart';
@ -110,21 +111,17 @@ class _TangheemScreenState extends State<TangheemScreen> {
@override
Widget build(BuildContext context) {
return _dataList == null
? SizedBox()
: ListView(
controller: _controller,
//physics: BouncingScrollPhysics(),
children: [
Stack(
bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
Widget _header = Stack(
alignment: Alignment.center,
children: [
SizedBox(
// height: double.infinity,
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(-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(
@ -138,15 +135,16 @@ class _TangheemScreenState extends State<TangheemScreen> {
],
).paddingOnly(top: 16),
],
),
_dataList.isEmpty
);
Widget _dataListView = _dataList?.isEmpty ?? true
? NoDataUI().paddingOnly(top: 215)
: ListView.separated(
// controller: _controller,
// physics: BouncingScrollPhysics(),
physics: NeverScrollableScrollPhysics(),
shrinkWrap: true,
padding: EdgeInsets.only(left: 24, right: 24, top: 24, bottom: 24),
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);
@ -170,26 +168,40 @@ class _TangheemScreenState extends State<TangheemScreen> {
borderRadius: BorderRadius.circular(4),
child: Container(
padding: EdgeInsets.fromLTRB(12, 12, 12, 12),
decoration: BoxDecoration(
color: Colors.white,
color: ColorConsts.brownLightECColor,
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(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Row(
// mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisSize: MainAxisSize.min,
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(
" ${_dataList[index].ayatNumberInSurahs}",
style: TextStyle(fontSize: 14, fontFamily: "BArabics", color: ColorConsts.secondaryOrange),
"الآية ${_dataList[index].ayatNumberInSurahs}",
style: TextStyle(fontSize: 12, color: ColorConsts.brownB7Color),
),
4.width,
"(${_dataList[index].tangheemTypeName})".toText(12, color: ColorConsts.secondaryOrange),
],
),
TextHighLightLengthWidget(
@ -197,6 +209,7 @@ class _TangheemScreenState extends State<TangheemScreen> {
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,
@ -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),
],
);
}

11
lib/widgets/new/CommonHeader.dart
Unescape Escape View File

@ -17,11 +17,12 @@ class CommonHeader extends StatelessWidget {
final Function(CommonHeaderEnum) 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);
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);
@override
Widget build(BuildContext context) {
bool isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
return AspectRatio(
aspectRatio: ratio ?? 469 / 313,
child: Stack(
@ -53,7 +54,7 @@ class CommonHeader extends StatelessWidget {
),
isCustom
? Column(
mainAxisAlignment: MainAxisAlignment.end,
mainAxisAlignment: isPortrait ? MainAxisAlignment.end : MainAxisAlignment.center,
children: [
title.toText(30),
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(
@ -109,7 +110,7 @@ class CommonHeader extends StatelessWidget {
26.height,
title.toText(30),
],
),
).paddingOnly(right: isPortrait ? 0 : 120),
],
),
);

Write Preview
Loading…
Cancel
Save