How to display a little image near a QSlider

[franco.amato]

Hi to all,
I would display a little image at the left of a QSlider. The slider change the volume of a song and instead of put the text Volume: near the slider
I would display a little icon representing the volume so the user can know the meaning of the slider.
I would layout orizontally the icon and the slider so:

m_panPixmap = new QLabel;
QPixmap panPixmap(":/images/pan.png");
panPixmap.scaled(5,5);
m_panPixmap->setPixmap(panPixmap);
 
m_panSlider = new QSlider(Qt::Horizontal);
m_panSlider->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
m_panSlider->setMinimum( -100 );
m_panSlider->setMaximum( 100 );
m_panSlider->setValue( 0 );
 
QVBoxLayout panLayout;
panLayout.addWidget(m_panPixmap);
panLayout.addWidget(m_panSlider);

m_panPixmap = new QLabel;
QPixmap panPixmap(":/images/pan.png");
panPixmap.scaled(5,5);
m_panPixmap->setPixmap(panPixmap);

m_panSlider = new QSlider(Qt::Horizontal);
m_panSlider->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
m_panSlider->setMinimum( -100 );
m_panSlider->setMaximum( 100 );
m_panSlider->setValue( 0 );

QVBoxLayout panLayout;
panLayout.addWidget(m_panPixmap);
panLayout.addWidget(m_panSlider);

To copy to clipboard, switch view to plain text mode 

and then add to the main vertical layout

QVBoxLayout* vl = new QVBoxLayout();
vl->setSpacing(20);
vl->addLayout(ll);
vl->addStretch(1);
vl->addLayout(&panLayout); //<-- this is the pan layout
..more code

QVBoxLayout* vl = new QVBoxLayout();
vl->setSpacing(20);
vl->addLayout(ll);
vl->addStretch(1);
vl->addLayout(&panLayout); //<-- this is the pan layout
..more code

To copy to clipboard, switch view to plain text mode 

My problem is that the image is displayed too big and it break the layout. The image and the slider are not displayed correctly.
How can I solve my problem?

Best Regards,
Franco

[franco.amato]

I did a mistake in the previous post.
The real code is:

QHBoxLayout panLayout; //horizontal and not vertical
panLayout.addWidget(m_panPixmap);
panLayout.addWidget(m_panSlider);

QHBoxLayout panLayout; //horizontal and not vertical
panLayout.addWidget(m_panPixmap);
panLayout.addWidget(m_panSlider);

To copy to clipboard, switch view to plain text mode 

but in my program the code is correct.
I don't know how to solve my problem

Regards,

[franco.amato]

I changed the code inserting a label instead of an image but the result is still wrong.
I tried to change all without results.
I post some code:

PanelInfo::PanelInfo(QWidget* parent /* = 0 */ )
: QFrame(parent),
  m_sound(0)
{
  setFrameStyle( QFrame::Box | QFrame::Raised );
  setMinimumSize( QSize(150, 240) );
  setSizePolicy( QSizePolicy::MinimumExpanding, QSizePolicy::Fixed );
 
  /* labels */
  m_durationLabel = new QLabel("DURATION");
  m_channelsLabel = new QLabel("CHANNELS");
  m_freqLabel = new QLabel("FREQ");
  m_bitsLabel = new QLabel("BITS");
 
  m_durationLabel->setMinimumSize( QSize(100, 20) );
  m_channelsLabel->setMinimumSize( QSize(100, 20) );
  m_freqLabel->setMinimumSize( QSize(100, 20) );
  m_bitsLabel->setMinimumSize( QSize(100, 20) );
 
  m_durationLabel->setSizePolicy( QSizePolicy::Preferred, QSizePolicy::Fixed );
  m_channelsLabel->setSizePolicy( QSizePolicy::Preferred, QSizePolicy::Fixed );
  m_freqLabel->setSizePolicy( QSizePolicy::Preferred, QSizePolicy::Fixed );
  m_bitsLabel->setSizePolicy( QSizePolicy::Preferred, QSizePolicy::Fixed );
 
  QVBoxLayout* ll = new QVBoxLayout();
  ll->setContentsMargins(0, 0, 0, 0);
  ll->setSpacing(0);
  ll->addWidget( m_durationLabel );
  ll->addWidget( m_channelsLabel );
  ll->addWidget( m_freqLabel );
  ll->addWidget( m_bitsLabel );
 
  m_panLabel = new QLabel("Pan"); //<----------THIS IS THE PROBLEM
 
  m_panSlider = new QSlider(Qt::Horizontal);
  m_panSlider->setMinimumSize(50,20);
  m_panSlider->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
  m_panSlider->setMinimum( -100 );
  m_panSlider->setMaximum( 100 );
  m_panSlider->setValue( 0 );
 
  QHBoxLayout panLayout;   //<----this layout holds the label and the slider but the result is odd
  panLayout.addWidget(m_panLabel);
  panLayout.addWidget(m_panSlider);
 
  m_volSlider = new QSlider(Qt::Horizontal);
  m_volSlider->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
  m_volSlider->setMinimum( 0 );
  m_volSlider->setMaximum( 100 );
  m_volSlider->setValue( 100 );
 
  /* spinbox */
  m_freqControl = new QDoubleSpinBox();
  m_freqControl->setMinimum( 0.0 );
  m_freqControl->setMaximum( 3.0 );
  m_freqControl->setValue( 1.0 );
  m_freqControl->setSingleStep( 0.1 );
  m_freqControl->setWrapping(1);
 
  QLabel* markerLabel = new QLabel("Markers: ");
  QLineEdit *numMarkers = new QLineEdit("0");
  numMarkers->setMinimumSize(10,20);
  numMarkers->setMaximumWidth(30);
  numMarkers->setSizePolicy(QSizePolicy::Minimum, QSizePolicy::Fixed);
  numMarkers->setReadOnly(true);
  QHBoxLayout* hl = new QHBoxLayout();
hl->setContentsMargins(0, 0, 0, 0);
hl->setSpacing(0);
hl->addWidget( markerLabel );
hl->addWidget( numMarkers );
 
QVBoxLayout* vl = new QVBoxLayout();
vl->setSpacing(20);
vl->addLayout(ll);
vl->addStretch(1);
vl->addLayout(&panLayout);
vl->addWidget(m_volSlider);
vl->addWidget(m_freqControl);
 
vl->addLayout(hl);
setLayout(vl);
}

