Skip to content

NGPTechWorld/Multimedia-PixelLab-HKMON

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

24 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

تقرير مشروع مختبر الصور — PixelLab

image image image

مقدمة

PixelLab هو تطبيق سطح مكتب (Desktop Application) تعليمي تفاعلي يُبسّط مفاهيم الأنظمة اللونية ومعالجة الصور عبر تجربة بصرية بالزمن الحقيقي.

  • اللغة وإطار العمل: C# / WinForms / .NET 6
  • بنية المشروع: نموذجان رئيسيان:
    • Form1 — الواجهة الرئيسية لمعالجة الصور (يحقق الطلبات 1، 2، 3، 6، 7، 8، 9، 10).
    • Form4 — نافذة التمثيل البصري ثلاثي الأبعاد للفضاء اللوني (يحقق الطلبين 4 و 5).
  • المكتبات الخارجية:
    • Emgu.CV (v4.5.5) — تحويلات الأنظمة اللونية الدقيقة عبر OpenCV.
    • ColorMine (v1.1.3) — تحويلات إضافية بين الفضاءات اللونية (HSV, CMYK, LAB).
    • KGySoft.Drawing (v10.0.2) — تكميم الألوان (Color Quantization) بخوارزمية Wu.
    • OpenTK + OpenTK.GLControl (v3.3.3) — العرض ثلاثي الأبعاد عبر OpenGL ضمن WinForms.

القسم الأول: Form1 — الإجراءات

الطلب 1: إدخال الصورة (الواجهة الرسومية + السحب والإفلات)

  • الواجهة الرسومية: زر openImage يفتح OpenFileDialog، وعند اختيار صورة يتم تحميلها في PictureBox (المسمّى Scene).
  • Drag & Drop: تم ضبط Scene.AllowDrop = true ومعالجة الحدثين DragEnter و DragDrop؛ يُقبل الملف المسحوب فقط إذا كان من نوع DataFormats.FileDrop.
  • بعد التحميل تُحفظ نسختان:
    • originalImage — النسخة الأصلية للاستعادة لاحقاً.
    • image — النسخة الحالية التي تُجرى عليها التعديلات.

الطلب 2: التحويل بين الأنظمة اللونية

  • يختار المستخدم النظام من comboBox1، ويستدعى الحدث comboBox1_SelectedIndexChanged.
  • الأنظمة المدعومة: RGB, CMYK, HSV, YUV, LAB, YCbCr.
  • آلية التحويل: اعتمدنا على CvInvoke.CvtColor من Emgu.CV مع ثوابت تحويل OpenCV:
    • ColorConversion.Bgr2Hsv لنظام HSV.
    • ColorConversion.Bgr2Yuv لنظام YUV.
    • ColorConversion.Bgr2Lab لنظام LAB.
    • ColorConversion.Bgr2YCrCb لنظام YCbCr.
  • CMYK يُحسب يدوياً بكسل-بكسل (ConvertToCMYK) باستخدام: C = 255 - R، M = 255 - G، Y = 255 - B.

الطلب 3: عرض مركبات كل نظام والتحكم بها

  • تم تصميم ست لوحات (Panels): RGB_Panel, CMYK_Panel, HSV_Panel, YUV_Panel, LAB_Panel, YCbCr_Panel. تُعرض لوحة واحدة فقط حسب اختيار المستخدم من comboBoxColorSystems، عبر الدالة المساعدة ShowPanel.
  • كل لوحة تحتوي على NumericUpDown لكل مركبة (مثلاً RGB يحوي ثلاثة: R, G, B). نطاق القيمة من 0 إلى 100، وقيمة 50 تمثّل الحالة الحيادية (بدون تعديل).
  • آلية التعديل: الدالة المركزية ColorSystem_ValueChanged (مرتبطة بحدث ValueChanged لكل المركبات) تُعيد الحساب دائماً انطلاقاً من originalImage، ثم تطبّق معامل ضرب لكل قناة: factor = value / 50.0.
  • تعديل قيمة مركبة: مثلاً تحريك HSV_V يضرب قناة الإضاءة (Value) بالمعامل المناسب.
  • تعطيل قناة: ضبط قيمة المركبة على 0 يجعل المعامل صفراً، فتختفي مساهمة تلك القناة من الصورة وتُعاد الصورة من الباقي.
  • LAB يُعالج بدقّة عالية عبر دالة منفصلة ApplyLAB تستخدم Emgu.CV للذهاب والإياب بين BGR و LAB.

الطلب 6: التحديث بالزمن الحقيقي

  • كل تغيير على أي NumericUpDown يطلق حدث ValueChanged مباشرةً، فيُعاد توليد الصورة وعرضها فوراً في Scene.
  • الحساب يتم على كامل Bitmap باستخدام GetPixel/SetPixel مع نظام clamping (Math.Max(0, Math.Min(255, ...))) لمنع الفيضان.
  • راية isResetting تمنع تكرار الأحداث أثناء عمليات إعادة الضبط.

الطلب 7: التحكم بعدد الألوان (Color Quantization)

  • يُدخل المستخدم العدد المطلوب في color_count (النطاق 2 إلى 65536)، ثم يضغط color_change.
  • الدالة color_change_Click تستخدم خوارزمية Wu من مكتبة KGySoft.Drawing:
    var quantizer = OptimizedPaletteQuantizer.Wu(colorCount);
  • النتيجة: تُمثَّل الصورة باستخدام لوحة ألوان (Palette) محدودة (مثلاً 4 ألوان بدل 256).

