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.
- الواجهة الرسومية: زر
openImageيفتحOpenFileDialog، وعند اختيار صورة يتم تحميلها فيPictureBox(المسمّىScene). - Drag & Drop: تم ضبط
Scene.AllowDrop = trueومعالجة الحدثينDragEnterوDragDrop؛ يُقبل الملف المسحوب فقط إذا كان من نوعDataFormats.FileDrop. - بعد التحميل تُحفظ نسختان:
originalImage— النسخة الأصلية للاستعادة لاحقاً.image— النسخة الحالية التي تُجرى عليها التعديلات.
- يختار المستخدم النظام من
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.
- تم تصميم ست لوحات (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.
- كل تغيير على أي
NumericUpDownيطلق حدثValueChangedمباشرةً، فيُعاد توليد الصورة وعرضها فوراً فيScene. - الحساب يتم على كامل Bitmap باستخدام
GetPixel/SetPixelمع نظام clamping (Math.Max(0, Math.Min(255, ...))) لمنع الفيضان. - راية
isResettingتمنع تكرار الأحداث أثناء عمليات إعادة الضبط.
- يُدخل المستخدم العدد المطلوب في
color_count(النطاق 2 إلى 65536)، ثم يضغطcolor_change. - الدالة
color_change_Clickتستخدم خوارزمية Wu من مكتبةKGySoft.Drawing:var quantizer = OptimizedPaletteQuantizer.Wu(colorCount);
- النتيجة: تُمثَّل الصورة باستخدام لوحة ألوان (Palette) محدودة (مثلاً 4 ألوان بدل 256).
- اللوحة
Image_information_8تستخدم حدث الرسم المخصّصImage_information_8_Paint. - المعلومات المعروضة:
- اسم الملف (File Name) ومساره (Path).
- حجم التخزين بالـ KB.
- أبعاد الصورة (Width × Height).
- الدقّة الأفقية والعمودية (DPI).
- صيغة البكسل (
PixelFormat). - الصيغة الخام للملف (
RawFormat— PNG, JPEG, إلخ).
- زر
resetImageيستدعي الدالةreset_value_sysColor()التي:- تنسخ
originalImageإلىimageوتعرضها فيScene. - تُعيد جميع المركبات الـ18 (RGB+CMYK+HSV+YUV+LAB+YCbCr) إلى القيمة الحيادية 50.
- ترفع الراية
isResetting = trueلتجنّب تنفيذColorSystem_ValueChangedخلال إعادة الضبط.
- تنسخ
- الدالة
save_image_ClickتفتحSaveFileDialogيدعم الصيغ: BMP, JPEG/JPG, PNG, GIF, TIFF, ICO. - يتم استنتاج الصيغة من امتداد الملف، ثم يُمرَّر
ImageFormatالمناسب إلىBitmap.Save(...). - تُعرض رسالة تأكيد عند نجاح الحفظ.
تُفتح هذه النافذة عبر زر button1 في Form1، ويُمرَّر إليها نسخة من originalImage.
- يتم الرسم داخل
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].
- RGB → مكعب الألوان (
- بالإضافة إلى الشكل، تُرسم بكسلات الصورة كنقاط 3D داخل الفضاء اللوني (تُفعَّل بـ
chkShowImageInSpace):- يتم تخزين العيّنات مسبقاً عبر
CachePixelsالتي تستخدمLockBitsلقراءة سريعة، وتُحدّ العيّنات بـ ≈25,000 نقطة فقط للحفاظ على الأداء. - الدالة
MapRGBtoSpaceتحوّل قيمة كل بكسل إلى إحداثيات (x, y, z) ضمن الفضاء المختار.
- يتم تخزين العيّنات مسبقاً عبر
- المحاور الثلاثة (أحمر/أخضر/أزرق) تُرسم دائماً كمرجع بصري.
- التدوير: بسحب الفأرة (
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 يوفّر تجربة تعليمية تفاعلية ثلاثية الأبعاد تُجسّد فكرة المختبر، حيث يستطيع المستخدم رؤية الفضاء اللوني، تدويره، التكبير ضمنه، اختيار لون منه، ومشاهدة قيمه متزامنةً في كل الأنظمة اللونية.
التطبيق يحقّق فلسفة المختبر: تبسيط مفاهيم الأنظمة اللونية عبر التفاعل البصري المباشر بالزمن الحقيقي.