PanelInfo::PanelInfo(QWidget* parent /* = 0 */ )
: QFrame(parent),
  m_sound(0)
{
  setFrameStyle( QFrame::Box | QFrame::Raised );
  setMinimumSize( QSize(150, 240) );
  setSizePolicy( QSizePolicy::MinimumExpanding, QSizePolicy::Fixed );

  /* labels */
  m_durationLabel = new QLabel("DURATION");
  m_channelsLabel = new QLabel("CHANNELS");
  m_freqLabel = new QLabel("FREQ");
  m_bitsLabel = new QLabel("BITS");

  m_durationLabel->setMinimumSize( QSize(100, 20) );
  m_channelsLabel->setMinimumSize( QSize(100, 20) );
  m_freqLabel->setMinimumSize( QSize(100, 20) );
  m_bitsLabel->setMinimumSize( QSize(100, 20) );

  m_durationLabel->setSizePolicy( QSizePolicy::Preferred, QSizePolicy::Fixed );
  m_channelsLabel->setSizePolicy( QSizePolicy::Preferred, QSizePolicy::Fixed );
  m_freqLabel->setSizePolicy( QSizePolicy::Preferred, QSizePolicy::Fixed );
  m_bitsLabel->setSizePolicy( QSizePolicy::Preferred, QSizePolicy::Fixed );

  QVBoxLayout* ll = new QVBoxLayout();
  ll->setContentsMargins(0, 0, 0, 0);
  ll->setSpacing(0);
  ll->addWidget( m_durationLabel );
  ll->addWidget( m_channelsLabel );
  ll->addWidget( m_freqLabel );
  ll->addWidget( m_bitsLabel );

  m_panLabel = new QLabel("Pan"); //<----------THIS IS THE PROBLEM
	
  m_panSlider = new QSlider(Qt::Horizontal);
  m_panSlider->setMinimumSize(50,20);
  m_panSlider->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
  m_panSlider->setMinimum( -100 );
  m_panSlider->setMaximum( 100 );
  m_panSlider->setValue( 0 );

  QHBoxLayout panLayout;   //<----this layout holds the label and the slider but the result is odd
  panLayout.addWidget(m_panLabel);
  panLayout.addWidget(m_panSlider);

  m_volSlider = new QSlider(Qt::Horizontal);
  m_volSlider->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
  m_volSlider->setMinimum( 0 );
  m_volSlider->setMaximum( 100 );
  m_volSlider->setValue( 100 );

  /* spinbox */
  m_freqControl = new QDoubleSpinBox();
  m_freqControl->setMinimum( 0.0 );
  m_freqControl->setMaximum( 3.0 );
  m_freqControl->setValue( 1.0 );
  m_freqControl->setSingleStep( 0.1 );
  m_freqControl->setWrapping(1);

  QLabel* markerLabel = new QLabel("Markers: ");
  QLineEdit *numMarkers = new QLineEdit("0");
  numMarkers->setMinimumSize(10,20);
  numMarkers->setMaximumWidth(30);
  numMarkers->setSizePolicy(QSizePolicy::Minimum, QSizePolicy::Fixed);
  numMarkers->setReadOnly(true);
  QHBoxLayout* hl = new QHBoxLayout();
hl->setContentsMargins(0, 0, 0, 0);
hl->setSpacing(0);
hl->addWidget( markerLabel );
hl->addWidget( numMarkers );

QVBoxLayout* vl = new QVBoxLayout();
vl->setSpacing(20);
vl->addLayout(ll);
vl->addStretch(1);
vl->addLayout(&panLayout);
vl->addWidget(m_volSlider);
vl->addWidget(m_freqControl);

vl->addLayout(hl);
setLayout(vl);
}

