Ee364 ADVANCED PROGRAMMING شرح كآمل ومفصل وبالاكوآد

[most_uniQue]

Layout

هو الي يقول للجآفآ وين يحط المكونات وفي اي محتوى فريم او بنل
وجآفآ عرفت الـ Layout خآصه فيها وتقدر تستخدمها
و وضعت لكل كلآس محتوي Layout خاص
(البنل له layout و الفريم له Layout مختلف عنه )
تقدر تغيرها او تلعب فيهاانوآعه كثيرهـ


في برنآمج رآئع لفهم المصطلح وهو

GuiGenie

رآح تدرس نوعين بـ تعمق و وآحد على خفيف :)

اول Layout

هو Flow Layout وهذآ يخلي المكونآت مرصوصه من اليسار الى اليمين لها واذا خلصت المساحه راح ينزل للصف الثاني ويرص من اليسار الي اليمين
مع اختلاف الاطوال والعرض المتاحه


Fig 1


Fig 2


Fig 3


Fig 4

هذآ layout هو الافتراضي في البنل
يعني لو عرفت عشره ازارر او ليبل واضفتها في البنل راح تلاقيها بنفس النظام هذا
مرصوصه من اليسار الي اليمين


ثآني Layout

هو Border Layout وهذآ يخلي المكونات عبآره عن شمآل وجنوب وشرق وغرب
* تقدر تحذف اي جزء منهآ يعني تشيل الشمآل وتخلي الباقي
مع اختلاف الاطوال والعرض المتاحه


Fig 5


Fig 6
* حذفنا الشرق والجنوب


Fig 7


Fig 8

دآخل الغرب west حطينآ Border Layout داخله ، صار عندنآ اثنين Border Layout داخل بعض

*
تقدر تخلي Border Layout ، ويكون الشمآل فيه عبآره عن ازرآر من اليسآر الى اليمين (Flow Layout)

تدخل الاثنين في بعض عشآن تستفيد منهـآ

[gentle man]

الى مزيد من الإبدااع...

جزاك الله خيراآ

عندي اقتراح وازا منت حابب تعملو انا ممكن اعملو ليش ما تطرح الموضوع على الجفري صدقني راح تستفيد انت والشباب راحين يستفيدو كتير ...

اقلها يحطك بدل سؤلات كتيرات >>مظفر

[most_uniQue]

المشاركة الأصلية كتبت بواسطة gentle man الى مزيد من الإبدااع... جزاك الله خيراآ عندي اقتراح وازا منت حابب تعملو انا ممكن اعملو ليش ما تطرح الموضوع على الجفري صدقني راح تستفيد انت والشباب راحين يستفيدو كتير ... اقلها يحطك بدل سؤلات كتيرات >>مظفر

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

انا الاهم عندي انها توصل للطلاب ويلآقون لهم مرجع

مآ ضيعنآ الا مظفـر ، ما عمرهآ صآرت استآذ المعمل ما يعرف للمآدهـ ، بس ما قصر الدكتور يسوي شغلة وشغل المعمل ، الله يحفظه

[most_uniQue]

Layout Implementation

لاهمية الموضوع رآح آطول فيه شويتين

لما ابغا احدد Layout استخدم الميثود
setLayout
واضع بين القوس النوع الي ابغاه


Flow Layout

زي ما عرِفنا انه الكلاس الافتراضي للبنل فلو يعني ما اقول للبنل

 setLayout(new FlowLayout())

ولكن لما ابغآ احط
FlowLayout
في فريم لازم اعرَفه

setLayout(new FlowLayout())

ليش ؟ لان الفريم الافترآَضي فيه
Border Layout
واذا ابغا اغيرها الى فلو ، فـ لازم احط الميثود لاني غيرت الافتراضي البرودر الي الشكل الجديد
الفلو
~

Panelاستخدآمه في

import java.awt.*;
 import javax.swing.*; 
public class FlowLayoutDemo{  
public static void main(String[] args) {     
 JFrame frame = new JFrame("FlowLayout Demo");         
JButton btn1 = new JButton("Button 1");      
 JButton btn2 = new JButton("Button 2");   
 JButton btn3 = new JButton("Button 3");     
 JButton btn4 = new JButton("Button 4");        
 JButton btn5 = new JButton("Button 5"); 
  // FlowLayout is default for JPanel
    JPanel panel = new JPanel();         
// add buttons to the panel      
 panel.add(btn1);       
panel.add(btn2);         
panel.add(btn3);         
panel.add(btn4);         
panel.add(btn5);     
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);   
 frame.setSize(300,150);     
frame.getContentPane().add(panel);     
frame.setVisible(true);     } }

