الدرس 6 من سلسلة PyQt: إدراج الصور في الواجهات الرسومية باستخدام QLabel

في PyQt يمكننا استخدام QLabel ليس فقط لعرض النصوص، ولكن أيضًا لعرض الصور بسهولة عبر QPixmap.

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

---

📂 خطوات العمل

استيراد المكتبات اللازمة:

• QApplication لإنشاء التطبيق.
• QWidget كنافذة رئيسية.
• QLabel لعرض الصورة.
• QPixmap لتحميل الصورة.

إنشاء كائن QLabel وإسناد صورة إليه عبر QPixmap.
ضبط حجم الصورة إذا أردت أن تتناسب مع المساحة.
عرض النافذة.

---

💻 مثال عملي

import sys
from PyQt5.QtWidgets import QApplication, QWidget, QLabel
from PyQt5.QtGui import QPixmap

class MyWindow(QWidget):
    def __init__(self):
        super().__init__()

        self.setWindowTitle("عرض صورة في PyQt")
        self.setGeometry(300, 200, 400, 300)

        # إنشاء عنصر QLabel
        self.label = QLabel(self)
        self.label.setGeometry(50, 50, 300, 200)

        # تحميل الصورة عبر QPixmap
        pixmap = QPixmap("my_image.png")  # ضع اسم ملف الصورة هنا

        # ضبط الصورة داخل الـ QLabel
        self.label.setPixmap(pixmap)

        # جعل الصورة تناسب حجم الـ QLabel
        self.label.setScaledContents(True)

app = QApplication(sys.argv)
window = MyWindow()
window.show()
sys.exit(app.exec_())

---

🔍 ملاحظات:

• يجب أن تكون الصورة (my_image.png) موجودة في نفس مجلد الكود، أو تضع المسار الكامل.
• setScaledContents(True) يجعل الصورة تتناسب مع حجم الـ QLabel.
• يمكنك استخدام صيغ مثل .jpg, .png, .gif.

---

🎯 التمرين

أنشئ نافذة PyQt تحتوي على:

1. QLabel لعرض صورة.
2. زرين:
   • الزر الأول لعرض صورة image1.png.
   • الزر الثاني لعرض صورة image2.png.
3. عند الضغط على أي زر، تتغير الصورة في الـ QLabel.

---

💻 الحل

import sys
from PyQt5.QtWidgets import QApplication, QWidget, QLabel, QPushButton
from PyQt5.QtGui import QPixmap

class MyWindow(QWidget):
    def __init__(self):
        super().__init__()

        self.setWindowTitle("تغيير الصور في PyQt")
        self.setGeometry(300, 200, 400, 350)

        # QLabel لعرض الصورة
        self.label = QLabel(self)
        self.label.setGeometry(50, 50, 300, 200)
        self.label.setScaledContents(True)

        # زر عرض الصورة الأولى
        self.btn1 = QPushButton("عرض الصورة 1", self)
        self.btn1.setGeometry(50, 270, 120, 30)
        self.btn1.clicked.connect(self.show_image1)

        # زر عرض الصورة الثانية
        self.btn2 = QPushButton("عرض الصورة 2", self)
        self.btn2.setGeometry(230, 270, 120, 30)
        self.btn2.clicked.connect(self.show_image2)

    def show_image1(self):
        pixmap = QPixmap("image1.png")  # ضع اسم الصورة الأولى
        self.label.setPixmap(pixmap)

    def show_image2(self):
        pixmap = QPixmap("image2.png")  # ضع اسم الصورة الثانية
        self.label.setPixmap(pixmap)

# تشغيل التطبيق
app = QApplication(sys.argv)
window = MyWindow()
window.show()
sys.exit(app.exec_())

---

📌 ملاحظات:

• ضع الصور (image1.png و image2.png) في نفس مجلد ملف الكود.
• يمكنك اختيار أي صور صغيرة الحجم حتى تظهر بشكل جيد.
• جرب استخدام setScaledContents(True) للحفاظ على تناسب الصورة.

---

و هذه نسخة مطورة من التمرين بحيث يمكن اختيار أي صورة من الكمبيوتر عبر QFileDialog.

---

💻 الكود

import sys
from PyQt5.QtWidgets import QApplication, QWidget, QLabel, QPushButton, QFileDialog
from PyQt5.QtGui import QPixmap

class MyWindow(QWidget):
    def __init__(self):
        super().__init__()

        self.setWindowTitle("عارض الصور في PyQt")
        self.setGeometry(300, 200, 400, 350)

        # QLabel لعرض الصورة
        self.label = QLabel("اختر صورة لعرضها", self)
        self.label.setGeometry(50, 50, 300, 200)
        self.label.setScaledContents(True)

        # زر اختيار الصورة
        self.btn = QPushButton("اختر صورة", self)
        self.btn.setGeometry(140, 270, 120, 30)
        self.btn.clicked.connect(self.open_image)

    def open_image(self):
        # فتح نافذة اختيار ملف
        file_path, _ = QFileDialog.getOpenFileName(
            self,
            "اختر صورة",
            "",
            "Images (*.png *.jpg *.jpeg *.bmp *.gif)"
        )
        
        if file_path:  # إذا تم اختيار صورة
            pixmap = QPixmap(file_path)
            self.label.setPixmap(pixmap)

# تشغيل التطبيق
app = QApplication(sys.argv)
window = MyWindow()
window.show()
sys.exit(app.exec_())

---

📌 مزايا النسخة الجديدة

• يمكن اختيار أي صورة من جهازك مباشرة.
• يدعم صيغ الصور الشائعة مثل PNG, JPG, BMP, GIF.
• النص الافتراضي يظهر في الـ QLabel إذا لم تُعرض صورة بعد.