[SOLVED]QSS for changing the width of the drop-down button

Aaron Hou

Hello everyone, I want to know that how to change the width of the ComboBox ArrowButton with qss, when I set the QDateEdit's property "calendarPopup" checked? Just like the pic:
link text
Thank you!

Vitek

@arrowhou There is no picture in your message.

Aaron Hou

@Vitek I don't know how to attatch a picture, but you can click the link and see the picture.
Thank you!

Chris Kawa

You can style the drop down button with QComboBox::drop-down sub-control and the arrow inside it with QComboBox::down-arrow. Here's an example: Customizing QComboBox.

Aaron Hou

@Chris-Kawa Yes, it can affect the common QComboBox, but it can not change the display of the drop-down button in the QDateEdit.

Chris Kawa

Ah yes, sorry. It seems QDateEdit::drop-down respects some of the properties but not width :/
If you're changing the background color or borders too then you might get away with adjusting margins, at least for a visual effect.
But in general this seems to be a bug so I'd consider reporting it on the bug-tracker.

Aaron Hou

Thank you very much!
I have accomplished it with qss myself!

Chris Kawa

Great. Can you share how?

Aaron Hou

Certainly, but I don't know how to insert code. They are just like this:

QDateEdit{
        border-radius: 5px;
        padding: 1px 10px 1px 5px;
        border: 1px solid #5CACEE;
        min-height: 30px;
}

QDateEdit::drop-down {
	subcontrol-origin: padding;
	subcontrol-position: top right;
	**width: 35px; **
	border-left-width: 1px;
	border-left-style: solid;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
	border-left-color: #5CACEE;
}

QDateEdit::down-arrow {
  border-image: url(:/Resources/array_down.png);
	height:30px;
	width:30px;
}

[edit: added missing coding tags ``` SGaist]