الأحد، 26 فبراير 2023

انشاء واجهة رسومية حديثة باستخدام مكتبة Tkinter

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

في هذه المقالة، سنقوم بإنشاء واجهة رسومية حديثة باستخدام مكتبة Tkinter، حيث سنناقش الخطوات التالية:

1- إنشاء نافذة الواجهة الرئيسية.

2- إضافة العناصر الرئيسية إلى الواجهة الرسومية.

3- تصميم الواجهة الرسومية بشكل أفضل.

بدايةً، يجب تثبيت مكتبة Tkinter على جهاز الكمبيوتر الخاص بك، وذلك باستخدام الأمر التالي:

 

pip install tkinter

بعد ذلك، يمكننا البدء في إنشاء واجهة رسومية حديثة باستخدام مكتبة Tkinter.

1- إنشاء نافذة الواجهة الرئيسية

في البداية، يجب علينا إنشاء نافذة الواجهة الرئيسية باستخدام Tkinter. يمكن فعل ذلك باستخدام الكود التالي:

1
2
3
from tkinter import *
root = TK()
root.title("واجهة حديثة")

تم إنشاء نافذة الواجهة الرئيسية باستخدام مكتبة Tkinter، وقمنا بتسمية النافذة باسم “واجهة حديثة”.

2- إضافة العناصر الرئيسية إلى الواجهة الرسومية

الآن، يمكننا إضافة العناصر الرئيسية إلى الواجهة الرسومية. يمكن إضافة الأزرار والمربعات النصية والقوائم والعديد من العناصر الأخرى إلى الواجهة الرسومية باستخدام Tkinter. وفي هذا المثال، سنضيف زرًا واحدًا ومربعي نص، ونستخدم الأمر grid لتنظيم هذه العناصر في الواجهة الرسومية:

1
2
3
4
5
6
7
8
9
10
11
from tkinter import *
root = Tk()
root.title("واجهة حديثة")
# إضافة زر
btn = Button(root, text=  " إظغط علي ")
btn.grid(row=0, column=0)
# إضافة حقلين لنصين
txt1 = Entry(root)
txt2 = Entry(root)
txt1.grid(row=1, column=0)
txt2.grid(row=2, column=0)

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

3- تصميم الواجهة الرسومية بشكل أفضل

يمكننا تصميم الواجهة الرسومية بشكل أفضل باستخدام خيارات التخطيط والألوان والخطوط والصور وغيرها من الخيارات المتاحة في Tkinter. في هذا المثال، سنقوم بتغيير لون الخلفية وتحديد خط عنوان النافذة:

1
2
3
4
5
6
7
8
9
10
11
12
13
from tkinter import *
root = Tk()
root.title("واجهة حديثة")
root.configure(bg='#E5E5E5')
# إضافة زر
btn = Button(root, text="إظغط علي !", bg='#2D9BF0', fg='white', font=('Arial', 12, 'bold'))
btn.grid(row=0, column=0)
# إضافة حقلين لنصين
txt1 = Entry(root, bg='#F0F0F0', font=('Arial', 12))
txt2 = Entry(root, bg='#F0F0F0', font=('Arial', 12))
txt1.grid(row=1, column=0)
txt2.grid(row=2, column=0)
root.mainloop()

تم تغيير لون الخلفية إلى اللون الرمادي الفاتح، وتم تحديد خط العنوان إلى Arial. تم أيضًا تغيير لون الخلفية للزر وتحديد حجم الخط والوزن ولون النص، وتم تغيير لون خلفية مربعات النص إلى الرمادي الفاتح.

بهذا نكون قد أنشأنا واجهة رسومية حديثة باستخدام مكتبة Tkinter.

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

3- تصميم الواجهة الرسومية بشكل أفضل: يمكننا تصميم الواجهة الرسومية بشكل أفضل باستخدام خيارات التخطيط والألوان والخطوط والصور وغيرها من الخيارات المتاحة في Tkinter. في هذا المثال، سنقوم بتغيير لون الخلفية وتحديد خط عنوان النافذة:

تم تغيير لون الخلفية إلى اللون الرمادي الفاتح، وتم تحديد خط العنوان إلى Arial. تم أيضًا تغيير لون الخلفية للزر وتحديد حجم الخط والوزن ولون النص، وتم تغيير لون خلفية مربعات النص إلى الرمادي الفاتح.

بهذا نكون قد أنشأنا واجهة رسومية حديثة باستخدام مكتبة Tkinter. يمكننا الآن إضافة عناصر إضافية

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
from tkinter import *
root = Tk()
root.title("واجهة حديثة")
root.configure(bg='#E5E5E5')
# Add a button
btn = Button(root, text="إظغط علي !", bg='#2D9BF0', fg='white', font=('Arial', 12, 'bold'))
btn.grid(row=0, column=0)
# إضافة حقلين لنصين
txt1 = Entry(root, bg='#F0F0F0', font=('Arial', 12))
txt2 = Entry(root, bg='#F0F0F0', font=('Arial', 12))
txt1.grid(row=1, column=0)
txt2.grid(row=2, column=0)
# إضافة قائمة منسدلة
options = ["Option 1", "Option 2", "Option 3"]
var = StringVar(root)
var.set(options[0])
dropdown = OptionMenu(root, var, *options)
dropdown.config(bg='#F0F0F0', font=('Arial', 12))
dropdown.grid(row=3, column=0)
# إضافة صورة
img = PhotoImage(file='image.png')
img_lbl = Label(root, image=img)
img_lbl.grid(row=4, column=0)
root.mainloop()

تم إضافة قائمة منسدلة تحتوي على ثلاثة خيارات وتم تحديد خلفية القائمة المنسدلة وحجم الخط. تم أيضًا إضافة صورة ووضعها في الواجهة الرسومية باستخدام مكون Label.

بهذا، نكون قد انتهينا من إنشاء واجهة رسومية حديثة باستخدام مكتبة Tkinter. يمكنك تخصيص المزيد من الخيارات والإضافات لتحسين التصميم والوظائف حسب ما تحتاجه.



ليست هناك تعليقات:

إرسال تعليق

جلب البيانات من صفحة ويب باستخدام Selenium

  في هذا الدرس، سننشئ أداة لاستخراج البيانات من أي موقع ويب باستخدام Selenium. Selenium هو مشروع مفتوح المصدر يستخدم لأتمتة المتصفحات. وهو ي...