Appending an image to itemList of QFormLayout widgets

CEO.

Hello,

I am finding it difficult to display retrieved photo varbinary data as a photo (an image). I have a qtablewidget where the retrieved data are stored. The varbinary data gets displayed there. I am coding in Python, managing my database with Microsoft SQL, pyodbc

I have a qformLayout below it where I append the data of the qTablewidget to. Now in the qformlayout, I want the photo to display, not the varbinary text. How do I go about it?

NOTE: I successfully retrieved my all the records and append them in their respective form cell when highlighted, my challenge is displaying the retrieved varbinary data as an image, not byte.

Here are some of the codes I have tried:

   itemList.append(self.passlb)
   

 for row in rows:
 for col in range(self.tab.columnCount()):
    itemArray = self.tab.item(row, col)
    text = "" if itemArray is None else itemArray.text()

     if (col == 14):
        itemList[12].open('rb')

passlb = the passport photograph label i.e QLabel("Passport photo")
in my database table, the passport is in column 14, in my qformlayout, the passport is appended in row 12

SGaist

Hi,

What format are these images ?
Depending on that, you can create a QImage from the binary data to later convert as QPixmap for QLabel.

CEO.

@SGaist I said I stored it in the database with varbinary data type.

Gojir4

@CEO said in Appending an image to itemList of QFormLayout widgets:

@SGaist I said I stored it in the database with varbinary data type.

And that's exactly what @SGaist's answer is about. He doesn't ask "What type of data is" but "What format are these images" means what format of image do you store ? PNG ? JPG ? ... so QImage's constructor know how to interpret binary data...

CEO.

jpg and png.

CEO.

@mrjj attention please

SGaist

Since you have standard image formats stored then again:

@SGaist said in Appending an image to itemList of QFormLayout widgets:

Depending on that, you can create a QImage from the binary data to later convert as QPixmap for QLabel.

CEO.

@SGaist hello,
Would you mind to write some lines of code? I will appreciate it.

SGaist

QLabel label;
label.setPixmap(QPixmap::fromImage(QImage(databaseImageData)));
label.show();

CEO.

@SGaist thanks for taking your time to help me. I decided to do a little sketch of what I want in a simpler project. I will drop the code here.

See, in this program, data is retrieved from the database and the data is appended in their corresponding qLineEdits. The data are: photo stored in varbinary(max) in the database, dateRecorded and photopath. Mind you, this is just an example to pass my message better, my original project is very long, so I choose to use this sketchy one.

Now, the retrieved data will be displayed as texts in the qLineEdits (self.imgbyt, self.dattetx2, self.pixtx2)

the self.imgbyt QLineEdit will hold the image data which displays as a text in the QLineEdit ( in bytes form).

I want the text in the self.imgbyt QLineEdit to be converted to jpg or jpeg image so the image can be displayed on the qpixmap

Here's the code for the openFile function. This is to select images to upload when saving record.

   def openfile(self):
    try:
        fdate = datetime.datetime.now()
        strfd = str(fdate)
        self.datte.setText(strfd)
        fname, _ = QFileDialog.getOpenFileName(self, 'Open', 'c:\\', "image Files (*.jpg *.png)")
        self.img = open(fname, 'rb')
        self.pixL.setPixmap(QPixmap(fname).scaled(250, 250))
        self.pixTx.setText(fname)
        self.pixL.setText(self.img)
        #print(self.pixL.setText(self.img))

    except Exception as err:
     print(err)

This is the code for the retrieval function.

  def retrieval(self):
          self.db_connection()
          sch = self.srch.text()
          try:
              self.cursor.execute("SELECT * FROM pixxdate WHERE photopath LIKE ? OR imagedata LIKE ? OR dateRecorded LIKE ?",(sch,sch,sch) )
              row = self.cursor.fetchone()
              print(row)
              if row:
                  self.imgbyt.setText(str(row[2]))
                  self.pixtx2.setText((row[1]))
                  self.dattex2.setText(str(row[3]))
  
              imgg = self.imgbyt.text()
              imgfileobj = open(imgg)
              imgbinary = imgfileobj.read()
              imgstrm = io.BytesIO(imgbinary)
              imgfile = Image.open(imgstrm)
              print("imgfile.size = %s" %imgfile.size)
              self.pixL2.setText(imgfileobj)
  
  
          except Exception as err:
              print(err)

CEO.

