Aligning Editor to tableView cell

[gabor53]

I have a tableview for reviewing and correcting db data. To change the image stored in the database I created a qpushbutton on top of the tableview cell (as part of a delegate). When you click on the button it opens acqfiledialog.
The problem is that the qpushbutton is the right size but it is not centered on the tableview cell. How can I center it?
Thank you.

[yuvaram]

can you provide a sample code

[gabor53]

@yuvaram
Here is the code:

imagedelegate.cpp:

#include "imagedelegate.h"

ImageDelegate::ImageDelegate(QObject* parent) : QStyledItemDelegate(parent) {

}

QWidget* ImageDelegate::createEditor(QWidget* parent, const QStyleOptionViewItem& option, const QModelIndex& index) const {
  Q_UNUSED(option);
  Q_UNUSED(index);
  return new ImagePickButton(parent);
}

void ImageDelegate::setEditorData(QWidget* editor, const QModelIndex& index) const {
  ImagePickButton* imgPick = qobject_cast<ImagePickButton*>(editor);
  Q_ASSERT(imgPick);
  imgPick->setSelectedFile(index.data(Qt::UserRole).toString());
}

void ImageDelegate::setModelData(QWidget* editor, QAbstractItemModel* model, const QModelIndex& index) const {
  ImagePickButton* imgPick = qobject_cast<ImagePickButton*>(editor);
  Q_ASSERT(imgPick);

  if(imgPick->selectedFile().isEmpty()) {
    model->setData(index, QVariant(), Qt::UserRole);
    model->setData(index, QVariant(), Qt::DecorationRole);
  } else {
    model->setData(index, imgPick->selectedFile(), Qt::UserRole);
    model->setData(index, QIcon(imgPick->selectedFile()), Qt::DecorationRole);
  }
}

void ImageDelegate::updateEditorGeometry(QWidget* editor, const QStyleOptionViewItem& option, const QModelIndex& index) const {
  Q_UNUSED(index);
  editor->setGeometry(option.rect);
}

imagepickbutton:

#include "imagepickbutton.h"

ImagePickButton::ImagePickButton(QWidget* parent) : QWidget(parent) {
  m_mainButton = new QPushButton(tr("Select \n Image"), this);

  m_mainButton->setStyleSheet ("font: bold;"
                               "font-size: 12px;"
                               "background-color: rgba(255, 255, 255, 100);");


  m_mainButton->setMaximumWidth(100);
  m_mainButton->setMinimumWidth (100);
  m_mainButton->setMaximumHeight (100);
  m_mainButton->setMinimumHeight (100);

  QHBoxLayout* mainLay = new QHBoxLayout(this);
  mainLay->addWidget(m_mainButton);

  connect(m_mainButton, &QPushButton::clicked, this, &ImagePickButton::selectImageFile);
}

const QString& ImagePickButton::selectedFile() const {
  return  m_selectedFile;
}

void ImagePickButton::setSelectedFile(const QString& val) {
  if(m_selectedFile == val)
    return;

  m_selectedFile = val;

  if(m_selectedFile.isEmpty()) {
    m_mainButton->setText(tr("Select Image"));
    QFont buttonFont = m_mainButton->font();
    buttonFont.setPointSize(5);
    m_mainButton->setIcon(QIcon());
  } else {
    m_mainButton->setText(QString());
    m_mainButton->setIcon(QIcon(m_selectedFile));
    m_mainButton->setMaximumWidth(100);
    m_mainButton->setMinimumWidth(100);
  }
  emit selectedFileChanged(m_selectedFile);
}

void ImagePickButton::selectImageFile() {
  const QString newFile = QFileDialog::getOpenFileName(this, tr("Open Image"), QString(), tr("Images (*.png *.xpm *.jpg)"));

  if(!newFile.isEmpty())
    setSelectedFile(newFile);
}

[VRonin]

I think the problem comes the layout in ImagePickButton try

m_mainButton->setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);
QGridLayout* mainLay = new QHBoxLayout(this);
mainLay->setSpacing(0);
mainLay->setContentsMargins(0,0,0,0);
mainLay->addWidget(m_mainButton,1,1);
mainLay->addItem(new QSpacerItem(1,1,QSizePolicy::Preferred,QSizePolicy::Expanding),0,1);
mainLay->addItem(new QSpacerItem(1,1,QSizePolicy::Preferred,QSizePolicy::Expanding),2,1);
mainLay->addItem(new QSpacerItem(1,1,QSizePolicy::Expanding,QSizePolicy::Preferred),1,0);
mainLay->addItem(new QSpacerItem(1,1,QSizePolicy::Expanding,QSizePolicy::Preferred),1,2);

[gabor53]

@VRonin
Thank you. This worked with the following changes:

 QGridLayout* mainLay = new QGridLayout(this);