I'm creating my own QPushButton and styling it up. What I've noticed happening is the text slightly displacing if the button is pushed and checked (hardly surprising, as this is making it look like a button). I don't want this to happen though. I've tried looking through the style-sheet properties I can change to suppress this behaviour, but with no luck. Is there a way in which I can achieve this?
Here is the button in the two states. If superimposed or viewed one after the other in an image viewer, you can see the text displacement.
Here is the relevant code:
#include "ModeButton.h"
// The RGB colour codes that we use to help create our dynamic stylesheets. Longer term the colour codes may be moved to a global colour file
const QString ModeButton::m_rgbModeButtonEnabledBorder = QString("rgb(102, 102, 102)");
const QString ModeButton::m_rgbModeButtonEnabledBackground = QString("rgb(153, 153, 153)");
const QString ModeButton::m_rgbModeButtonEnabledText = QString("rgb(102, 102, 102)");
const QString ModeButton::m_rgbModeButtonDisabledBorder = QString("rgb(82, 82, 82)");
const QString ModeButton::m_rgbModeButtonDisabledText = QString("rgb(82, 82, 82)");
const QString ModeButton::m_rgbModeButtonCheckedText = QString("rgb(0, 0, 0)");
const QString ModeButton::m_rgbModeButtonCheckedBackGround = QString("rgb(255, 153, 51)");
// We dynamically create our stylesheets so that we can separate out the colour from the rest of the styling
const QString ModeButton::m_styleSheetEnabledTemplate = QString("QPushButton { color: TEXT_RGB; border: 0px solid BORDER_RGB; border-radius: 7px; background-color: BACKGROUND_RGB; }");
const QString ModeButton::m_styleSheetDisabledTemplate = QString("QPushButton:disabled { border: 0px solid BORDER_RGB; color: TEXT_RGB; }");
const QString ModeButton::m_styleSheetCheckedTemplate = QString("QPushButton:checked { color: TEXT_RGB; border: 0px solid BORDER_RGB; border-radius: 7px; background-color: BACKGROUND_RGB; }");
ModeButton::ModeButton(OperatingModeButtonType a_OperatingModeButtonType, ChannelContainerWidget* ParentContainer, bool DoubleChanneled, int RowSpan)
: QPushButton(GetOperatingModeButtonLabel(a_OperatingModeButtonType), (QWidget*)ParentContainer),
m_OperatingModeButtonType(a_OperatingModeButtonType),
m_DoubleChanneled(DoubleChanneled),
m_RowSpan(RowSpan)
{
ModifyStyle();
setCheckable(true);
setFixedWidth(-1);
}
//-----------------------------------------------------------------------------
QString ModeButton::GetEnabledStyleSheetString()
{
QString styleSheetString = m_styleSheetEnabledTemplate;
styleSheetString.replace("TEXT_RGB", m_rgbModeButtonEnabledText);
styleSheetString.replace("BORDER_RGB", m_rgbModeButtonEnabledBorder);
styleSheetString.replace("BACKGROUND_RGB", m_rgbModeButtonEnabledBackground);
return styleSheetString;
}
//-----------------------------------------------------------------------------
QString ModeButton::GetDisabledStyleSheetString()
{
QString styleSheetString = m_styleSheetDisabledTemplate;
styleSheetString.replace("TEXT_RGB", m_rgbModeButtonDisabledText);
styleSheetString.replace("BORDER_RGB", m_rgbModeButtonDisabledBorder);
return styleSheetString;
}
//-----------------------------------------------------------------------------
QString ModeButton::GetCheckedStyleSheetString()
{
QString styleSheetString = m_styleSheetCheckedTemplate;
styleSheetString.replace("TEXT_RGB", m_rgbModeButtonCheckedText);
styleSheetString.replace("BORDER_RGB", m_rgbModeButtonEnabledBorder);
styleSheetString.replace("BACKGROUND_RGB", m_rgbModeButtonCheckedBackGround);
return styleSheetString;
}
//-----------------------------------------------------------------------------
void ModeButton::ModifyStyle()
{
setStyleSheet(GetEnabledStyleSheetString() + GetDisabledStyleSheetString() + GetCheckedStyleSheetString());
}
///////////////////////////////////////////////////////////////////////////////
Setting both the m_styleSheetEnabledTemplate's and the m_styleSheetCheckedTemplate's padding properties to 0 fixes my problem. I believe the default padding values are different and that's how the text displacement is actually achieved. Thank you @JohannesSchaub-litb for the suggestion to try the padding property.