@SGaist I have resolved it. I used:

   def retrieval(self):
  
          self.db_connection()
  
          sch = self.srch.text()
  
          try:
  
              self.cursor.execute("SELECT * FROM pixxdate WHERE photopath LIKE ? OR imagedata LIKE ? OR dateRecorded LIKE ?",(sch,sch,sch) )
  
              row = self.cursor.fetchone()
  
              print(row)
  
              if row:
  
                  self.imgbyt.setText(str(row[2]))
  
                  self.pixtx2.setText((row[1]))
  
                  self.dattex2.setText(str(row[3]))
  
  
  
              imgstrm = io.BytesIO(row[2])
  
              imgfile = Image.open(imgstrm)
  
              print("imgfile.size = %s" % str(imgfile.size))
  
              self.pixL2.setPixmap(ImageQt.toqpixmap(imgfile))
  
  
  
  
  
          except Exception as err:
  
              print(err)

I am now trying to apply same logic in my main project with the qtablewidget and qformlayout widgets

CEO.

@mrjj please I need your help here. I know you can help me make the photo display in an arrayList

SGaist

Why are you going through a conversion rather than using the content of row[2] directly to build your QImage ?

@CEO said in Appending an image to itemList of QFormLayout widgets:

@mrjj please I need your help here. I know you can help me make the photo display in an arrayList

Using a QListView and using the decoration would likely be the simplest way to show your images.

In any case, what did you try until now ?
What is your exact issue ?

CEO.

@SGaist hello, I've achieved my aim with that. You didn't tell me explanatorily when I needed a straight sample code from you to ease my stress.

That conversion was to convert the row 2 in the database to jpg image. It's not making use of the texts in the qLineEdits (self.imgbyt). I tried that but encountered error.

You don't give someone straight code even when one is already too stressed.

Now, I am trying to make a retrieved varbinary data display in the qpixmap in my main project.

CEO.

part of the sql data retrieval code:

                       result = self.cursor.fetchall()             
                     for row_number, row_data in enumerate(result):             
                         self.tab.insertRow(row_number)             
                         for column_number, data in enumerate(row_data):             
                             self.tab.setItem(row_number, column_number, QTableWidgetItem(str(data)))

part of the itemsArray code:

                              for row in rows:                      
                                  for col in range(self.tab.columnCount()):                      
                                      itemArray = self.tab.item(row, col)
                
                                    

                     
                   text = "" if itemArray is None else itemArray.text()                 
                
                     if (col == 14):
                    itemList[12].setText(text)
                    imgcon = self.passlbbtx.text()
                    imgstrm = io.BytesIO(imgcon)
                    imgfile = Image.open(imgstrm)
                    self.passlb.setPixmap(ImageQt.toqpixmap(imgfile).scaled(250, 250))

it runs but with an error message: "a bytes-like object is required, not 'str' "

mrjj

Hi

it runs but with an error message: "a bytes-like object is required, not 'str' "

for which line ?

imgstrm = io.BytesIO(imgcon) ?

in the original / first sample you get it from
imgstrm = io.BytesIO(row[2])

so is that the same data in your real app you give it ?

CEO.

@mrjj heeeeyyyyy you're here. From these lines:

               imgcon = bytes(self.passlbbtx.text(), 'utf-8')
                imgstrm = io.BytesIO(imgcon)
                imgfile = Image.open(imgstrm)

CEO.

@mrjj said in Appending an image to itemList of QFormLayout widgets:

Hi

it runs but with an error message: "a bytes-like object is required, not 'str' "

for which line ?

imgstrm = io.BytesIO(imgcon) ?

in the original / first sample you get it from
imgstrm = io.BytesIO(row[2])

so is that the same data in your real app you give it ?

No, that's not actually the original. That's just like a rough work which I was using to test. That one was without a Qtablewidget for display of the retrieved data.

CEO.

@CEO said in Appending an image to itemList of QFormLayout widgets:

@mrjj heeeeyyyyy you're here. From these lines:

               imgcon = bytes(self.passlbbtx.text(), 'utf-8')
                imgstrm = io.BytesIO(imgcon)
                imgfile = Image.open(imgstrm)

You would notice I tried to do a conversion from string to byte here. This is because the data is automatically appended in the QLineEdits of the qFormLayout as a string after it was retrieved and displayed in the cells of the qtablewidget as a byte.

So I was trying to convert that string to byte and then convert the byte to jpg/jpeg image format.

mrjj

@CEO
Hi
In the orignal code, you convert directly from io.BytesIO(row[2]) is is directly from self.cursor.execute
so I guess it contains QBytearray in a Qvariant

However, in real app it seems you are trying to take it from a Widget self.passlbbtx.text(),
and I'm not sure that can work as its a QString.

what is passlbbtx ?