نتيجة البرنامج



احنآ عشان اضفنا الازرار في البنل راح يتبع الـ فلو
ورص الازرار من اليسار الي اليمين الين ما خلصت المساحة عليه
ونزل للصف الي تحت ورص ثاني
هنآ ما احتآج استخدم الميثود
setLayout
لاني استخدم البنل والفلو هو الافتراضي لها


Frame استخدآمة في
~

import java.awt.*;
import javax.swing.*;

public class JFrameExample {
public static void main(String[] args) {
 JFrame frame = new JFrame("FlowLayout in Frame"); 
 frame.setSize (400, 150);
//setting the wanted Layout
frame.setLayout(new FlowLayout()); 

frame.add(new JButton("Button 1"));
frame.add(new JButton("Button 2"));
frame.add(new JButton("Button 3"));
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); 
frame.pack();
 frame.setVisible(true);
  }
}

هنآ غيرنا طريقة العرض للفريم من بوردر الى فلو
فـ استخدمنا

setLayout(new FlowLayout())

عشان يرص الازرار من اليسار لليمين

* جرب شيل سطر الميثود
setLayout
من البرنامج شوف ايش راح يتغير

[most_uniQue]

Layout Implementation


Border Layout

زي ما عرفنا فوق ان بوردر لاي اوت يعرفها الى خمس مناطق ، شمال وجنوب وشرق وغرب و وسط

كل منطقه منها تحتوي مكون وآحد يعني تقدر تحط زر في الشمال
بس ما تقدر تحط زرين في الشمال مره وآحدهـ .

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

الفكره شبيهه للصورة هآذي



عشآن كذآ طريقة العرض هاذي مفضله للمبرمجين

كذآلك عند اضآفة المكونات يجب اعطائها المنطقة الي تبغا تضيف فيها مو زي الفلو .

Program ~

import java.awt.*;
import javax.swing.*; 
public class BorderLayoutDemo {
 public static void main(String[] args) {     
JFrame frame = new JFrame("BorderLayout Demo"); 
JButton btn1 = new JButton("North");        
JButton btn2 = new JButton("South"); 
JButton btn3 = new JButton("East");       
JButton btn4 = new JButton("West");
JButton btn5 = new JButton("Center"); 

    JPanel panel = new JPanel();
// set the layout for the panel
panel.setLayout(new BorderLayout());
 // add buttons to the panel
panel.add(btn1,BorderLayout.NORTH);        
panel.add(btn2,BorderLayout.SOUTH);          
panel.add(btn3,BorderLayout.EAST); 
panel.add(btn4,BorderLayout.WEST);
panel.add(btn5,BorderLayout.CENTER);     
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);     
frame.getContentPane().add(panel);      
frame.setVisible(true);
 } }

لان البنل الـ لآي اوت حقهآ هو الفلو لاي اوت
عشآن نغيره الى بوردر لاي اوت لازم نستخدم الميثود

setLayout(new BorderLayout());

ولاحظ ايضآ اعطآئننآ المكان المحدد عند اضافة المكونات

panel.add(btn1,BorderLayout.NORTH);        

عند التعامل مع الفريم لا نحتاج استخدام ميثود
setLayout
لان البوردر لاي اوت هو طريقة العرض الافتراضيه ونضيف المكون الي نبغاها براحتنا مع اعطاءة المكان المناسب ، سهلة ما يحتاج تتسوى

[most_uniQue]

Notes in Layout

Flow Layout

سهل الاستخدآم يحسب مكان المكونات باستمرار مع وضع 5 بيكسل فراغ بين المكونات
لمحآذة المكونات

FlowLayout.LEFT,
FlowLayout.CENTER (the default),
FlowLayout.RIGHT

يمكن تستخدم حقت اليمين واليسار في ازرار ok and cancel
من عيوبه انه يخلي المكونات على اصغر ما يمكن ولا يحترم الحجم الي وضعته لها


دآئم الـ Frameيرجع لاصله اذا تغير حجمة حنشوف الشي ذآ بالصـور بتوضح اكثر
هآذي صورة لبرنآمج الـ Flow Layout ولكن بثلآث ازرآر مو خمسه



زي ما قلنا مع الـ Flow Layout تنرص المكونات من اليسار الى اليمين لين ما تخلص العرض وينزل لتحت
تبغى تتآكد ؟ كبر العرض شوف يبقى تحت ولا يطلع فوق

طلع فوق بعد ما لقيله مسآحه !

الـ Flow Layout غير مفضل للمبرمجين ما يعطيك تحكم بالمكونات زي البوردر ، ولكن مفيد لفهم الكونسبت

