الفريق العربي للبرمجةأرشيف المنتديات · 2000 – 2023
نسخة أرشيفية للقراءة فقط — التسجيل والمشاركة مغلقان، والمحتوى محفوظ كما كان.

OpenGL .. الدرس رقم 2

مغلق
بدأه AlDeaj في 11 سبتمبر 2004 · 15 رد · 8,092 مشاهدة · في OpenGL
مشاركة: واتساب X فيسبوك تيليجرام
#1 صاحب الموضوع

الدرس السابق

OpenGL .. الدرس رقم 1

تعريف بالدرس ..

lesson03.jpg

في الدرس السابق تعلمنا كيفية رسم كل من المثلث والمربع في هذا الدرس سوف نتعلم كيفية اضافة الالوان لهما.

Flat coloring هو وصف التلوين الذي سوف يضاف الى المربع ويتم فيه اضافة لون واحد فقط إلى المربع

Smooth coloring وصف التلوين الذي سوف يضاف الى المثلث ويتم فيه اضافة لون لكل نقطه تلتقي بها اضلاع المثلث اي اننا سوف نضيف 3 ألوان .

سوف نقوم باستخدام كود الدرس السابق .. لذا لابد من ان تكون قد تابعت وفهمت الدرس السابق حتى تكمل هذا الدرس .. سوف أقوم بوضع الكود ومن ثم شرحه .. بسم الله نبدأ ..

الدرس ..

int DrawGLScene(GLvoid)
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glLoadIdentity();
glTranslatef(-1.5f,0.0f,-6.0f);	
glBegin(GL_TRIANGLES);

هذا الكود موجود في الدرس السابق لم نقم بتغيير أي شي منه

glTranslatef يوضح مكان المثلث على الشاشة ولتفصيل أكثر راجع الدرس السابق

glBegin(GL_TRIANGLES)يقوم بإنشاء المثلث

glColor3f(1.0f,0.0f,0.0f);
glVertex3f( 0.0f, 1.0f, 0.0f);

هنا نضع أول سطر من الكود المضاف

السطر الأول قمنا باضافته للمره الاولى وهو لوضع اللون للنقطة العليا للمثلث .. نقوم بوضع هذا الكود قبل كل نقطه من نقط المثلث التي رسمناها في الدرس السابق حتى نقوم بتلوين تلك النقطه باللون الذي نريد .

glColor3f يقوم بوضع الألوان

المتغيرات الثلاث بعد glColor3f هي ترتيبا تعبر عن الألوان الأحمر ، الأخضر والأزرق .. تكون قيمة تلك المتغيرات من 0.0f إلى 1.0f وكما شرحنا في "الدرس رقم صفر" فإنه كلما اقتربنا من 0.0f يكون اللون داكن وكلما اقتربنا من 1.0f يكون اللون فاتح ( مع العلم بانه في حالة وضع القيمة 0.0f في بارامتر اللون الأحمر فاننا لانحصل على لون فيكون اللون أسود لان القيمه تساوي صفر بينما اذا وضعناها 0.1f مثلا سوف يكون اللون أحمر داكن وكذلك بالنسبه لبارامتر اللون الازرق والاخضر ).

في السطر الأول من الكود السابق لدينا قيمة كل من بارامتر اللون الأخضر والازرق تساوي صفر بينما قيمة بارامتر اللون الأحمر تساوي واحد (وهذي القيم هي للنقطه العليا من المثلث وليس لكامل المثلث ) لذلك سوف نحصل على اللون الأحمر للجزء العلوي من المثلث .

السطر الثاني من الكود يعبر عن مكان تلك النقطه على الشاشة وقد تم شرحها بالتفصيل في الدرس السابق

glColor3f(0.0f,1.0f,0.0f);
glVertex3f(-1.0f,-1.0f, 0.0f);

الآن قمنا بوضع قيمة اللون الأخضر تساوي واحد وهذا اللون سوف يظهر في الجزء الأيسر السفلي من المثلث كما هو موضح من السطر الثاني

