التعامل مع الرسم ثنائي الابعاد ـــ الدرس 16 ــ        by emad@deyaa.org

            

الأهداف

ان يعرف المتدرب طرق الرسم للفئة ثنائية الابعاد 
ان يرسم الخطوط 
ان يرسم المستطيلات 
ان يرسم المضلعات 
ان يرسم المتدرب الاشكال البيضاوية 
ان يرسم المتدرب الاشكال بألوان مختلفة 
ان يرسم الاشكال المملوءة والفارغة 

العرض 

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

استاذي العزيز هل تقصد ان هذا الدرس سهل ؟ 

صديقي الكريم المقصود أن الرسم في الجافا سهل وممتع للمبرج والمستعرض معا مثلا رسم الخطوط والمضلعات سهل مثل الدرس السابق عرض النص 

ما اليات الرسم التي نتبعها ؟ 

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

Graphics  وكيف استخدم الفئة 

لكي تستعمل هذه الفئة عليك ان تنشأ كائن يمثل اطار البريمج أحد هذه الكائنات يرسل الى النهج بينت كما في المثال 

public void paint(Graphics screen) {

وتستخدم وسيطة الكائن جرافيك داخل النهج بينت لانشاء كائن رسم ثنائي الابعاد كما في المثال 

Graphics2D screen2D = (Graphics2D) screen;

 ولكن استاذي الكريم كيف احدد مواضع الخطوط وابعادها ؟

لرسم الاشكال والخطوط نستعمل نظام الاحداثيات س , ص [ اكس , واي ] حيث تقع النقطة ذات الاحداثيات ( 0 ، 0 ) في الزاوية اليسرى العليا لاطار البريمج وتزداد قيم س كلما تحركنا يمينا وتزداد قيم ص كلما تحركنا لأسفل 

هل يمكن تحديد قيمة قصوى للاحداثيات س ، ص ؟ 

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

int maxXValue = getSize().width;
int maxYValue = getSize().height;

استاذي العزيز لدينا في هذا الدرس عدة نقاط رئيسية لرسم [ خطوط ، مستطيلات ، دوائر ، مضلعات ] نرى بمن نبدأ ؟ 

الطبيعي ان نبدأ بالخطوط حيث تتطلب عملية رسم الخطوط خطوتين 

الأولى انشاء كائن يمثل الشكل المطلوب 

الثانية استدعاء نهج لكائن رسم ثنائي الابعاد لرسم ذلك الشكل 
java.awt.geom  هذه الحزمة من الفئات تحتوي على كائنات تحدد الاشكال 
وتوجد فئتان لانشاء الخطوط هما 

Line2D.Float 
Line2D.double 

هل يوجد اختلاف بين الفئتين ؟ 

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

draw()  يرسم الشكل فارعا 
 fill( )  يرسم الشكل مملوءا 

public void paint(Graphics screen) {

screen.setColor(Color.magenta);
screen.drawLine(200,110,170,115);
screen.drawLine(170,115,160,90);
screen.drawLine(160,90,150,94);
screen.drawLine(160,90,153,85);
screen.drawLine(160,90,158,83);
screen.drawLine(160,90,163,84);

رسم المستطيلات 

screen.setColor(Color.black);
screen.fillRect(245,65,15,15);

في المثال المذكور الجملة تنشأ مستطيلا مملوء زاويته العليا اليسرى عند الاحداثي ( 245, 65) ويبلغ عرضه 15 وطوله 15 حيث الابعاد المستخدمة البكسل نفس وحدة قياس الاحدثيات 

واليك هذا المثال الاجمالي 

import java.awt.*;

public class Shape extends java.applet.Applet {

public void init() {
setBackground(Color.white);
}
public void paint(Graphics screen) {
// لرسم مستطيل بزوايا مدورة نضع الجملة التالية التي تحدد 
// الاحداثي س لأعلى يسار المستطيل ثم الاخداثي ص لأعلى يسار المستطيل 
// ثم عرض المستطيل وارتفاع المستطيل 
// ثم عدد البكسلات في الاتجاه السيني بعيدا من زاوية المستطيل 
// ثم عدد البكسلات في الاتجاه الصادي بعيدا عن زاوية المستطيل 
// تستخدم هاتان المسافتان لتحديد مكان بداية تدوير زاوية المستطيل 
screen.setColor(Color.red);
screen.drawRoundRect(10,10,size().width-20,size().height-20,15,15);
// تقع الزاوية العليا اليسرى للمستطيل عند الاحداثي ( 10, 10 ) وتبدأ
// استدارة الزاوية على بعد 15 بكسلا من الزاوية الموجودة عند هذه النقطة 
// الاتي رسم مستطيل بزوايا متعامدة 
screen.setColor(Color.orange);
screen.fillRect(100,90,100,100);

screen.setColor(Color.magenta);
screen.drawLine(100,110,70,115);
screen.drawLine(70,115,60,90);
screen.drawLine(60,90,50,94);
screen.drawLine(60,90,53,85);
screen.drawLine(60,90,58,83);
screen.drawLine(60,90,63,84);

screen.setColor(Color.yellow);
screen.fillOval(110,30,60,60);

screen.setColor(Color.green);
screen.fillOval(145,45,5,5);
screen.fillOval(155,45,5,5);

screen.setColor(Color.black);
screen.fillRect(145,65,15,15);

screen.setColor(Color.cyan);
int[] xPoints = { 105, 205, 140, 105 };
int[] yPoints = { 43, 40, 15, 43 };
int points = 4;
screen.fillPolygon(xPoints, yPoints, points);
}
}

 بعد عرض البريمج يكون الناتج كالاتي 



www.deyaa.org