بسم الله والحمد لله والصلاة والسلام على رسول الله
طيب اليوم ان شاء الله بنات هنكمل في موضوع ال
graphical user interface و هنكمل شغلنا هو نعمل
review بسيطة لل layout و ننتقل ل three components
جداد و هم هيكونوا اول components من ال graphical
user interface اللي هنستخدمهم بعد ال frame و
البناء كنا اتفقنا المرة الماضية ان انا في عندى لل
frameوالبنيل بما ان ال Java مابتحتويش بالأساس على
form designer فبقى راحوا أفرغوا لنا شغلة بيسموها
layout manager و ال layout manager كان هدول على
تلت أشكال ال layout الأول كان بيعتمد على ال flow
مفهوم ال flow أنه يتم تقسيم أو يتعامل مع العناصر
اللي تضعف على الشاشةElement Sequentially واحد ورا
التاني و اتعامل معاه نظام الأسطر أضفت ال component
الأولى التانية التالتة الرابعة و هكذا لما ينتهي
السطر يتبقى اللي فيه متسع ل new component ينزل على
ال component اللي بعدها و اتفقنا بشكل عام ان ال
layout managers هي اللي هتتحكم بال size و ال
position control ال sizeوالـ position إيش
يعني؟ لحظة أنه لما رسمت ال component رسمته بأحجام
مختلفة وتعمدت لأن شوفنا المرة الماضية لما كان ال
text عفوا ال text أو ال label تبع ال button كان هو
اللي بيتحكم في حجمه وبالتالي حجم ال element ثابت
بالنسبة أو كان بتحكم فيه ال flow layoutو بال
border layout كان بتجسم ليه ال frame اللي عندي
لخمس مناطق center,
north, south, east و westوالإضافة طبعا بهذه
المناطق مشكلة كمان مرة نرجع لـ Flow مشكلة الـ Flow
لو أنا غيرت الحجم هينعاد ترتيب العناصر بشكل جديد
لو غيرت حجم ال frame أو ال panel هيتغير الترتيب
العناصر أو يعاد ترتيب العناصر من جديد مش هي ..
يعني مش هلاجي التلاتة قبل اتنين لكن فعليا هلاجيهم
ممكن تختلف عدد الأسطور حسب الحجم الجديد اللي أنا
أخدتهفي الـ border layout الـ add by default هتكون
على ال center إذا أنا قلتله ال frame أو ال panel
dot add و
حطت ال UI object و سكتت by default هينضاف لوين؟ لل
center إذا أنا بدي أتحكم في ال direction أو في ال
position اللي أنا بدي أضيفه هروح أقوله border
layout
.وحدد المكان اللي انا بديه على سبيل المثال East
وبهيك اصبحت انا باضيفه لوين؟ باضيفه على المنطقة
المحددة اللي موجودة عندها بالاضافة لمشكلة الخمس
مناطق اللي عندي كل منطقة مهيئة انها تستخدم تستقبل
one element او تعمل view ل one element لو انا ضفت
عليها اكتر من element بيظهروا عندى as a stackوفي
التالي بشوف آخر واحد فيهم بيكون عندي as a stack
وبشوف آخر واحد فيهم الشغل التاني أو الملاحظة على
ال border layout عفوا انه بروح بعمل stretch لل
object بحيث انه يغطي المساحة المحددة بالكامل ال
grid layout بنروح
نعمل بروح بجسم ال panel اللي عندي او ال frame اللي
عنديلشبكة مجموعة من الصفوف والأعمدة مجموعة من
الصفوف والأعمدة كلها بتكون متساوية الحجم و
بالاضافة برضه فيها sequential مثلها مثل ال flow
حجام الخلايا متساوية والإضافة فيها sequentially
مثلها مثل ال flow الفرق اللي بينها وبين ال flow
أنه أنا عارف أن الحجم هذا فقط على مثلا بالرسم اللي
أنا عملته هنا خمس خلايا في الصف الواحد مش أكثر
بتظهر عندي المشاكل في حالة إذا أنا بدي أضيف عنصر و
أسبب و أسيب عنصر فلازم أشوف حلة مشكلة يعني مابقدرش
أسيب خلية فاضية أنا في طرق التفافية أبسطها أني
أروح أضيف label فاضيLabel بياخد نفس الحجم وبالتالي
بس مافيش عليه Text مش هيبين وبالتالي مش هيكون له
تأثير هذه أحسن الطرق أني ألتف على العناصر الموجودة
عندي هن الشيء التاني هن هتبدأ مشكلة عندي لو بدأت
يعني أضيف عنصر خارج حجم ال grid حجم ال grid معروف
عدد الصفوف في الأعمدة نفترض أنهي أربع صفوف في تلت
أعمدة معناه 12 element إذا أنا فكرت أضيف عنصر بعد
ال 12 على ال .. على البني الهادي أو ال frame هذا
معناته هتختلف ال layout اللي عندي و غالبا إيش هروح
يساوي؟ هيروح ال action يضيف لي كمان column لإنه
هيتبت عدد الصفر و مش هيتغير أو مش هيغير فيه ال
spaces
من ضمن خصائص ال grid في horizontal gap و في
vertical gap بحيث إن أنا أترك space بسيط هنا على
كل خليةبتقدر تتحكم فيها مافيش فيها مشكلة تمام وبهك
احنا شفنا الـ three layouts اللي ممكن يكونوا
موجودات عندى وقلنا بالاضافة لها دول ممكن انا اروح
ألغي الـ layout manager واخلي قيمته none مستخدمش
layout وهذا بيدفعني ان اروح باتجاه ال method او
استخدم ال method اسمها set bound
وهذه بتاخد منها قولنا الـ position X وY وبتاخد
منها الـ size, height, width وheight وهذه بدأ
أتعامل معاها مع كل element عندي على الشاشة بمعنى
أخر إنه لازم أفهم الشاشة تبعتي بالتفصيل ولمّا أبدأ
أرسم بدي أتخيلها as مثل البياني، رسم البياني عشان
أعرف كل position شكل دقيق وين بدي يكون موجودتمام
الأمور؟ اليوم هنتقل بعد الكلام هذا لأول العناصر A
في شغلة أخرى حابيت أن أتذكرها و أرجعها مع بعض في
الموضوع ال .. ال .. ال flow layout بال flow layout
by default وين ال element موجود؟ ال center يعني
بين جسين لو ماكنش في عندي عناصر في داخل ال .. في
داخل ال layout و روحت أضفت أول عنصر بروح بضيف ليها
في ال centerبضيف كمان عنصر بضيفه على يمينه بعده
يعني و بصيره التانين في الوسط مصبوط
هكذا و هكذا طب لو انا بدى اغير ال alignment بدخليه
على اليمين او اليسار مافيش مشكلة عندى اثناء ال run
-time او اثناء انشاء ال flow ال constructor تبعت
ال flow طبعا اللي انت سألتيني على الجاب هيهم
horizontal gap في عندى ال alignment مباشرة بحددها
بحيث ان اقوله انا بدى اروح يمين او يسار او ان ال
code اللى موجود عندها set
layout flow layout و بديه as parameter ال
constructor flow layout dot lift عشان اخلى ال
alignment للعنصر اللى موجود عندهاوبهيك عملنا ريفيو
سريعة لـ layout managers التلاتة اللي بيكونوا
موجودات مع ال panel و مع ال frame اليوم هنبدأ
نتكلم على أول العناصر اللي
لها علاقة بال input ك text و لما أنا بتكلم على ال
input بتكلم ال input تبعتي إما هتكون text field أو
text area أوpassword field وهدولة التلاتة لما أنا
بتكلم text لأنه فعليا أنا هستخدم ال keyboard من
أجل إدخال ال data للعناصر التلاتة و ال output و ال
input تبعتي عبارة عن text بأدخل و ممكن أعمل edit
للنص اللي موجود حسب الممكنية و الحاجة التلاتة
عناصر ال three classes هدولمبنيات على class اسمه
JTextComponent من أهم الـ method اللي موجودات في
الـ JTextComponent المفروض اللي لهم علاقة بإضافة و
استرجاع النص المدخل و فحص إمكانية هل هو قابل
للتعديل أو لأ اللي أنا فيه عندي مثلا user name و
high text field هنا لما أنا بدي النص اللي موجود
هنا user atmail.com هاي ال user name لما انا بدي
ارجع بالقيمة و افحصها لازم عبر ال method get و لو
انا بدي اجيب من البرنامج و اعرض قيمة بدي استخدم ال
set text تمامالآن أحيانًا أنا بقى أستخدم الـ Text
Field هذا وبدي أمنع أي حد يعدل عليه يعني مثلًا أنا
بقدر أروح أعرض له المستخدم رقمه الوظيفي بس مش
هسمحله يروح يعدل في رقمه الوظيفي أو مش هسمحله يعدل
في الـPosition تبعه أو مش هسمحله يعدل في الـName
تبعه لأ هذه الشغلات ممنوع يعدل عليها لأنه مش هو
صاحب السلطة على تعديلها فإيش بروح بسوي أنا بروح
بحددإمكانية التعديل على الـ element هذا هل هو
editable ولا لأ is editable عشان أفحص هل هو قابل
للتعديل قابل للتعديل يعني بقدر أحط ال cursor في
الداخل مؤشر الكتابة بقدر أمسح و أكتب على النص اللي
موجود بقدر أعمله select ولا لأ set editable عشان
أتحكم بال editability property تبعتها من خلال
البراميتر المُعبّاق اللي موجود عندها يعني أهم two
components أو three methods أو four methods
الموجودات مع ال Jtext component اللي هم get to
settle text وفحص و تحديد خاصية التعديل على النص
اللي موجود نبدأ مع ال text field الأول أو ال
element الأول اللي هو ال text field الآن ال text
field أنا بستخدمه عشان أضيفنص على الـ window اللي
موجودة عندها و ال constructor تبعه بسيط زي ما هو
قدامي على الشاشة جهزة جهزة جهزة جهزة جهزة جهزة
جهزة جهزة جهزة جهزة جهزة جهزة جهزة جهزة جهزة جهزة
جهز
والتالت بياخد الـ Default Text مع number مع الـ
Size Size إيش؟ أيوة الآن العشرين هذه هي عبارة عن
الـ View Size إيش يعني View Size؟ مش حجم الـ Text
المسموح إدخله ك maximum يعني احنا متعرفين، متعرف
عليه لما بقوله هاي عشرين يعني ال maximum عشرين
character، لأالـ maximum هذه أو الـ view هذه
العشرين هي عبارة عن حجم النص اللي انا ممكن اشوفه
من خلال ال text field يعني تخيلي ال text field هي
عبارة هاي ال window هذه و انا بديت النص hello my
name is iad الآن ايش انا شايف لو انا بتطلع الآن
بتطلع من خلال ال text field هذافقط بس أنا شايف my
name is IY وباقي ال character hello و إيه دي اللي
في الآخر هدولة موجودات من ضمن ال text لكنهم مش
ظاهرين إليه فالعشرين هذه مفهومها هي حجم ال column
أو احنا نسميها عدد ال columns في ال view نعم ال
width تبقى بالضبط ال width تبعت ال text field
تبعته هي العشرين بس مش ال maximum sizeمش الـ
maximum size الآن لما أنا باجي باكتب و ببدأ بأصل
أخر character هنا في ال space في العشرين إيش بصير
ال behavior؟ إنه بصير يعمل scroll لل text باتجاه
اليسار عشان يسمحلي أشوف النص اللي أنا باكتبه و لما
أنا بدي أسرجع النص اللي في الأول لازم أروحله بال
mouse للبداية عفوا بال keyboard للبداية باستخدام
الأسهم وبالتالي ضروري جداأفهم إن العشرين هذه بتحدد
الـView Width أو الـWidth تبع الـText Shield اللي
موجود عندها هذا
الكلام مهم جدا لإن كثير من الناس بتخربط ويقولك يا
عم هاي وكتبلي حجم عشرين بس ليش بسمحلي أن أكتب أو
ياخد أكتر من العشرين اللي موجودة
لو انا بدى اتحكم أثناء الـ runtime بعدد الأعمدة
هدولة في الـ constructor كانوا، أصبحت؟ لو أنا بدى
أتحكم بعدد الأعمدة الـ method اللى اسمها set
columns بتسمحلي أن اتحكم بعدد الأعمدة لكن بما أنه
أنا قاعد بتكلم على الـ graphical user interface
والـ system راح عمل render للـ code ويرسملي الـ
text field زي ما أنا بدي على الشاشة و بدي أروح
أعدّل عليه الآن لازم أروح أعمل Revalidate للـ
panel اللي موجود عليها من الـ text field اللي
غيرته كمان مرة في الـ runtime أنا هيو خلاص أصبح
موجود بالحجم هذا أنت قاعد بتقولني لأ اعمله view
أصغر معناته أنت بتعيد تخطيط ال panel اللي أنت
موجود عليها وبالتالي أنا بروح استخدمrevalidate
method اللي هتروح تعمل recomputation للـ size عشان
تتحكم بالـ layout اللي موجود عنده مع العناصر اللي
موجودة عندهم واضحة الأمور لحد اللحظة يا بنات؟
revalidate؟ طيب، الآن مش احنا اتفقنا كل panel اللي
لها layout manager
مظبوط؟ الـ Manager عشان مهمته يتحكم في الـ Size و
الـ Position طيب، انت عملت شو بتروح تسوي و تتغير
بالشكل اللي على الـ Text Field؟ بتغيري حجمه، صح؟
يعني انت بناء على حاجتك قررت تغيري حجم الـ Text
Field اللي موجود عندك هنا في الـ View بناء على
تغيير الحجم هذا الـ Layout Managerسيذهب ويحسب باقي
الحجومات تخيل إن كان هذه السطر هكذا كان هذا الـ
Text Field هنا موجود هكذا وكان في عندي Text Field
آخر هنا مع الـ Flow Layout وانت روحتي وقلتله غير
الـ Size هذا لهكذا الـ Reaction تبع الـ Layout
Manager بناءً على الـ Size صار في عنديspace وين في
ال line فهيروح يعمل shift للعناصر ويعبّب فيها ال
space اللي موجود عندها فلازم انت تروح تعملي
revalidate وغالبا اذا انت ماعملتيش revalidate مش
هتقدر تشوفي ال action تبع العناصر اللي موجود عندك
مش هيتغير بشكل مباير لازم تقولي له revalidate لأ
عشان هي عبارة عن إشارةلـ Layout Manager لعيد توزيع
العناصر أو لعيد رسم العناصر على الـ panel الموجودة
عندها لو
أنا بدأ أسأل السؤال التالي لو أنا أتيت و رسمت لك
forum بسيطة بالشكل هذا
عفوانها ax login
form وحطيتك
text field وكمان text field وحطيت فيه هنا two
buttons كإشارة
إن هذا button في الوضع اللي هنا هي login وهي هنا
exit أو cancel
ماذا رأيك بالـ Form هذه؟ من اسمها Login Form
معناته بدي أدخل username و password و هاي two text
field وين ال username و ال password؟ مين ال
username و مين ال password؟ العادة بال user
experience بنقول احنا بطلب username في الأول و
بعدين بدخل ال password لكن هذا الكلام مش صحيح طبعا
مش صحيح من ناحية design ك UX فانا فيه عندى مشكلةفي
تصميم الـDesign لازم يكون في عندي إشارات إرشادية
أو Text إرشادي يحدد للـUser أيش الـElement المطلوب
عنه طيب، وهنا بنلجأ لمن؟ للـLabel، للحاجة للـLabel
طيب، قبل ما ألجأ للحاجة للـLabel في الـConstructor
الـDefault Text متى أنا بستخدمه؟لما بتكون عندي ..
لما بتكون في عندي نموذج وعندي مثلا ال place،
العنوان أو ال place، المنطقة برنامج بيشتغل في غزة،
تمام؟ أو برنامج للشركة في غزة، معظم الموظفين تعود
تميله وابنهم يكونوا؟ من غزة وبالتالي هان بتكلم على
default value بتكلم على default valueفي الـ action
مع الـ default value لازم يكون كالتالي بمجرد إنه
يجي الكيرسر في داخل الـ text field يجي ينعمل
layout أو عفوا لل text اللي موجود في ال value
ينعمله تضليل عشان ينمسح لو بده ال user يدخل أي
value جديدة كتير من الأحيان بنشوف بقول مثلا دخل ال
email و بروح مكتوب ليه text بسيط في داخله example
مثلًا email at كده بمجرد إن بحط الكيرسر في داخل ال
text field بيختفي النص اللي موجود وهذا الكلام لازم
أقراه عند ال design عشان أسهل على المستخدم استخدام
ال form اللي موجود عندها بررولنا بس كشف الحضور
تمام الآن معناته احنا بحاجة لل label
by default هيأخذ الـ text الموجود اللي هي Gaza 100
% by default لو كمان مرة زملتكوا الآن أنا فيه عندى
نص موجود default text و ال user مادخلش نص جديد by
default هياخد ال text ده بس بدي اتفرجى بدي اتفرجى
خليكي معايا لسؤالتي عن فيه النص بدي اتفرجى ما بين
ال default value و بين ال hint ال hint اللي هي
النص الرماديتمام الـ placehold اللي لما انا بعمل
click بيختفي انا بتكلم لأ default text لما انا
بعمل place بيكون موجود وبيتظلل بالكامل عشان يمكنوا
ان يمسحوا حسب حاجته طيب الآن معناته احنا متفقين ان
ال text field هذا بدون بدون ال label هيكونبيعتمد
على الـ user experience ومحتمال الخطأ في التعامل
مع الـ elements عالي جدا الحل أني ألجأ لل label ال
label هي عبارة عن component بتحتوي على text مافيش
عليها أي formatting وال user ماليش أي action عليها
يعني الأصل ال label ال user لا بيقدر يعملها select
ولا يعملها edit ولا أي شيء هي مجرد عبارة عن نص
إرشادي عشان يقول انه ال text field أو اللي بعدي
صفته كذا وتستخدم من أجل تعريف ال component تستخدم
من أجل تعريف ال component الآن ال label ال
constructor تبعته أو ال component تبعتنا اسمها ال
J label
و لازم تكون قريبة جدا قريبة جدا من مين؟ من ال
component اللي بتتوصفها حسب الناس اللي بتشتغل في
ال HCI و بتتكلم في ال design بتقول لازم تكون ال
label قريب من ال component بشكل كبير عشان تفعلين
يحصل التعريف المناسب ال identification المناسب
الصحيحة لل component اللي عندي by default عشان
نشوف ال sequence أو السيناريو التالي تخيلي
Okay بلاش يعني
أنا بدي أضيف label ال user name هاي
كولون و ورا ال text field حسب ال flow أو ال layout
اللي أنا بدي أضيفه password أقل
character أو اتنين وهي ال password هذا ال
interface فيه مشكلةما ده الـ interface؟ فيه مشكلة
المشكلة سببها إن الـ label الـ size تبعه بحجم الـ
text المدخل تماما وبالتالي إذا أنا بدي أضيف label
و أضيف وراه text field معناته هيكون ملاظق له تماما
لو اختلف الـ two label في الـ sizeمعناته بداية ال
text field اللي عندي مش هتكون مرتبة تحت بعضها و
طبعا هندخل مشكلة في ال UI في ترتيبها و لا لا؟ طيب
الحل إيش هساوي؟ واحد قال و الله انا روح أضيف
spaces هنا يا أستاذ white spaceممتاز هذا الحل اسمه
ترجيع والترجيع بينفع في مرحلنا لكن لما انا بدي
اشتغل صح او بدي اي تغيير بدي اهد الترجيع كله ياته
ابدأ ارجع من تاني و هذا الكلام مش صحيح الحل ..
الحل بيكمن في فهمنا لعناصر او ل label اللي موجود
عندنا و لكل ال components مع بعضها ال label اتفقنا
حجمه بحجم ال text المدخل هذه واحدةإتنين لو كبر حجم
ال label أكبر من حجم النص كيف بدو يصير؟ أروح أحطه
في ال center على سبيل المثال تبع ال border layout
يعني أنا كاتب كلمة password و روحت أضفتها على ال
center تبع ال frame أو بلاش على ال north تبع ال
frame اللي عرضه 300 pixel إيش بدو يصير في وضع
النص؟ وين بدو ينضاف؟ كلمة ال label أو ال username
اللي أنا كتبتها وين بدها تروح؟ الآن هيها، هي ال
spaceتبع الـ North ودي اضافت فيه كلمة user name as
a label هان المنطق بيقول إنه هيعمل stretch هيكبر
من؟ ال label بس مش هيكبر النص لأنه قبل شوية قولنا
إن النص غير قابل للتعديل أو ال formatting أو
التنسيق كبر ال label بين جثين صار فيه إمكانية إن
النص يتحرك في داخل ال label by default هتلاقيه
موجود في اليسارالـ username lift alignment طب أنا
بدي أتحكم في ال alignment تبعته لو أنا بدي أتحكم
في ال alignment تبعته مباشرة أثناء ال constructor
أثناء ال constructor ممكن أحدد وبشكل واضح أنا بدي
أعمل alignment لوين؟ بدي أعمل alignment لليمين؟
هاي ال alignment لليمين إما بروح بستخدم و بقول له
swing constant dot rightأو باستخدم jlabel.write في
كل الحالتين انا هعمل alignment لل text باتجاه
اليمين لو كان حجم ال label أكبر من حجم النص المدخل
متى هذا الكلام بيصير؟ في حالات كتيرة لما انا باضيف
ال label هذا على بنيل تعالى أورجكي مثال تاني لحل
أفضل لهانالان تخيلي انا روحت عملت panel او في عندى
panel جسمتها ل grid من اربع خلايا ايش grid يعني
خلت ال layout manager تبعتها grid layout هيها
بتقولها بتجسمه بنفس الحجم user name هتيجي هنا
password
هيها
هنا وهنا ال text field تبعنا بالكامل
تمام؟ برضه في مشكلة في الـ interface اللى صار عندي
أنه ال label بعيد عن ال element و الناس اللى شغلت
علي HCI جالت المشكلة أنه أحيانا مع كتر ال elements
ممكن البعض يظن أن هذا ال label للعنصر اللى تحته أو
للي فجوه للي فجيه مش للعنصر المناسب وبالتالي قبل
شوية احنا قلنا لازم تكون too closed
to component no decoration component used to
identify close enough لازم تكون قريبة جدا طب هذا
مش قريبة جدا الحل بتجه على ال alignment تبعت من؟
تبعت ال label لان هذا ال label هيحجمه بالكامل في
الفريق في ال cell و هم نفس الحجم التنتين فبروح
بعملهم alignment لمن؟ لل right من خلال constructor
تبعت ال label اللي موجود عندهمواضحة الأمور يا
بنات؟ 100
% حالة ال flow layout هيكون نفس الحجم معناته ال
flow layout مش هو المناسب عشان أعمل design للحالة
هذه هورجيكي مان عشانك سألتي بس خلينا نشوف لو قلتلك
هذه لو طلبت منك تصميم الواجهة هذه إيش ال layout
اللي هتستخدمين flow
أيوة، الآن بدي كل واحدة فيكوا على السريع تفكر هي
.. هي في عندي two labels و two text field و text
area عشان اكتب text بأكتر من سطر و هي في عندي
button هان ايش ال flow .. او ايش ال layout المناسب
من أجل تصميم هيك نموذج؟ اصمتكوا قالت هان ال flow
غيره؟
border بس ال border مش هيسمحلك اللي هيرضي في one
element هانفح؟ وهنا الأصل أن المفتاح يتمدد بالحجم
بالكامل غيره border لحاله غلط و flow لحاله غلط و
grid لحاله غلط فأنا ممكن أنا أشتغل combination
بينهم كلهم أو بين اتنين منهم على الأقل تعالى
أورجكي شغلة لو أنا جيت و قلت هاي border east
و west مابلزمونشولا لا فبسيبهم في ال north في ال
north بروح بعمل panel بعمل panel وال panel بخليها
grid layout بحيث ان انا بضيف panel هان وال
panel ها دي بتكون عبارة عن grid layout صار بإمكاني
اضيف الأربع عناصر الموجودة دول بالترتيب على ال
center بضيف ال text area المطلوبةالـ j text area
وعلى
ال south انا في عندي one button و اين جاي في
المنتصف يعني بروح بضيف هنا بنل flow
layout
و بضيف عليها button عشان الـ button يدي وين في
المنتصف لاحظى layout واحد لحاله ماكفنش بس التلاتة
مع بعض انا قدرت اشتغل فيهم يعني هان استخدمت frame
الأساس و استخدمت two panels البانل الأولى عملتها
grid layout و أضفتها على ال north و البانل التانى
عملت ال layout تبعتهاflow layout وأضفتها وين؟ على
الـ south وبالتالي حصلت على العنصر اللي أنا بديه
وفي الوسط ضفت ال text area حسب حاجتي ال scroll له
علاقة بال text area هلأ كنت بقولك هي كيف كومبونم
تبعته بسيط تمام؟ وبالتالي ما تفكريش دائما أن والله
layout حاله مايظبطشالـ Flow لأرطل حاله بيظبطش، ال
grid بيظبطش، مابعش ممكن أساوي، اعمل combination ما
بينهم، باعتمادك على ال panels باعتمادك على ال
panels طيب، خلصنا من ال label في عندي method مهم
جدا في ال label أو ال constructor تبع ال label
ممكن ياخد مني icon بياخدicon والفكرة أنه ممكن انا
اعرض صورة من خلال ال label اعرض صورة او icon من
خلال ال label بعض المبرمجين بيلجأ لعرض الصور بال
Java باعتماده على label بيعتماده على ال label طبعا
في constructor بياخد كل حاجة بياخد العنصر بياخد ال
text وبياخد ال icon وبياخد ال alignment لهم كذلك
وان يكونوا موجوداتAnyway خلصنا من الـ J label لو
أنا بدي أسترجع النص اللي موجود في ال label أو بدي
أغيره في ال runtime ممكن؟ أه ممكن طب أنت قبل شوية
قولت يا دكتور أن هذا ..uneditable مش موجود .. okay
لما نتكلم uneditable مش إليك ك programmer لل end
user أنت ك programmer أنت أساسا أنت اللي قاعدة
بتوجديه وبالتالي أنت اللي بتقدر تتحكمي بالعناصر
اللي موجودة فيه وبالتالي لما أي شغل إلها علاقة بال
editability أو بتحرير النص أو بتحرير ال data
المدخلة لل user لل end user مش إليك ك developer أو
ك programmerSit Icon و Get Icon من الـ methods
المهمة اللي ممكن تستفيدي منهم طيب نجي لل password
field ال password field هو عبارة عن special field
من ال text field لكنه بيستبدل النص المدخل ب echo
character وهنا
اللي هو النجمة ال asterix أو ال asterixالان ليش
أنا باستفيد؟ احنا قاعدين بنقول ليش ال field فيه
password الأصل .. الأصل لما أنا باطبع على ال
keyboard الحرف ماينظهرش على الشاشة أنا عارف هو
حطيت أصبعي بس مديش ال user أو الجيراني الناس اللي
قاعدة جنبي أصدقائي جرايبي إلى آخره يقرأ ال
password اللي موجودة لأنه أساسيات الخصوصية اللي
لها علاقة بال passwordالـ JPassword field عمل
implementation للـ text field مع استبدال كل حرف
بيتم طبعته بـ star أو بيسميها احنا ايكو character
لانه ممكن احنا ايش نغير ال character ايكو طباعة
تمام و الحرف المقبوع عندها by default انا بتكلم
على ال star ايش ال methods الموجودة عندى ال
constructor مثلها مثل ال text field ممكن ياخد text
وأحدد length أو width للـ element اللي عندي set
echo character أستخدم character جديدة غير الـ star
إذا أنا بدي أتحكم فيها أحط مثلا واحد بدي أحط حرف
الـ A بدي أحط فراغ بدي .. أي شغل الأمر متروك إليك
مش مشكلة من أهم ال methods اللي بتلزمك get
password أن الباسوورت تم إدخالها تمام؟ بدي أعمل
عليها validationبينفعش اروح اقوله get text ليش؟
لأن ال text المدخل اصبح ايش الموجود في داخل ال
text اللي هو ال echo character و لو انا اجيت ضللته
و عملت copy و روحت على ال notepad و عملت paste بدي
اطبع ال echo characters ال start تبعتيها فلازم
يكون في عندي method اسمها getarray أو get عفوًا
password اللي هي هرجعلي ب array of character عشان
اعمل validation على ال password اللي موجودة عندك
طيب طيب وين ال array هذه بتتخزن؟ وين ال array
بتتخزن؟ في داخل ال object اللي هو ال get ال J
password طيب هل هي private؟ لأ واضح انها مش
privateعفوا، هل هي public؟ لأ مش public هي private
attribute والدليل إن بس متاح قدامي إن أسترجع
القيمة من خلال الـ get password لأ
لأ، بتحولش من الـ echo character انت هان تخيل إيه؟
أنا بدي أكتر ال password تبعتي hello، كمان؟ أنا
بقاجي على هذا ال cursor موجود بمجرد أدوس أو أعمل
press على حرف ال H
الـ system بطبع نجمة و في الـ background بخزن H
على الـ array of characters اللي عندي ال password
الحرف التاني E نجمة و غالبا .. غالبا ما بين الحول
اللي كياالـ character management تمام فيه delay
بسيط جدا عشان تقدر تلمح ايمة الحرف اللي انت
بتكتبيه لو دججتي و انت بتكتب password هتلاقي فعليا
آخر character بينكتب دائما بينعمله delay و كل ما
كنت سريع في كتابة ال password مش هتمسكي .. مش هتحس
بال delay اللي موجود anyway في الآخر هو عماله
بيعمل replacement بستبدل كل حرفبس و الحرف الأصلي
وين بروح بتخزن في الـ array الـ private array of
characters اللي موجودة عندها طيب نيجي لل element
التالت اللي هو ال text area ال text area أنا قاعد
بقى أتكلم مازلت على text لكنه مش هتكلم على one
field مش هتكلم على حق البسيط هتكلم على multi line
ال action مع ال text fieldلما انا بروح وأضغط enter
الـ enter بتعني نهاية السطر أو نهاية ال text
وغالبا مع ال text field هتلاقي المؤشر بينتقل من ال
text field هذا لل text field اللي بعده أو لل next
input element يعني لما أنت بتروح و بتكتب ال
username و ال password و بتضغط enterبحسبش الـ
enter هذا character في ال password بروح كأنك تغطي
على مفتاح ال login لأن هو عبارة عن next input
element تمام طب لو أنا بدي أكتب comment بحيث أنه
لما أضغط enter أخد ال new line أو بين جسين لأن أنا
بحتاج multiline text
عندما أحتاج Multilines كيف أعيش الحل؟ الحل في الـ
Text Area اللي موجودة عندها الـ Text Area الـ
constructor تبعها بياخد
rows اللي بتمثل عدد الأسطر
اللي أنا بدي أكتبها و ال columns بتحدد ال width أو
ال viewالـ view columns تبعت مين؟ تبعت الـ text
area اللي موجودة عندها وكأنه .. أنا قاعد بقى أقوله
حجم الـ text area تبعتها هي عبارة عن تمان أسطر و
أربعين character في السطر الواحد حجم ال view
تبعتها مش حجم ال data المدخلة نفس الكلام المطبق
اللي يطبق على ال text field هو نفسه بيطبق .. طبق
وين؟ على ال text area اللي موجودة عندها
متى بيكون بنعدد سطر؟ لما انا بضغط enter مش الشغل
بخلص لما انا بضغط enter الـ carriage retire هي سطر
جديد الـ new line تمام يعني في ال text area أنا
أجيت هيها أنشأتها و بديت أكتب لأن إذا أنا بأكتب
هيستمر معاه في كتابة لحد ما أضغط enter هينزل لمين
للسطرة next line هذا واحدتمام؟ طيب كتبت لحد اللي
هانو روحت ضغطت enter هيظهر
كله خلاص لهانو ضغطت enter هيكمل هيصار أربعة وها
كذا ضغطت enter هي نهاية الصطر تمام؟ وبالتالي بقدر
أعمل scroll يمين ويسار حسب حاجتي أعمل كل صطر زي ما
شوفنا في ال text field باعتمادي على الأسهم
الموجودة على ال keyboard عشان أتنقل لبداية و نهاية
الصطروهذا كل واحد فيهم بنعد في سطر لحد ما كمل
تمانية الآن بما أن السطر طويل وصار أكبر من حجم ال
text field أو عرض ال text field في عندي خاصية ال
set line wrap التفاف السطر إيش يعني التفاف السطر؟
إن هذا السطر بدل ما هو موجود غاد يصير يهتزم بالحجم
تبعت ال viewبينجوسينت الصطر الواحد يصير على أكتر
الـ view تبعته على أكتر من الصطر تبع الحجم ال
editor اللي موجود عنده يعني اللي ال text area يعني
بينجوسينت لو أنا كنت هذا الصطر اللي كتبته كان
بيحتوي على خمسة و تمانين character وعملت
six line rabbit row لل text area هذهالسطر هذا
سينعرض على سطرين و نص و الـ tape سيأخذ خمس
character يعني سيتكلم على ثلاث أسطر سيتكلم على
ثلاث أسطر على حساب الـ view طبعاً لأن الـ height
تبع الـ view فقط تمان أسطرطيب و اللي بعده مافيش
مشكلة اللي بعده مافيش مشكلة اللي بعده هياخد سطرين
و هكذا وبالتالي أنا صرت قلتله خلّي ان عندي التفاق
في النص أو بين جوسين قاعد بقوله التزم بحجم .. بحجم
أو بعرض ال .. بالود .. بالود تبع ال text area اللي
عندي لعرض النص المناسب
بنزيد مافيش مشكلة نفس ما بزيد عدد ال columns كان
في ال text ممكن أزيد عدد ال raw اللي موجودة عندي
بدون مشكلة طيب الان بما أنه أنا اتكلمت على نهاية
السطر طبعا ال Interhead يا بنات هو عبارة عن
special character slash N في البرمجة ولا لا؟ طيب
تمام بما أنه أنا قلتله wrap line N يعني التزن
بالحجم اللي موجودالـ rap line هذا هيفتح قدامي
style جديد اللي له علاقة بال word rap style الآن
الكلمة لما .. لما الكلمة أو ال character الرقم 40
هنا اللي طبعه هل هو ضروري أن يكون نهاية كلمة؟لأ،
ما هو ممكن يكون بداية كلمة أو منتصف كلمة سابقة
بالنسبة إليه إذا أنا قلتله sit line rap true سكتت
فخلاص هو بيصير كل صدر بعرض فيه أربعين character
أربعين character و بكمل حسب الحاجة هذا في خمسة
خلاص بنتهي من الخمسة و ناخد new line الآن إذا أنا
قلتله الخاصية أو غير الخاصية تبعتنا اللي هي sit
rap style wordمفهومها إنه ما تقطعش الكلمة و تحطها
في سطرين الكلمة دائما تكون في سطر واحد يعني ما
تقطعش الكلمات و تكون موجودة عندى في السطرين طيب
فيما يتعلق موضوع ال scroll عشان أريحك منه تظهري في
عبد الحلجة ل object جديد اسمه scroll pane عشان
أعرض ال text area بشكلها الصحيح مع ال scroll bars
اللى ممكن تلزمنيبتروح استخدام object او اخد object
اسمه scroll pane و ال constructor تبع ال scroll
pane بده ياخد منه ال object تبع مين؟ تبع ال text
area بده ياخد منه ال object تبع ال text area يعني
هيك و كأن انشأت ال text area و حطيتها في داخل
scroll bar او في داخل scroll panel و ال scroll
panel هي اللي بدي اضيفها على مين؟على الـ frame هي
اللي بدي أضيفها على الـ frame يعني إياك تروح تضيف
ال text area لحالها إذا ضفت ال text area مش هتبين
معاكي ال scroll bar فانت لازم تروح تضيفيه ال text
او اللي عفوا ال scroll bar اللي موجود عندك ال
methods اللي موجودات عندك مع ال text area عشان ان
شاء الله ما أتأخرش عليكم
Text Era Constructor Set Columns Set Rows إذا أنا
بدى أتحكم عدد الـ Columns وعدد الـ Rows وهذا
بيقتضي مني أعمل ال panel.revalidate إذا أنا بدى
أغير عليهم append إذا أنا بدى أضيف نص من خلال code
البرامج تبعي بس ال append هأضيف وين؟ على نهاية
السطر set line rap اللي احنا شوفناها قبل شوية set
rap style word عشان كل كلمة تكون كل كلمة في سطر
جديدو6 Tab Size لما انا بدى اضغط ال Tab بما انه
مسموح لي اضغط Enter فمسموح لي اضغط Tab ال Tab
تبعتي كام character بدها تكون وفي الآخر عندي ال J
Scroll Pin اللي هي ال scroll bars اللي اضفتها لل
component الكبيرة ضروريالطبق هدولة اليوم عملي عشان
ما تنسوهمش انه مافيش رجل في المحاضرة ان احنا ايش
نروح باتجاههم نغطيهم عملي وبهك بنكون خلصنا الجزء
الأول من موضوع محاضرتنا في الـ Graphical User
Interface أخدنا الباني .. البانز اللي هي الـ J
Frame و البانل و أخدنا هنا three components مع ال
layout managers اللي موجودة الله يعطيكوا العافية