quran_pages_with_ayah_detector 1.0.5

A Flutter package to show Quran pages with tap-detectable ayahs.

example/main.dart

import 'dart:developer';

import 'package:flutter/material.dart';
import 'package:quran_pages_with_ayah_detector/quran_pages_with_ayah_detector.dart';

void main() {
  runApp(const MainApp());
}

class MainApp extends StatefulWidget {
  const MainApp({super.key});

  @override
  State<MainApp> createState() => _MainAppState();
}

class _MainAppState extends State<MainApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(),
      // theme: ThemeData.dark(), //? Use ThemeModes with themeModeAdaption = true
      home: Scaffold(
        body: QuranPageView(
          /// ALL IMAGES IN "assets/pages/1.png~604.png"
          /// Default path. Change if needed based on images path
          pageImagePath: "assets/pages/",
          debuggingMode: true,
          themeModeAdaption: false,
          showPageTopBar: true,
          showPageNumber: true,
          textColor: Colors.black,
          highlightColor: Colors.blue,
          highlightDuration: const Duration(milliseconds: 100),
          onAyahTap: (sura, ayah, pageNumber) {
            log("Sura Number: ${sura.toString()}");
            log("Ayah Number: ${ayah.toString()}");
            log("Page Number: ${pageNumber.toString()}");
          },
          onSuraNameTap: () {
            log("Navigate to Sura List page");
          },
          onJuzNumberTap: () {
            log("Navigate to Juz List page");
          },
        ),
      ),
    );
  }
}