glColor3f(0.0f,0.0f,1.0f); 
glVertex3f( 1.0f,-1.0f, 0.0f);
glEnd();
glTranslatef(3.0f,0.0f,0.0f);

السطر الأول من الكود السابق تم فيه وضع قيمة كل من البارامتر الأحمر والأخضر تساوي صفر وقيمة البارامتر الأزرق تساوي واحد أي اننا سوف نحصل على اللون الأزرق للنقطه الثالثة من المثلث والتي موجودة كما يشرح السطر الثاني في الجزء الايمن السفلي من المثلث

السطر الثالث يقوم بإخبار البرنامج بأننا انتهينا من رسم المثلث

السطر الرابع يقوم بنقلنا الى الجهة اليمنى من الشاشة بمقدار 3 حيث المكان الذي قمنا برسم المربع به .

لاحظ اخي القارئ بعد تطبيق الدرس نقطه تجمع الالوان وتداخلها وكيف انها تعطي ألوانا جديدة .. تلك هي الطريقة الي تستخرج بها جميع الألوان عن طريق مزج الألوان الثلاثة ( الاحمر – الاخضر – الازرق )

glColor3f(0.5f,0.5f,1.0f);
glBegin(GL_QUADS);
glVertex3f(-1.0f, 1.0f, 0.0f);
glVertex3f( 1.0f, 1.0f, 0.0f);	
glVertex3f( 1.0f,-1.0f, 0.0f);
glVertex3f(-1.0f,-1.0f, 0.0f);
glEnd();
return TRUE;	
}

الآن وبعد ان قمنا بتلوين المثلث ب 3 الوان سوف نقوم بتلوين المربع بلون واحد .. لا نحتاج هنا ان نقوم بوضع سطر لكل نقطه من المربع بل يكفي ان نقوم بوضع اللون مرة واحدة في البداية وسوف يظهر على المربع بكامله .

ان اردنا ان نضع اكثر من لون كما فعلنا في المثلث فسوف نقوم بنفس العمل السابق في المثلث حيث نقوم بوضع لون لكل نقطه من نقاط المربع

في الكود السابق قمنا بوضع اللون الازرق كما هو واضح من القيمة 1 للبارامتر الازرق

ووضعنا قيمة كل من البارامتر الاخضر والاحمر يساي 0.5 وبتغييرها سوف نحصل على درجات الازرق المختلفة ( قم بتغييريها ولاحظ التغير في اللون الازرق )

السطر الثاني يخبر برنامجنا باننا بصدد انشاء مربع

من السطر الثالث إلى السادس يوضح نقاط المربع ومكانه على الشاشة وقد قمنا بتفصيلها في الدرس السابق

السطر السابع يخبر برنامجنا باننا انتهينا من رسم المربع

السطر الثامن يخبر البرنامج باكمال عمله والانتقال الى الخطوة التالية

if (keys[VK_F1])
{
keys[VK_F1]=FALSE;
KillGLWindow();
fullscreen=!fullscreen;
if (!CreateGLWindow("NeHe's Color Tutorial",640,480,16,fullscreen))
{
return 0;
}

هذا الكود موجود في الدرسين السابقين ولم يتم تغيير سوى الرسالة التي ستظهر في قمة المشروع title

الكود المصدري للدرس

الدرس الأصلي لمن أراد الاطلاع

إلى هنا انتهى درسنا .. بإنتظار الاسئلة ( إن وجدت ) :)

رابط الدرس الثالث :

/index.php?showtopic=47120

أسألكم الدعاء

علي الدعيج

AlDeaj@Gmail.Com

برمجة الجرافيكس والألعاب والوسائط المتعددة

=====================================

لقد توفي اخيكم على الدعيج ثالث ايام عيد الفطر 1425 ... ادعو له بالرحمه والمغفره ... إدارة المنتدى .

=====================================

#2
اقتباس
بإنتظار الاسئلة ( إن وجدت )
اقتباس