الطلب 8: عرض معلومات الصورة

  • اللوحة Image_information_8 تستخدم حدث الرسم المخصّص Image_information_8_Paint.
  • المعلومات المعروضة:
    • اسم الملف (File Name) ومساره (Path).
    • حجم التخزين بالـ KB.
    • أبعاد الصورة (Width × Height).
    • الدقّة الأفقية والعمودية (DPI).
    • صيغة البكسل (PixelFormat).
    • الصيغة الخام للملف (RawFormat — PNG, JPEG, إلخ).

الطلب 9: إعادة الضبط الأصلية

  • زر resetImage يستدعي الدالة reset_value_sysColor() التي:
    1. تنسخ originalImage إلى image وتعرضها في Scene.
    2. تُعيد جميع المركبات الـ18 (RGB+CMYK+HSV+YUV+LAB+YCbCr) إلى القيمة الحيادية 50.
    3. ترفع الراية isResetting = true لتجنّب تنفيذ ColorSystem_ValueChanged خلال إعادة الضبط.

الطلب 10: حفظ الصورة

  • الدالة save_image_Click تفتح SaveFileDialog يدعم الصيغ: BMP, JPEG/JPG, PNG, GIF, TIFF, ICO.
  • يتم استنتاج الصيغة من امتداد الملف، ثم يُمرَّر ImageFormat المناسب إلى Bitmap.Save(...).
  • تُعرض رسالة تأكيد عند نجاح الحفظ.

القسم الثاني: Form4 — الإجراءات

تُفتح هذه النافذة عبر زر button1 في Form1، ويُمرَّر إليها نسخة من originalImage.

الطلب 4: تمثيل كل نظام لوني ضمن فضاء بصري 2D/3D

  • يتم الرسم داخل GLControl (من OpenTK.GLControl) عبر OpenGL.
  • اختيار النظام من comboBox1 يبدّل الشكل المعروض. الأشكال المُنفّذة:
    • RGB → مكعب الألوان (DrawRGBCube): أوجه ملوّنة بتدرّجات بين الرؤوس (0,0,0)…(1,1,1).
    • CMYK → مكعب معكوس (DrawCMYKCube): الرؤوس تستخدم الصيغة (1-c, 1-m, 1-y) لإظهار النموذج الطرحي.
    • HSV → مخروط (DrawHSVCone): الزاوية حول المحور تمثّل Hue، نصف القطر يمثّل Saturation، والارتفاع يمثّل Value.
    • YUV → مكعب متحوّل (DrawYUVCube): كل رأس يُحوَّل من YUV إلى RGB لتلوينه.
    • LAB → كرة (DrawLABSphere): L كارتفاع (المحور Y)، A و B على المحورين الأفقيين.
    • YCbCr → مكعب (DrawYCbCrCube) ضمن الحدود القياسية: Y ∈ [16..235]، Cb/Cr ∈ [16..240].
  • بالإضافة إلى الشكل، تُرسم بكسلات الصورة كنقاط 3D داخل الفضاء اللوني (تُفعَّل بـ chkShowImageInSpace):
    • يتم تخزين العيّنات مسبقاً عبر CachePixels التي تستخدم LockBits لقراءة سريعة، وتُحدّ العيّنات بـ ≈25,000 نقطة فقط للحفاظ على الأداء.
    • الدالة MapRGBtoSpace تحوّل قيمة كل بكسل إلى إحداثيات (x, y, z) ضمن الفضاء المختار.
  • المحاور الثلاثة (أحمر/أخضر/أزرق) تُرسم دائماً كمرجع بصري.

الطلب 5: التفاعل (تدوير، تكبير، اختيار ألوان، مزامنة الأنظمة)

  • التدوير: بسحب الفأرة (MouseDown + MouseMove) تُحدَّث الزاويتان _rotX و _rotY. يتم تقييد _rotX بين -89° و +89° لتفادي Gimbal Lock.
  • التكبير/التصغير: بدولاب الفأرة (MouseWheel) تُحدَّث القيمة _zoom ضمن النطاق [0.6 .. 10].
  • اختيار اللون: عند النقر بدون سحب (MouseClick مع _dragOccurred = false) تُستخدم GL.ReadPixels لقراءة لون البكسل المنقور من المنظر ثلاثي الأبعاد.
  • مزامنة قيم اللون عبر الأنظمة: الدالة UpdateAllSystemDisplays(Color c) تحدّث جميع صناديق العرض دفعةً واحدة:
    • RGB مباشرة من الـ Color.
    • HSV, CMYK, LAB عبر ColorMine (RGBtoHSV, RGBtoCMYK, RGBtoLAB).
    • YUV و YCbCr عبر دوال يدوية وفق معادلات ITU-R BT.601 (RGBtoYUV, RGBtoYCbCr).
    • مثال: لون بنفسجي يظهر بآنٍ معاً كـ RGB(120, 80, 200) و HSV(260°, 60%, 78%) وغير ذلك.
  • إعادة ضبط الكاميرا: زر btnResetView يستدعي BtnResetView_Click لإرجاع الزاويتين والتكبير إلى القيم الافتراضية (20°, 30°, 3.5).

الخاتمة

غطّى التطبيق جميع المتطلبات العشرة الواردة في وثيقة الوظيفة:

  • Form1 يوفّر بيئة تحرير الصور وتحويل الأنظمة اللونية والتحكم بالمركبات وتكميم الألوان وعرض المعلومات والحفظ والاستعادة.
  • Form4 يوفّر تجربة تعليمية تفاعلية ثلاثية الأبعاد تُجسّد فكرة المختبر، حيث يستطيع المستخدم رؤية الفضاء اللوني، تدويره، التكبير ضمنه، اختيار لون منه، ومشاهدة قيمه متزامنةً في كل الأنظمة اللونية.

التطبيق يحقّق فلسفة المختبر: تبسيط مفاهيم الأنظمة اللونية عبر التفاعل البصري المباشر بالزمن الحقيقي.

About

No description, website, or topics provided.

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages