🟢 الدرس التاسع: استخدام QComboBox (القائمة المنسدلة) في PyQt Designer

في هذا الدرس سنتعلم:

• كيفية إضافة قائمة منسدلة (QComboBox) باستخدام Qt Designer.
• كيفية تعبئة القائمة بالعناصر.
• كيفية ربطها بالأحداث لمعرفة العنصر المختار وتنفيذ أوامر بناءً على الاختيار.

---

📌 1. إنشاء الواجهة في Qt Designer

1-افتح Qt Designer وأنشئ نافذة جديدة (Main Window).

2- أضف العناصر التالية:

• QLabel بعنوان "اختر دولتك:".
• QComboBox (نسميها: comboBox).
• QPushButton بعنوان "عرض الاختيار".
• QLabel فارغة لعرض النتيجة (نسميها: labelResult).

3- احفظ الملف باسم:

combobox_sample.ui

---

📌 2. كود بايثون

import sys
from PyQt5 import QtWidgets, uic

class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        uic.loadUi("combobox_sample.ui", self)

        # تعبئة القائمة بالعناصر
        self.comboBox.addItems(["مصر", "السعودية", "الإمارات", "المغرب", "الأردن"])

        # ربط زر العرض مع دالة
        self.pushButton.clicked.connect(self.show_selection)

        # يمكن ربط التغيير مباشرة بالـ ComboBox
        self.comboBox.currentIndexChanged.connect(self.selection_changed)

    def show_selection(self):
        # الحصول على العنصر الحالي
        country = self.comboBox.currentText()
        self.labelResult.setText(f"لقد اخترت: {country}")

    def selection_changed(self):
        # تحديث النتيجة بمجرد التغيير
        country = self.comboBox.currentText()
        self.labelResult.setText(f"تم تغيير الاختيار إلى: {country}")


if __name__ == "__main__":
    app = QtWidgets.QApplication(sys.argv)
    window = MainWindow()
    window.show()
    sys.exit(app.exec_())

---

🎯 النتيجة

• عند تشغيل البرنامج تظهر قائمة منسدلة تحتوي على الدول.
• يمكن للمستخدم اختيار دولة والضغط على زر "عرض الاختيار" لعرض النتيجة.
• كما أن تغيير العنصر في القائمة مباشرة سيُحدث النتيجة تلقائيًا بفضل الحدث currentIndexChanged.

---

✅ التمرين

• QLabel بعنوان "اختر لغة برمجة".
• QComboBox يحتوي على (Python – Java – C++ – JavaScript – PHP).
• زر بعنوان "موافق".
• QLabel فارغة.
• عند الضغط على الزر، تظهر رسالة تقول:

"لغة البرمجة المفضلة لديك هي: <اسم اللغة>".

---

📌 الحل

1. تصميم الواجهة في Qt Designer

أنشئ نافذة جديدة (Main Window).

أضف:

• QLabel باسم labelTitle بعنوان "اختر لغة برمجة".
• QComboBox باسم comboBox.
• QPushButton باسم pushButton بعنوان "موافق".
• QLabel فارغة باسم labelResult.

احفظ الملف باسم:

combobox_exercise.ui

---

2. كود بايثون

import sys
from PyQt5 import QtWidgets, uic

class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        uic.loadUi("combobox_exercise.ui", self)

        # تعبئة القائمة بالعناصر
        self.comboBox.addItems(["Python", "Java", "C++", "JavaScript", "PHP"])

        # ربط الزر مع الدالة
        self.pushButton.clicked.connect(self.show_selection)

    def show_selection(self):
        # الحصول على العنصر الحالي من القائمة
        language = self.comboBox.currentText()
        self.labelResult.setText(f"لغة البرمجة المفضلة لديك هي: {language}")


if __name__ == "__main__":
    app = QtWidgets.QApplication(sys.argv)
    window = MainWindow()
    window.show()
    sys.exit(app.exec_())

---

🎯 النتيجة

• عند تشغيل البرنامج تظهر قائمة منسدلة تحتوي على لغات البرمجة.
• يختار المستخدم لغة ويضغط على زر "موافق".
• النتيجة تظهر في الـ QLabel أسفل الزر.

---

🔜 في الدرس العاشر سنتعلم كيف نستخدم QSpinBox و QDoubleSpinBox لإدخال الأعداد.