flutter_quran
This Package allows you integrate Quran offline in your app and it will work without the need for any other resources.
Note that the json used in the package to provide all quran details is from مجمع الملك فهد لطباعة المصحف الشريف
Features
-
View all Quran Pages like Madina's Quran.
-
Save user's last opened page.
-
Search for any text in Quran.
-
Navigate to any page in Quran.
-
Get a list of all Jozzs and navigate to any Jozz.
-
Get a list of all hizbs and navigate to any hizb.
-
Get a list of all Surahs and navigate to any Surah.
-
Adding, removing and navigating to bookmarks .
Getting started
In the pubspec.yaml
of your flutter project, add the following dependency:
dependencies:
...
flutter_quran: ^0.0.1
Import it:
import 'package:flutter_quran/flutter_quran.dart';
Initialize it:
FlutterQuran().init();
Usage Example
Basic Quran Screen
/// You can just add it to your code:
Scaffold(body: FlutterQuranScreen());
/// or give it some options:
FlutterQuranScreen(
appBar: AppBar(
actions: [
Padding(
padding: const EdgeInsetsDirectional.only(end: 22.0),
child: GestureDetector(
onTap: () => Navigator.of(context).push(MaterialPageRoute(builder: (ctx) => SearchScreen())),
child: Icon(Icons.search)),
),
],
),
onPageChanged: (int pageIndex) => print("Page changed: $pageIndex"),
),
-
You can find more in the examples
The package provides a lot of utils like
/// Getting all Quran's Jozzs, Hizbs, and Surahs
final jozzs = FlutterQuran().getAllJozzs();
final hizbs = FlutterQuran().getAllHizbs();
final surahs = FlutterQuran().getAllSurahs();
/// Adding, setting, removing, getting and navigating to bookmarks
// In init function
FlutterQuran().init(userBookmarks: [Bookmark(id: 0, colorCode: Colors.red.value, name: "Red Bookmark")]);
final usedBookmarks = FlutterQuran().getUsedBookmarks();
FlutterQuran().setBookmark(ayahId: 24, page: 4, bookmarkId: 0);
FlutterQuran().removeBookmark(bookmarkId: 0);
FlutterQuran().navigateToBookmark(bookmark);
/// searching for a word
TextField(
onChanged: (txt) {
final _ayahs = FlutterQuran().search(txt);
setState(() {
ayahs = [..._ayahs];
});
},
decoration: InputDecoration(
border: OutlineInputBorder(borderSide: BorderSide(color: Colors.black),),
hintText: 'بحث',
),
),
/// Navigating through Quran
FlutterQuran().navigateToAyah(ayah);
FlutterQuran().navigateToPage(1);
FlutterQuran().navigateToJozz(1);
FlutterQuran().navigateToHizb(1);
FlutterQuran().navigateToSurah(1);
FlutterQuran().navigateToBookmark(bookmark);
/// You can use Quran's style if you needed it
FlutterQuran().hafsStyle;