Border Layout

عدلت شوي ببرنآمج البوردر الي كآن فوق



لو افترضنا هذآ البرنامج يطلب منك الاسم مثلا ، شوف لما تغير الاحجام

تغير العرض

الشمآل والجنوب والوسط تغيرت فقط !

تغير الطول

الغرب والشرق والوسط تغيرت فقط !

هآذي المعلومات مهمه لما بتصمم برنامج ، ما ينفع تصمم برنامج يكون شكله ملخبط

[most_uniQue]

Notes in inheritance

اتوقع كآنت جزء من مآده EE202

مبدأ الورآثة هي علآقة بين كلآسـين بحيث يرث الابن من الاب موآ ..

ولغة الجآفآ ليست ككل اللغآت فهي تسمح بالورآثه من كلآس وآحـد فقط

كيف نستفيـد منهآ في درآستنـآ
//
الجآفآ فيهـآ ميـزة لا تتوآجد في بآقي اللغآت الى وهي Garbage collector(القمآمه)
ايش فآيدته ؟ انه كل شي عرفتة ولم تستخدمة يشيله من الذآكره ،

بآقي اللغآت كـ ++C وغيرهآ مآفيهـآ الميزة ذي يعني رآح تحجز امآكن زآيدهـ وانت ما تستخدمهـآ ويصير البرنآمج بطيئ لآمتلآء الذآكره بآ اشيآء زيآدهـ

فـ لا تعرَف شي لاستخدآم الميثود حقته ، اذا كنت تقدر توصلها بطريقه افضل

لكن في المستوى الدرآسي لك الآن ما يحتآج تتعب نفسك بالذآكرهـ ، لكن اتبآع فكرة الورآثه يجعل برنآمجك محترف وسريع

كيف نستفيد منهـآ في تطبيقآتنا للـ GUI

خلينآ نآخذ البنل مثلآ ، البـنل لازم تضيفه الى Container ليظهر واعتبرنآ الـ JFrame هي الشآشه لازم نضيف فيه كل البنل

وفي كل مره انشآءنآ Object من الـ JFrame
عشآن نحط فيه البنل وعشآن ايضآ استخدم الميثود حقته مثل
frame.setDefaultCloseOperation
frame.pack
frame.setVisible

ليش كل مره انشئ الـframe Object عشآن استدعي الميثود مآ احتآج انشآءهآ
اقدر استخدم الورآثة واخلي البرنآمج افضل واحترآفي

شوف البرنآمج Border Layout مع استخدآم مبدأ الورآثه

[most_uniQue]

inheritance Implementation

بعد استخدآمه في برنآمج الـبوردر لاي آوت ، كذآ بيصير

import java.awt.*;
import javax.swing.*;

1 class InheritanceBorderLayout extends JFrame {
    /
     * Constructor for the class 
     */

2 public BorderLayoutDemo() { 
3      JButton north  = new JButton("North");
4        JButton east   = new JButton("East");
5        JButton south  = new JButton("South");
6        JButton west   = new JButton("West");
7        JButton center = new JButton("Center");
8        JPanel panel = new JPanel();
9         panel.setLayout(new BorderLayout());
10       panel.add(north , BorderLayout.NORTH);
11        panel.add(east  , BorderLayout.EAST);
12        panel.add(south ,BorderLayout.SOUTH);
13        panel.add(west  , BorderLayout.WEST);
14        panel.add(center, BorderLayout.CENTER);
// frame method used directly
15        getContentPane().add(panel);
16        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
17        pack();
18        setVisible(true);
    }
  /
     * Main Method to start the program
     */

19    public static void main(String[] args) {
        InheritanceBorderLayout example = new InheritanceBorderLayout();
        
  }
}

سطر 1
عرفـنآ الكلآس وعرفنا الورآثه وما احتجنآ انشآء
Object

استخدمنا الميثود حقت الفريم مبآشرهـ سطور 15-16-17-18

سطر 2
Constructor
عرفنآه للكلآس و وضعنا كل الكودآت فيهـ وهي الطريقة الي المفروض تستخدمهـآ
انا كنت قبل احط الكودآت في
Main method
لكن هآذي هي الطريقه الصحيحه ،

سطر 19
Main method
وهي يكون فيها استدعآء البرنآمج لتشغيله ، ومآ فيهآ اي كود
لان المين ميثود لما تشغل البرنآمج رآح تستدعي
Constructor
الي فيها الكودآت وتشغلها

[gentle man]

^^^^^^^^^^^^^^^^^

[charisma_sa]

ما قصرتوا والله يعطيكم العافيه