:) حظك حلو هى موجودة طبعا ومن المرة السابقة ولكن انتظرت فقد قلت ربما يكون الرد عن سؤالى فى هذا الدرس (انا خزنته عندى لأقرأه بالتفصيل لسه) هو كان عن بناء المجسمات اقصد المرة السابقة كان الاساس ولكن هل يمكننا ان نعقد الرسم شويه فى هذه المرحلة ام ننتظر قليلا؟

#3

دكتور محمد

لا أعتقد ان أخذ التعقيدات في الرسم مناسبا الآن

نحن الآن نقوم بشرح الاساسيات وقريبا ان شاء الله سوف ندخل في أعماق OpenGL ولكن يجب ان نسير خطوة بخطوة :)

قرأت في أحد المرات بأن السبب الرئيسي لعدم فهم البعض هو (القفز) من درس مبتدئ إلى آخر متقدم فيجد نفسه ضائعا ويكره المادة المراد دراستها ويبتعد عنها

فأهم شيء لدينا الآن هو التدرج في الدروس حتى لاتحصل قفزات مفاجئة للقارئ تضيع تركيزه وادراكه

يكفينا الآن معرفة الاساسيات والتي ستكون أساسا لفهمنا لباقي الدروس

تريد التعقيد دكتور محمد ؟ انتظر حتى نتعمق ولك ماتريد :)

أما الآن فان الوقت لم يحن بعد واكرر مرة اخرى لا للقفزات المفاجئة ونعم للتسلسل :)

لك تحياتي وتقديري

برمجة الجرافيكس والألعاب والوسائط المتعددة

=====================================

لقد توفي اخيكم على الدعيج ثالث ايام عيد الفطر 1425 ... ادعو له بالرحمه والمغفره ... إدارة المنتدى .

=====================================

#4

معك حق اخى على التسلسل مطلوب :)

فقط كانت عندى محاولات حماسية ولكن بالتدريج يمكن الوصل ان شاء الله :)

#5

السلام عليكم ,,

ممتاز جدا ,, والدرس واضح هذه المرة ,,

في ال Direct3D ,, نعبيء معلومات السموت في بنية بيانات ,, لكننا نحن من يعرف كيف ستتوضع هذه السموت في النية طبع بتعريف البنية struct ,, ونمرر طريقتها فقط لدالة ال CreateVertexBuffer ,, وبعده يبدأ المرح !!

استمر ,, لأننا مشتاقون للدسم أنا ودكتور محمد :)

banner_60_468.gif

NOTHING IS IMPOSSIBLE

#6

شكرا على ردك دكتور محمد

الحماس مطلوب وان شاء الله يدوم

:)

شكرا على ردك استاذي HGB

هل تعني بكلمة سموت vertex ?

ان كان ذلك ماتعنيه فقد ارحتني من عناء البحث عن ترجمة عربية لتلك الكلمة .. منذ 6 ايام ابحث ولم أجد لها معنى عربي

:)

برمجة الجرافيكس والألعاب والوسائط المتعددة

=====================================

لقد توفي اخيكم على الدعيج ثالث ايام عيد الفطر 1425 ... ادعو له بالرحمه والمغفره ... إدارة المنتدى .

=====================================

#7

هاهاه ,, فعلا مصطلحات التعريب قد تكون متعبة ,, وهذا المصطلح من مصطلحات مايكروسوفت الرسمية للتعريب ,, واذا كانت هناك مشكلة كبيرة في المصطلحات سأحاول سردها باللغة العربية واللغة الأم ,, مع شرح مبسط لها ,,

مثلا ال BackBuffer ,, هو المكدس الخلفي ,,

وال Culling هي الغربلة !!

ال Normal وهو العمودي بالعربية هو الناظم ,,

وهكذا ,,

لكن بالطبع مع بتفصيل بسيط مع شرح ,,

ويصبح كقاموس ,, بس شوية علي ,,

banner_60_468.gif

NOTHING IS IMPOSSIBLE

#8

BackBuffer و FrontBuffer

تلك الاسماء تعقدني :)

