جميع الحقوق محفوظة لموقع ALGameDev.com ولمؤلف هذه المقالة..المقالة موجهة للهواة ولانضمن صحتها الكاملة


بلوحة مفاتيح: عبدالله الشمري

الصفحة الرئيسية

الدرس الثاني : أساسيات الرسم في OpenGL – الجزء الأول .

ALGameDev.com

السلام عليكم .. قد لاتتخيل أن ألعاب على وزن رزدنت ايفل .. و metal gear .. بدأت من نقطة .. هي الحقيقة أخي !! . سنتعلم في هذا الدرس ثلاثة أمور :
  • رسم النقاط والتعرف على نظام الاحداثيات بشكل أكبر
  • تغيير خصائص النقطة مثل حجم النقطة
  • نظام الألوان في OpenGL
  • أولا:رحلة نقطة في الpipeline

    في OpenGL يوجد ما يسمى بال pipeline وهو عبارة عن مخطط لسير العمليات التي يتم اجراؤها على نقطة ( تعريف غير دقيق طبعا وهو من تأليفي  ) .. انظر لهذه الصورة .

    ALGameDev.com

    هذه صورة معقدة .. دعنا نبسطها مع صورة من تأليفي أيضا :) .

    ALGameDev.com

    من خلال هذه الصورة أتمنى تفهم أمرين
  • نصف OpenGL بأن لها State Machine بمعنى أنها تملك مجموعة من البوابات التي تمر عبرها النقاط .. كلما مرت نقطة عبر بوابة تغيرت حالتها ..
  • نستطيع تغيير البوابة الخاصة بحجم النقطة عن طريق الدالة glPointSize ونستطيع تغيير اللون عن طريق glColor وهكذا .. انظر مرة أخرى للصورة التوضيحية .. ستجد ان النقطة بدأت من نقطة الاصل .. وعند مرورها ببوابة الاحداثيات تغيرت احداثياتها طبقا لما هو موجود في هذه البوابة .. ثم انتقلت الى بوابة تغيير حجم النقطة وتغير حجمها طبقا لما هو موجود في هذه البوابة .. ثم انتقلت لبوابة الالوان وتغير أيضا لونها .. النتيجة النهائية على الشاشة
  • اذا نستنتج أن مهمتك هي تغيير حالة كل بوابة .. لذلك ندعو هذه الطريقة .. بالطريقة الثابتة fixed .. فانت أمامك مجموعة من الحالات عليك تغييرها .. هذه الطريقة تغيرت مع OpenGL 2.0 .. مثال :
    اذا أردت رسم نقطة حمراء ثم نقطتين خضراء ثم نقطة حمراء فقم بالتالي :
    glColor(255,0,0);// تغيير الى اللون الاحمر
    DrawPoint();
    glColor(0,255,0);//تغيير الى اللون الاخضر
    DrawPoint();
    DrawPoint();
    glColor(255,0,0);// تغيير الى اللون الاحمر
    DrawPoint();
    
    أتمنى أن تكون استوعبت طريقة عمل OpenGL .

    الرسم في OpenGL

    اذا أردت أن ترسم في OpenGL فيجب عليك استخدام الدالتين الشهيرتين glBegin و glEnd .. هكذا
    GL11.glBegin(GL11.GL_POINTS);
    GL11.glVertex2f(10 , 20 );
    GL11.glEnd();
    
  • نبدا أولا بتحديد طريقة الربط بين النقاط .. نحن نريد استخدام النقاط GL_POINTS
  • ثم نرسم الرؤوس vertex عن طريق الدالة glVertex2f والتي تطلب منك احداثيات النقاط
    glVertex2f( float x ,float  y);
    glVertex2i( int x ,int y );
    glVertex2d(double x,double y);
    glVertex3f(float x,float y,float z);
    glVertex3i(int x,int y, int z);
    
    اذا تلاحظ وجود أكثر من صيغة لهذه الدالة .. النتيجة واحدة .. الفرق هو بنوع البيانات أما عدد صحيح أو كسري .. والاحداثيات اما ان تطلب الاحداثي السيني والصادي . . أو الاحداثي السيني والصادي وعمق النقطة .. اذا اردت رسم نقطة في عالم ثلاثي الابعاد .. الان نريد التركيز على رسم نقاط في عالم ثنائي الابعاد.. لاحظ أن هاتين العبارتين متساويتين
    glVertex2f(20,20);// تقوم المكتبة تلقائيا بجعل قيمة اخر بارمتر بالصفر
    glVertex2f(20,20,0);// هنا أنت من يحدد قيمة اخر بارمتر
    
  • يجب أن تكون تضع الدالة glVertex داخل glBegin و glEnd
  • تستطيعان تحدد حجم النقطة عن طريق الدالة glPointSize ولكن لاحظ أنه يوجد مجال محدد من القيم .. وهذا يعتمد على كرت شاشتك
  • نظام الألوان

    الدالة المسؤولة عن تغيير لون النقاط هي الدالة glColor وتأخذ عدة صيغ :
    glColor3f(r , g, b);
    glColor4f(r, g, b, a);
    glColor3ub(r,b,g);
    glColor4ub(r,g,b,a);
    
  • اللون يتركب من مجموعة من الالوان الثلاث ( الاحمر – الازرق – الاخضر) وبجمع هذه المركبات الثلاث ينتج لنا ملايين الالوان
  • ممكن تمرر أربعة بارمترات .. أحدها تمثل قناة ألفا alpha وهي تستخدم للشفافية .. وستعرف عنها في دروس قادمة بحول الله
  • اذا استخدمت الدالة glColor3f فان هذا يعني أن تكون قيمة كل بارمتر بين 0 و ا .. أما اذا استخدمت النوع glColor3ub فان كل بارمتر يأخذ قيمة من 0 الى 255 .. النتيجة واحدة وأنت اختر ما تحب
  • ALGameDev.com

    مثال

    بعد أن توضح لك بعض الأمور خذ هذا المثال الشامل باذن الله .
    /*
    *الهدف من هذا البرنامج هو رسم نقاط بألوانها وحجمها
    */
    
    import org.lwjgl.input.Keyboard;
    import org.lwjgl.opengl.*;
    import org.lwjgl.opengl.GL11;
    
    public class OpenGL_02 {
    
      public static void main(String[] args) {
    
    //------------------------- Init + Create Frame (Firstly) --------------------------
       Display.setTitle( "My Game");
    
       try
       {
           Display.setDisplayMode(new DisplayMode(400, 400));
       }
       catch(Exception a)
       {
           System.out.println(a);
    
       }
    
       try
        {
        Display.setFullscreen(false);
        }
       catch(Exception e)
        {
            System.out.println(e);
    
        }
    
       try
        {
        Display.create();
        }
       catch(Exception e2)
        {
            System.out.println(e2);
        }
    
     //------------------------- Render + Input (Processing )  --------------------------
       boolean finished = false;
    
        while (!finished) {
    
          // Check for close requests
          if (Display.isCloseRequested()) {
    	finished = true;
          }
    
          if (Keyboard.isKeyDown(Keyboard.KEY_ESCAPE))
                  finished = true;
    
    
        GL11.glClear(GL11.GL_COLOR_BUFFER_BIT );
    
         // تحديد لون النقطة
        GL11.glColor3f(1,0.5, 0);
        // تحديد حجم النقطة
        GL11.glPointSize(2);
        GL11.glBegin(GL11.GL_POINTS);
             GL11.glVertex2f(100, 100);
            GL11.glVertex3f(250,250,0);
       GL11.glEnd();
    
        GL11.glPointSize(5);
        GL11.glBegin(GL11.GL_POINTS);
            //تغيير اللون الى اللون الاصفر
            GL11.glColor3ub((byte)255,(byte)255,(byte)0);
            GL11.glVertex3f(200,220,0);
        GL11.glEnd();
    
    
    
    
        Display.update();
    
    
        }
     //------------------------- Release ( Finally )  --------------------------
        Display.destroy();
        System.exit(0);
      }
    
    
    }
    
    لايوجد ما أضيفه .. كل ما تحتاج أن تتقنه هو نظام الاحداثيات كما شرحناه في الدرس السابق .. ونظام الالوان والرسم البسيط في OpenGL .


    الصفحة الرئيسية