Appending an image to itemList of QFormLayout widgets

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 ?

CEO.

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

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)))

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

Could the self.tab.setItem(row_number, column_number, QtablewidgetItem(str(data))) be where the issue is coming from?

self.passlbtx is a QLineEdit for appending the varbinary data retrieved and displayed in a column of the qtablewidget.

@mrjj

mrjj

Hi

Well the
QTableWidgetItem(str(data))
part tried to make str out of data but it complains about the reverse
"a bytes-like object is required, not 'str' "
so I think it must be related to when you do the other way.

I think maybe from here
imgcon = bytes(self.passlbbtx.text(), 'utf-8')

as QLineEdit only contains QString not Qbytearry or the binary stream you read from database.

Would it not be possible to directly read it into the image/pixmap and not via a QLineEdit ?

CEO.

@mrjj please kindly see this thread:

https://github.com/python-pillow/Pillow/issues/5712

CEO.

@mrjj I want the images to be changing as different row selection is made on the qtablewidget

mrjj

@CEO
Hi

I want the images to be changing as different row selection is made on the qtablewidget

But are those rows a complete record and you want to show its image in its label or
do you mean you click on some name in tablewidget and somewhere else it show
the full record and you want to switch data there ?

def retrieval(self):

does this get the image ok ?
That is also directly from DB.

update:
ah its names in listwidget and picture somewhere else.
alt text

CEO.

@mrjj thanks for your effort.

The table is a complete record. I wouldn't mind you use a teamviewer to access my system to see what I'm talking about. The qtablewidget is a complete record. Ignore those strange characters you see scattered there, it happened when I was trying some things.

See the algorithm:

When you click on the search button, all the records in the database are retrieved and get displayed on the qtablewidget cells. There are 22 attributes in the database table. I hid five (5) of them from being displayed on the qtablewidget. 17 gets displayed. The data for the photo in the database is varbinary but gets retrieved in the qtab as a string.

Below the qtablewidget, I created a qformlayout with qwidgets. The QLineEdits are appended to the qtablewidget such that the record of any row selected will be displayed in their corresponding qLineEdit. one of the qlineEdits is self.passlbtx . This is for the photo data in the tablewidget column which is already in string.

There is a qpixmap meant for the display of the photo of the selected row.

The self.passlbtx qlineEdit data is already in string. So it is expected of the self.passlbtx qLineEdit data to be converted to byte and then jpg image so the image can display in the qpixmap.

I know very well you can resolve it, I just think you're not understanding me. I believe it's a simple thing for you. I am attaching a photo to this post. In this photo, the first row of the qtab was selected (highlighted), thereby appending the data of the row in the qformlayout qlineEdits. Notice the image did not display, meanwhile there is a column for image data there, the texts of the image data is displayed in the qLineEdit of image byte label. So how do I make the image display in jpg or jpeg or png format in the qpixmap there?