مافهمته انها ذاكرة خلفيه واماميه احدهما تظهر ماعلى الشاشة والاخرى تهيء ماسيظهر ويتم التبادل بينهما swap عن طريق IDirect3DSwapChain9 وتسمى العملية Presenting

في الحقيقة تلك المصطلحات تخيفني وهي السبب في تركي لدايركت اكس :)

لاحظت استاذي HGB في ردك الأول عبارة مهمة

اقتباس
ممتاز جدا ,, والدرس واضح هذه المرة ,,

الدرس واضح هذه المره .. هل كان في المرات السابقة غير واضح ؟

رأيك يهمني جدا

انتظر الرد استاذي

:)

برمجة الجرافيكس والألعاب والوسائط المتعددة

=====================================

لقد توفي اخيكم على الدعيج ثالث ايام عيد الفطر 1425 ... ادعو له بالرحمه والمغفره ... إدارة المنتدى .

=====================================

#9

مارأيك أني أول مرة أسمع بال IDirect3DSwapChain9 هذه أصلا ,, لأن في ال DirectX7 عندما بدأت كانت تستدعى دالة بسيطة اسمها Flip ,, للقلب Swapping ,, والعملية تتم بصورة آلية في Direct3D 8 و 9 كما لاحظت ,, حيث لم أقابل أي كود حتى الآن للتحكم في عمليات القلب ,, لأنها من اختصاص DirectDraw وليست من اختصاص Direct3D ,, وال DirectDraw في Direct3d7 كان يجب أن نبتديء به لكي ننشيء منه كائن Direct3D ,, باستدعاء الدالة QueryInterface كما في استدعاءات ال Com العادية ,,

لكن حاليا في 8 و9 فقط باستدعاء دالة بسيطة وهي Direct3DCreate9 ,, وتنشيء كل شيء دون الخوض في تفاصيل DirectDraw والحمد لله :huh: ,, وهذه نعمة كبيرة جدا ,,

يمكن انشاء مكدسات ثلاثية ,, لتسريع التصيير والعرض بشرط امتلاك ذاكرة AGP كافية لتحميل الثلاثة مكدسات في وقت واحد ,,

سنمر على هذا لأمور باذن الله بعد أن نقحم أنفسنا فيها وسنتعلمها بالقوة ان شاء الله ,,

وبالنسبة لقولي أن الدرس واضح هذه المرة فما قصدت هو أنه واضح لمن لم يتعامل مع هذه الأمور قبلا ,, غير ذلك الدرس أقصر من غيره بكثير ,, ولايركز الا على مفهوم واحد جديد ,, ليس كالدرسين الأوائل حيث فيهم الكثير جدا من المفاهيم الجديدة ,, لكن هذه حال الجرافيكس عموما وكل التقنيات الجديدة ,,

وأذكر أني تعقدت من DirectX7 ,, عندما بدأت تعلمها من كتاب معرب ل Microsoft ,, وكانت المصطلحات ترعبني ,, العربية والانجليزية كلهم مرعب ,, ودعك من الفصل الأول في الكتاب الذي كان يتحدث بالتفصيل عن كيفية ترقيم الأجهزة الموجودة عندك ,, بدأ بكرت الشاشة وكل أجهزة العرض التي يدعمها كال Refernce Rastrizer وال HAL وال TnLHAL ,,

وعمليات الترقيم بال Enumrinator كانت تتم باستدعاء دوال CallBack ,, لأول مرة في حياتي كنت أسمع بها ,, لذا أصبت بصدمة ,, وتأخرت كثيرا حتى خرجت للواقع :)

الحمد لله ,,

banner_60_468.gif

NOTHING IS IMPOSSIBLE

#10
اقتباس
مصطلحات مايكروسوفت الرسمية للتعريب

هو منين نلاقى هذه المصطلحات التعريبية اخى هيثم؟

