quran screen improvement.

development
Sikander Saleem 5 years ago
parent 6e120920c9
commit 5e4f4435d8

@ -0,0 +1,7 @@
<svg viewBox="0 0 28.96 28.96" xmlns="http://www.w3.org/2000/svg">
<g data-name="Layer 2" id="Layer_2">
<g data-name="Layer 1" id="Layer_1-2">
<path style="fill: #fff" d="M14.48,0A14.48,14.48,0,1,0,29,14.48,14.5,14.5,0,0,0,14.48,0Zm5.33,18.11a1.2,1.2,0,0,1,0,1.7,1.18,1.18,0,0,1-1.7,0l-3.63-3.62-3.63,3.62a1.18,1.18,0,0,1-1.7,0,1.2,1.2,0,0,1,0-1.7l3.62-3.63L9.15,10.85a1.2,1.2,0,0,1,1.7-1.7l3.63,3.62,3.63-3.62a1.2,1.2,0,1,1,1.7,1.7l-3.62,3.63Z"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 483 B

@ -29,6 +29,18 @@ class TangheemUserApiClient {
return await ApiClient().postJsonForObject((json) => AyatTangheemTypeMapped.fromJson(json), url, postParams); return await ApiClient().postJsonForObject((json) => AyatTangheemTypeMapped.fromJson(json), url, postParams);
} }
Future<AyaModel> getAyaByFilter(int surahID, int ayahFrom, int ayahTo) async {
String url = "${ApiConsts.tangheemUsers}AyatByRange_Get";
var postParams = {"surahID": surahID, "ayahFrom": ayahFrom, "ayahTo": ayahTo};
return await ApiClient().postJsonForObject((json) => AyaModel.fromJson(json), url, postParams);
}
Future<AyaModel> getQuranByPageNo(int pageNo) async {
String url = "${ApiConsts.tangheemUsers}Quran_Get";
var postParams = {"pageNo": pageNo};
return await ApiClient().postJsonForObject((json) => AyaModel.fromJson(json), url, postParams);
}
Future<AyaModel> getAyaByRange(int itemsPerPage, int currentPageNo, int surahID, int ayahFrom, int ayahTo) async { Future<AyaModel> getAyaByRange(int itemsPerPage, int currentPageNo, int surahID, int ayahFrom, int ayahTo) async {
String url = "${ApiConsts.tangheemUsers}AyatByRange_Get"; String url = "${ApiConsts.tangheemUsers}AyatByRange_Get";
var postParams = {"itemsPerPage": itemsPerPage, "currentPageNo": currentPageNo, "surahID": surahID, "ayahFrom": ayahFrom, "ayahTo": ayahTo}; var postParams = {"itemsPerPage": itemsPerPage, "currentPageNo": currentPageNo, "surahID": surahID, "ayahFrom": ayahFrom, "ayahTo": ayahTo};

@ -1,7 +1,7 @@
class SurahModel { class SurahModel {
int totalItemsCount; int totalItemsCount;
int statusCode; int statusCode;
String message; Null message;
List<SurahModelData> data; List<SurahModelData> data;
SurahModel({this.totalItemsCount, this.statusCode, this.message, this.data}); SurahModel({this.totalItemsCount, this.statusCode, this.message, this.data});
@ -39,6 +39,8 @@ class SurahModelData {
String englishNameTranslation; String englishNameTranslation;
int revelationID; int revelationID;
String revelationType; String revelationType;
int startPageNo;
int endPageNo;
SurahModelData( SurahModelData(
{this.id, {this.id,
@ -48,7 +50,9 @@ class SurahModelData {
this.numberOfAyahs, this.numberOfAyahs,
this.englishNameTranslation, this.englishNameTranslation,
this.revelationID, this.revelationID,
this.revelationType}); this.revelationType,
this.startPageNo,
this.endPageNo});
SurahModelData.fromJson(Map<String, dynamic> json) { SurahModelData.fromJson(Map<String, dynamic> json) {
id = json['id']; id = json['id'];
@ -59,6 +63,8 @@ class SurahModelData {
englishNameTranslation = json['englishNameTranslation']; englishNameTranslation = json['englishNameTranslation'];
revelationID = json['revelation_ID']; revelationID = json['revelation_ID'];
revelationType = json['revelationType']; revelationType = json['revelationType'];
startPageNo = json['startPageNo'];
endPageNo = json['endPageNo'];
} }
Map<String, dynamic> toJson() { Map<String, dynamic> toJson() {
@ -71,6 +77,8 @@ class SurahModelData {
data['englishNameTranslation'] = this.englishNameTranslation; data['englishNameTranslation'] = this.englishNameTranslation;
data['revelation_ID'] = this.revelationID; data['revelation_ID'] = this.revelationID;
data['revelationType'] = this.revelationType; data['revelationType'] = this.revelationType;
data['startPageNo'] = this.startPageNo;
data['endPageNo'] = this.endPageNo;
return data; return data;
} }
} }

@ -31,10 +31,11 @@ class QuranScreen extends StatefulWidget {
class _QuranScreenState extends State<QuranScreen> { class _QuranScreenState extends State<QuranScreen> {
GlobalKey _globalKey = GlobalKey(); GlobalKey _globalKey = GlobalKey();
int _selectedSurah = 0; int _selectedSurah = -1;
int _selectedFromAya = 0; int _selectedFromAya = -1;
int _selectedToAya = 0; int _selectedToAya = -1;
int _currentSurahIndex = -1;
int _currentPage = 0; int _currentPage = 0;
int _ayaInPage = 5; int _ayaInPage = 5;
List<String> _surahList = []; List<String> _surahList = [];
@ -63,12 +64,15 @@ class _QuranScreenState extends State<QuranScreen> {
_surahModel = widget.surahModel; _surahModel = widget.surahModel;
} }
_surahList = _surahModel.data.map((element) => element.nameAR).toList(); _surahList = _surahModel.data.map((element) => element.nameAR).toList();
filterData();
//filterData();
} catch (ex, tr) { } catch (ex, tr) {
Utils.handleException(ex, null); Utils.handleException(ex, null);
} finally { } finally {
Utils.hideLoading(context); Utils.hideLoading(context);
} }
setState(() {});
getQuranByPageNo();
} }
int numberOfAyah = 0; int numberOfAyah = 0;
@ -77,10 +81,11 @@ class _QuranScreenState extends State<QuranScreen> {
var filteredAyahList = List.generate(getNextMultiple(numberOfAyah), (index) => index + 1).toList().where((element) => element == 1 || (element % 5) == 0).toList() ?? []; var filteredAyahList = List.generate(getNextMultiple(numberOfAyah), (index) => index + 1).toList().where((element) => element == 1 || (element % 5) == 0).toList() ?? [];
_fromAyaList = filteredAyahList.getRange(0, filteredAyahList.length - 1)?.toList() ?? []; _fromAyaList = filteredAyahList.getRange(0, filteredAyahList.length - 1)?.toList() ?? [];
_toAyaList = filteredAyahList.getRange(1, filteredAyahList.length)?.toList() ?? []; _toAyaList = filteredAyahList.getRange(1, filteredAyahList.length)?.toList() ?? [];
_currentPage = 0; // _currentPage = 0;
_selectedFromAya = 0; // _selectedFromAya = 0;
_selectedToAya = 0; // _selectedToAya = 0;
getTangheemBySurahId(); setState(() {});
//getTangheemBySurahId();
} }
void getTangheemBySurahId() async { void getTangheemBySurahId() async {
@ -93,13 +98,28 @@ class _QuranScreenState extends State<QuranScreen> {
} finally { } finally {
Utils.hideLoading(context); Utils.hideLoading(context);
} }
getAyaByRange(); setState(() {});
//getAyaByRange();
} }
void getAyaByRange() async { void getAyaByRange() async {
Utils.showLoading(context); Utils.showLoading(context);
try { try {
_ayaModel = await TangheemUserApiClient().getAyaByRange(_ayaInPage, 1, _selectedSurah + 1, _fromAyaList[_selectedFromAya], _toAyaList[_selectedToAya]); _ayaModel = await TangheemUserApiClient().getAyaByFilter(_selectedSurah + 1, _fromAyaList[_selectedFromAya], _toAyaList[_selectedToAya]);
setState(() {});
} catch (ex, tr) {
Utils.handleException(ex, null);
} finally {
Utils.hideLoading(context);
}
scrollToId.animateTo("$_currentPage", duration: Duration(milliseconds: 300), curve: Curves.ease);
}
void getQuranByPageNo() async {
Utils.showLoading(context);
try {
// _currentPage = 603;
_ayaModel = await TangheemUserApiClient().getQuranByPageNo(_currentPage + 1);
setState(() {}); setState(() {});
} catch (ex, tr) { } catch (ex, tr) {
Utils.handleException(ex, null); Utils.handleException(ex, null);
@ -124,9 +144,41 @@ class _QuranScreenState extends State<QuranScreen> {
final ScrollController scrollController = ScrollController(); final ScrollController scrollController = ScrollController();
ScrollToId scrollToId; ScrollToId scrollToId;
String getBismillahWithSurahName(String _surahName, bool isShowBismillah, bool isFirstIsAya) {
if (isFirstIsAya && isShowBismillah) {
return "" + _surahName + "\n بِسۡمِ ٱللَّهِ ٱلرَّحۡمَٰنِ ٱلرَّحِيمِ \n";
} else if (isShowBismillah) {
return "\n" + _surahName + "\n بِسۡمِ ٱللَّهِ ٱلرَّحۡمَٰنِ ٱلرَّحِيمِ \n";
}
return "" + _surahName + "\n";
}
String getNotNullValue(List<String> list, int index) {
try {
return list[index];
} catch (ex) {
return "";
}
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
String _surahAya = _ayaModel?.data?.map((e) => e.ayahText)?.toList()?.fold("", (value, element) => value + element) ?? ""; var tempList = _ayaModel?.data?.map((e) => e.surahNameEN)?.toList()?.toSet()?.toList() ?? [];
String _surahName = "";
_surahName = tempList.isEmpty ? "" : tempList?.last ?? "";
int index = _surahList.indexWhere((element) => element == _surahName);
if (index != null) {
_currentSurahIndex = index;
}
String _surahAya = "";
_ayaModel?.data?.forEach((element) {
var temp = element.numberInSurah == 1 ? getBismillahWithSurahName(element.surahNameEN, element.surahID != 1, _surahAya.length <= 1) + element.ayahText : element.ayahText;
_surahAya = _surahAya + temp;
});
return Container( return Container(
padding: EdgeInsets.fromLTRB(16, 24, 16, 0), padding: EdgeInsets.fromLTRB(16, 24, 16, 0),
width: double.infinity, width: double.infinity,
@ -141,39 +193,75 @@ class _QuranScreenState extends State<QuranScreen> {
Row( Row(
children: [ children: [
Expanded( Expanded(
child: CommonDropDownButton(_selectedSurah, list: _surahList, onSelect: (index) { child: CommonDropDownButton(_selectedSurah, hintText: "السورة", list: _surahList, onSelect: (index) {
if (_selectedSurah != index) { if (_selectedSurah != index) {
_selectedSurah = index; _selectedSurah = index;
_selectedToAya = 0; _selectedToAya = -1;
_selectedFromAya = 0; _selectedFromAya = -1;
filterData(); filterData();
} }
}), }),
), ),
SizedBox(width: 4), SizedBox(width: 4),
Expanded( Expanded(
child: CommonDropDownButton(_selectedFromAya, list: _fromAyaList.map((e) => "من الاية" + " $e").toList(), onSelect: (index) { child: CommonDropDownButton(_selectedFromAya, hintText: "من الاية", list: _fromAyaList.map((e) => "من الاية" + " $e").toList(), onSelect: (index) {
if (_selectedFromAya != index) { if (_selectedFromAya != index) {
_selectedFromAya = index; _selectedFromAya = index;
_selectedToAya = index; setState(() {});
_currentPage = index;
getAyaByRange(); /// _selectedToAya = index;
// _currentPage = index;
// getAyaByRange();
} }
}), }),
), ),
SizedBox(width: 4), SizedBox(width: 4),
Expanded( Expanded(
child: CommonDropDownButton(_selectedToAya, list: _toAyaList.map((e) => "الى الاية" + " $e").toList(), onSelect: (index) { child: CommonDropDownButton(_selectedToAya, hintText: "الى الاية", list: _toAyaList.map((e) => "الى الاية" + " $e").toList(), onSelect: (index) {
if (_selectedToAya != index) { if (_selectedToAya != index) {
_selectedToAya = index; _selectedToAya = index;
_currentPage = index; setState(() {});
getAyaByRange(); // _currentPage = index;
// getAyaByRange();
} }
}), }),
), ),
], ],
), ),
SizedBox(height: 8),
Row(
children: [
commonIconButton("ابدأ البحث", "assets/icons/go_forward.svg", () {
if (_selectedSurah < 0) {
Utils.showToast("الرجاء اختيار السورة");
return;
}
if (_selectedFromAya < 0) {
Utils.showToast("لم تحدد بداية الآية");
return;
}
if (_selectedToAya < 0) {
Utils.showToast("لم تحدد الآية المنتهية");
return;
}
getAyaByRange();
}),
SizedBox(width: 8),
commonIconButton(
"مسح البحث",
"assets/icons/cancel.svg",
(_selectedSurah == -1 || _selectedFromAya == -1 || _selectedToAya == -1)
? null
: () {
_selectedSurah = -1;
_selectedFromAya = -1;
_selectedToAya = -1;
getQuranByPageNo();
}),
],
),
SizedBox(height: 16), SizedBox(height: 16),
if (_surahAya.isNotEmpty)
Expanded( Expanded(
child: Container( child: Container(
margin: EdgeInsets.only(top: 4, bottom: 4), margin: EdgeInsets.only(top: 4, bottom: 4),
@ -189,21 +277,21 @@ class _QuranScreenState extends State<QuranScreen> {
children: [ children: [
nextOptionButton( nextOptionButton(
"assets/icons/prev.svg", "assets/icons/prev.svg",
_selectedSurah == 0 ? "" : _surahList[_selectedSurah - 1], _currentSurahIndex <= 0 ? "" : getNotNullValue(_surahList, _currentSurahIndex - 1),
_selectedSurah == 0 _currentSurahIndex <= 0
? null ? null
: () { : () {
_selectedSurah = _selectedSurah - 1; // _selectedSurah = _selectedSurah - 1;
filterData(); // filterData();
}), }),
previousOptionButton( previousOptionButton(
"assets/icons/next.svg", "assets/icons/next.svg",
_selectedSurah == (_surahList.isNotEmpty ? (_surahList.length - 1) : 0) ? "" : _surahList[_selectedSurah + 1], _currentSurahIndex >= (_surahList.isNotEmpty ? (_surahList.length - 1) : 0) ? "" : getNotNullValue(_surahList, _currentSurahIndex + 1),
_selectedSurah == (_surahList.isNotEmpty ? (_surahList.length - 1) : 0) _currentSurahIndex >= (_surahList.isNotEmpty ? (_surahList.length - 1) : 0)
? null ? null
: () { : () {
_selectedSurah = _selectedSurah + 1; // _selectedSurah = _selectedSurah + 1;
filterData(); // filterData();
}), }),
], ],
), ),
@ -263,21 +351,21 @@ class _QuranScreenState extends State<QuranScreen> {
), ),
), ),
), ),
SizedBox(height: 8), // SizedBox(height: 8),
AyaScrollViewer( // AyaScrollViewer(
scrollDirection: Axis.horizontal, // scrollDirection: Axis.horizontal,
scrollToId: scrollToId, // scrollToId: scrollToId,
children: <ScrollContent>[ // children: <ScrollContent>[
for (int i = 0; i < _fromAyaList.length; i++) // for (int i = 0; i < _fromAyaList.length; i++)
ScrollContent( // ScrollContent(
id: '$i', // id: '$i',
child: Text( // child: Text(
" ${i + 1} ", // " ${i + 1} ",
style: TextStyle(fontSize: 16, color: _currentPage == i ? ColorConsts.secondaryOrange : ColorConsts.textHintGrey), // style: TextStyle(fontSize: 16, color: _currentPage == i ? ColorConsts.secondaryOrange : ColorConsts.textHintGrey),
), // ),
), // ),
], // ],
), // ),
SizedBox(height: 4), SizedBox(height: 4),
Row( Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
@ -289,20 +377,22 @@ class _QuranScreenState extends State<QuranScreen> {
? null ? null
: () { : () {
_currentPage = _currentPage - 1; _currentPage = _currentPage - 1;
_selectedFromAya = _selectedFromAya - 1; _selectedSurah = -1;
_selectedToAya = _selectedToAya - 1; _selectedFromAya = -1;
getAyaByRange(); _selectedToAya = -1;
getQuranByPageNo();
}), }),
previousOptionButton( previousOptionButton(
"assets/icons/next_single.svg", "assets/icons/next_single.svg",
"الآيات التالية", "الآيات التالية",
_currentPage == (_toAyaList.isNotEmpty ? (_toAyaList.length - 1) : 0) _currentPage == 604
? null ? null
: () { : () {
_currentPage = _currentPage + 1; _currentPage = _currentPage + 1;
_selectedFromAya = _selectedFromAya + 1; _selectedSurah = -1;
_selectedToAya = _selectedToAya + 1; _selectedFromAya = -1;
getAyaByRange(); _selectedToAya = -1;
getQuranByPageNo();
}), }),
], ],
), ),
@ -316,6 +406,36 @@ class _QuranScreenState extends State<QuranScreen> {
); );
} }
Widget commonIconButton(String title, String iconString, VoidCallback callback) {
return InkWell(
splashColor: Colors.transparent,
highlightColor: Colors.transparent,
onTap: callback,
child: Container(
height: 36,
decoration: BoxDecoration(
color: callback == null ? ColorConsts.secondaryPink.withOpacity(.5) : ColorConsts.secondaryPink,
borderRadius: BorderRadius.circular(6),
),
padding: EdgeInsets.fromLTRB(8, 2, 8, 2),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Text(
title,
maxLines: 1,
style: TextStyle(fontSize: 12, color: Colors.white),
),
SizedBox(width: 12),
SvgPicture.asset(iconString, width: 20, height: 20, color: Colors.white),
],
),
),
);
}
Widget nextOptionButton(String icon, String text, VoidCallback onPressed) { Widget nextOptionButton(String icon, String text, VoidCallback onPressed) {
return InkWell( return InkWell(
onTap: onPressed, onTap: onPressed,

Loading…
Cancel
Save