To copy to clipboard, switch view to plain text mode 

and the result is this image.jpg.
Where I drawn an arrow you can see that the QSlider is broken and it's painted over the QLabel "pan".
I really don't understand where my code is wrong.
I need help.

Best Regards,
Franco

[Lykurg]

Once again it is a newbie error you do. At the end of your block your layout get distroyed and so both elements are positioned (0,0). Create your layout on the heap (as you do with the other layoute) and all will be fine.

[franco.amato]

Once again it is a newbie error you do. At the end of your block your layout get distroyed and so both elements are positioned (0,0). Create your layout on the heap (as you do with the other layoute) and all will be fine.

Yes it works...thank you
I have a last problem.
I created a horizontal layout with a Label, a slider and again a label so:

QLabel* volLabel = new QLabel("Vol");
m_volValue = new QLabel;
m_volValue->setNum(100);
 
m_volSlider = new QSlider(Qt::Horizontal);
m_volSlider->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
m_volSlider->setMinimum( 0 );
m_volSlider->setMaximum( 100 );
m_volSlider->setValue( 100 );
 
QHBoxLayout* volLayout = new QHBoxLayout;
volLayout->setAlignment(Qt::AlignLeft);
volLayout->setSpacing(5);
volLayout->addWidget(volLabel);
volLayout->addWidget(m_volSlider);
volLayout->addWidget(m_volValue);

QLabel* volLabel = new QLabel("Vol");
m_volValue = new QLabel;
m_volValue->setNum(100);

m_volSlider = new QSlider(Qt::Horizontal);
m_volSlider->setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
m_volSlider->setMinimum( 0 );
m_volSlider->setMaximum( 100 );
m_volSlider->setValue( 100 );

QHBoxLayout* volLayout = new QHBoxLayout;
volLayout->setAlignment(Qt::AlignLeft);
volLayout->setSpacing(5);
volLayout->addWidget(volLabel);
volLayout->addWidget(m_volSlider);
volLayout->addWidget(m_volValue);

To copy to clipboard, switch view to plain text mode 

finally I connect the value of the last Label with the slider:

connect(m_volSlider,   SIGNAL( valueChanged(int) ),    m_volValue, SLOT(setNum(int) )  );

connect(m_volSlider,   SIGNAL( valueChanged(int) ),    m_volValue, SLOT(setNum(int) )  );

To copy to clipboard, switch view to plain text mode 

The problem is that when the value of the volume label change it modify the size of the widget because it's size change too.
How can I fix it?
I set the size policy of the widget containing the layout to fixed without success so:

PanelInfo::PanelInfo(QWidget* parent /* = 0 */ )
: QFrame(parent),
  m_sound(0)
{
setFrameStyle( QFrame::Box | QFrame::Raised );
setMinimumSize( QSize(135, 240) );
setSizePolicy( QSizePolicy::Fixed, QSizePolicy::Fixed );
...more code..

PanelInfo::PanelInfo(QWidget* parent /* = 0 */ )
: QFrame(parent),
  m_sound(0)
{
setFrameStyle( QFrame::Box | QFrame::Raised );
setMinimumSize( QSize(135, 240) );
setSizePolicy( QSizePolicy::Fixed, QSizePolicy::Fixed );
...more code..

To copy to clipboard, switch view to plain text mode 

I hope to get help as I tried to change all.
Best regards,
Franco

[Lykurg]

use QWidget::setFixedSize().

[franco.amato]

use QWidget::setFixedSize().

Hi the size of the widget change when the value of the label change from 1 to 2 digits ( for example from 9 to 10 ) and from 2 to 3 digits ( for example from 99 to 100 ) and viceversa.
The minimum value is 0 and the maximum is 100.

Regards,
Franco

[Lykurg]

Hi the size of the widget change when the value of the label change from 1 to 2 digits ( for example from 9 to 10 ) and from 2 to 3 digits ( for example from 99 to 100 ) and viceversa.

Yes and therefore use QWidget::setFixedSize() for the label with a proper size that there is enough space for 3 digits. Then the label wont resize ==> the frame/layout neither.

[franco.amato]

Yes and therefore use QWidget::setFixedSize() for the label with a proper size that there is enough space for 3 digits. Then the label wont resize ==> the frame/layout neither.

Thank you very much.
I'll try.

Regards