عن موضوع وضوح الدرس اخى على ، هو فعلا يعتبر اقصر الدروس ومعتمد على خلفية سابقة فسيصير اسهل :) (انا ما تعقدتش من directx لسه لأنى ما وصلت فيها الى شئ مهم حتى الان ولم اعرب منها كلمة واحدة حتى لا اتعقد :) )

#11

المصطلحات الرسمية أنا أجدها فقط في الكتب ,, لكن لم أسمع بلستة أو ماشابه ذلك أو Reference كامل يحوي المصطلحات المعربة ,,

لذا المرجع الوحيد أعتقد أنه الكتب ,,

...........

ويا دكتور محمد بالنسبة لل OpenGL ,, ليست بالضرورة أسهل ,, لكنها مباشرة في برامجها ,, وتعتبر أسهل في التطبيقات الصغيرة والابتدائية لأن بنيتها أصلا مصممة كدوال API ,, وليست كال directX المبنية في الأصل على الكائنات Classes ,, المبنية على الواجهات Intrfaces الموجودة أصلا في مكونات COM ,, فكل شيء في DirectX عبارة عن Class ,, لذا قد يبعد الكثيرين عنه لأنه يحتاج لعمل اضافي ,,

لكن الحصيلة على البرامج الكبيرة التي تحتاج لتقسيم , أو حتى كتابة محرك ألعاب ايتداء من ال DirectX ,, سيكون أسهل ,, لأنه يمكن أن نغلف وأن نرث من فئة DierctX موجودة أصلا , حيث لايمكن فعل ذلك مباشرة مع OpenGL سوى بالتغليف الطبيعية لدوال ال API داخل فئات جديدة ُ,, ولايمكن أن نرث من فئات OpenGL المصممة مسبقا ,,

banner_60_468.gif

NOTHING IS IMPOSSIBLE

#12

بارك الله فيك اخي علي الدعيج على هذه الدروس.

39_22.gif

تزود من التقوى فإنك لا تدري *** إذا جن ليل هل تعيش إلى الفجر

فكم من فتى أمسى وأصبح ضاحكاً *** وقد نسجت أكفانه وهو لا يدري

لقراءة القرآن الكريم و سماعه و تفسيره ........

ماذا يعني انني مسلم سني؟

قصة غريبة

ConflictResolution.gif

#13
اقتباس
بالنسبة لل OpenGL ,, ليست بالضرورة أسهل

فهمت المقصود اخى هيثم :) وهذا يذكرنى بأشياء كثيرة من هذا القبيل اى انه لا توجد تقنية او لغة برمجية حتى تميزت فى كل شئ ولم تجد لها نقطة ضعف حتى المصادر المفتوحة واتذكر الاكواد التى كتبها الاخ jaas كمثال للعمل فى الويندوز واللينوكس فمرة تكون معقد خلال الويندوز ومرة اسهل مثلا فى الاتصالات من جانب لينوكس :) ولكن ارجو الا تفهمونى خطأ وتظنونى اشكك فى قدرة اى لغة او تقنيه مهما كانت ..

تم تعديل هذه المشاركة بواسطة anwarica في 14 سبتمبر 2004 في 20:29

#14

شكراُ لك اخي على الدرس شرح ولا اروع

اعذرني على التاخير بسبب السفر

عيني على الدرس القادم :)

#15

دكتور محمد وأستاذ هيثم

شكرا على اثرائكم الموضوع بهذا النقاش

:)

أخي عماد الخليل

شكرا على مرورك وتكرمك بالرد

:)

أخي Celeron

افتقدتك في الدرس السابق :)

حمدلله عالسلامة

شكرا على مرورك وتكرمك بالرد

لكم تحياتي وتقديري

:)

برمجة الجرافيكس والألعاب والوسائط المتعددة

=====================================

لقد توفي اخيكم على الدعيج ثالث ايام عيد الفطر 1425 ... ادعو له بالرحمه والمغفره ... إدارة المنتدى .

=====================================

#16

الله يرحمك يا اخي المسلم اثشالله الجنه لك ولنا بارك الله فيك

هذا الموضوع مغلق.

مواضيع مشابهة