السلام عليكم ورحمة الله وبركاته،
كنت أنا وصديقي المطوّر إبراهيم قريقع نتناقش منذ بداية عملي على تطوير تطبيق المصحف لنظام iOS:
لماذا لا توجد Package عصرية مكتوبة بـ SwiftUI يمكن إضافتها لأي تطبيق ليصبح هذا التطبيق مزوّدًا بمصحف كامل بكل خصائصه وبكل سهولة؟
الفكرة واضحة ومفيدة جدًا، خاصة أنه لا يوجد حل مشابه حقيقي لمنصات آبل. الموجود حاليًا مثل مشروع Quran.com قديم جدًا، مكتوب بلغات لم تعد مناسبة، وتعاملها داخل تطبيقات SwiftUI معقّد للغاية.
انشغلت بعدها بتطوير تطبيق المصحف الخاص بي (سوف أشارك معكم تقدمي في هذا المشروع قريباً)، وفجأة وصلتني رسالة من إبراهيم بأنه بدأ بالفعل في بناء المشروع الذي كنا نحلم به. ومع الاستعانة بالذكاء الاصطناعي، خرج العمل رائعًا جدًا ويُعتبر بداية قوية (ليست احترافية بالكامل، هناك الكثير من التحسينات الممكنة).
اليوم أبشّركم بهذا الخبر المفرح:
المطور إبراهيم قام بفتح مصدر مشروع مصحف عماد بالكامل.
🔗 رابط المشروع:
https://github.com/ibo2001/MushafImad
مميزات مشروع MushafImad
مشروع MushafImad هو Swift Package يقدّم تجربة قراءة مصحف كاملة وجاهزة، تعمل على iOS 17+ وmacOS 14+، وتشمل الصور، بيانات الآيات، توقيت التلاوة، مكوّنات SwiftUI جاهزة، ودعم تشغيل الصوت مع تمييز الآيات.
✨ أبرز المميزات
دعم حقيقي للمنصتين
يعمل على iOS وmacOS دون أي تنازلات، مع تكيف كامل لواجهة المستخدم.
واجهة MushafView متطورة
تعرض جميع صفحات المصحف الـ 604 مع إمكانية تحديد الآيات، دعم الصفحات RTL، وتغيير الثيمات.
قاعدة بيانات Realm مدمجة
قاعدة quran.realm توفر وصولًا سريعًا دون إنترنت إلى السور والآيات والأجزاء والأحزاب والعناوين.
Caching متقدم
لتسريع عرض الصفحات والتنقل السلس، عبر خدمات مثل ChaptersDataCache وQuranImageProvider.
تشغيل صوتي متكامل
مشغّل الصوت يتكامل مع AVPlayer ويقوم بمزامنة تمييز الآيات مع التلاوة بدقة.
مكوّنات UI قابلة لإعادة الاستخدام
مثل التوست، مؤشرات التقدّم، شاشات التحميل، وعناصر متعددة جاهزة.
تطبيق مثال جاهز
يوضّح كيفية دمج MushafView في iOS وmacOS بسرعة شديدة.
بنية المشروع
يُقسّم المشروع إلى عدّة أجزاء رئيسية:
Sources/Core
Sources/Services
خدمات واجهة القراءة:
- MushafView + ViewModel
- QuranImageProvider لإدارة الكاش
- QuranImageDownloadManager لتحميل الخطوط والصور
Sources/AudioPlayer
يدمج الصوت مع التوقيت:
- QuranPlayerViewModel
- AyahTimingService
- ReciterService
- واجهات SwiftUI لمشغّل التلاوة.
Sources/Components
عناصر واجهة جاهزة:
- Toast
- مؤشرات تقدّم
- Loading views
وغيرها.
Resources
- قاعدة البيانات quran.realm
- ملفات التوقيت JSON
- الخطوط
- ملف الأصوات
- الصور
طريقة الاستخدام
1) إضافة الباكيج
.package(url: "https://github.com/ibo2001/MushafImad", from: "1.0.3")
2) التهيئة عند الإقلاع
import MushafImad
@main
struct MyApp: App {
init() {
try? RealmService.shared.initialize()
FontRegistrar.registerFontsIfNeeded()
}
var body: some Scene {
WindowGroup {
MushafScene()
.environmentObject(ReciterService.shared)
.environmentObject(ToastManager())
}
}
}
3) عرض المصحف
struct MushafScene: View {
var body: some View {
MushafView(initialPage: 1)
.task { await MushafView.ViewModel().loadData() }
}
}
خيارات تخصيص إضافية
تخزين إعدادات المستخدم عبر AppStorage مثل:
- reading_theme
- scrolling_mode
- selectedReciterId
إضافة ToastOverlayView أعلى الواجهة.
تغيير الثيمات أو إنشاء ثيمات جديدة.
التعامل مع تفاعل المستخدم مثل الضغط المطوّل على الآية أو النقر على الصفحة.
مثال:
struct ReaderContainer: View {
@State private var highlightedVerse: Verse?
@State private var isChromeVisible = true
var body: some View {
MushafView(
initialPage: 1,
highlightedVerse: $highlightedVerse,
onVerseLongPress: { verse in highlightedVerse = verse },
onPageTap: { withAnimation { isChromeVisible.toggle() } }
)
.toolbarVisibility(isChromeVisible ? .visible : .hidden, for: .navigationBar)
}
}
تخصيص مصادر الصور والألوان
يمكنك جعل التطبيق يستخدم أصولك الخاصة بدل الأصول المرفقة:
MushafAssets.configuration = MushafAssetConfiguration(
colorBundle: .main,
imageBundle: .main
)
أو تخصيص عناصر معينة فقط:
MushafAssets.configuration = MushafAssetConfiguration(
imageProvider: { name in
name == "fasel" ? Image("CustomAyahMarker") : nil
}
)
تخصيص مصدر تحميل الصور
يمكنك تحديد CDN خاص بك أو تحميل كامل الصور مسبقًا:
@MainActor
func configureMushaf() async {
if let customURL = URL(string: "https://cdn.example.com/mushaf") {
await QuranImageProvider.shared.updateImageBaseURL(customURL)
}
try await QuranImageProvider.shared.preloadEntireMushaf { completed, total in
print("Downloaded \(completed) / \(total)")
}
}
🤝 ماذا نريد منكم؟
نريد أن نعمل معًا على تطوير هذا المشروع ليصبح أفضل مصحف مفتوح المصدر على الإطلاق:
- اعمل Fork
- أصلِح الأخطاء
- طوّر خصائص جديدة
- أرسل Pull Request
لنصل جميعًا إلى مصحف عصري، محترف، وسهل الدمج داخل أي تطبيق iOS.
ملاحظة: إبراهيم من الوضح أنه لا وقت لديه ليشارك بنفسه، لذلك استأذنت أن أكون من ينشر هذا الأمر حتى لا يضيع بدون تطوير أو ينسى، وشخصياً رغم ان لدي شيء مشابه (نحن الأثنين نعمل بنفس الأسلوب) سوف اتبنى في تحديثات تطبيقاتي مكتبته لأنها أسهل في دمجها مع التطبيقات التي تحتاج المصحف كعنصر ثانوي، مثل تطبيقات الصلاة، أو الأذكار وغيرها.
متاح للإجابة على آي سؤال، والمهم المشاركة في تحسين هذا المشروع.
