How do I change the appearance of the widgets ?

[ManiRon]

I want create a window look like the below image

Is there any way to create a widget like this ?

Thanks in Advance

[thaiboydigital]

https://wiki.qt.io/How_to_Change_the_Background_Color_of_QWidget
https://doc.qt.io/QT-5/style-reference.html,

you can also use PaintEvent to draw widgets , by hand

[sierdzio]

@maniron said in How do I change the appearance of the widgets ?:

Is there any way to create a widget like this ?

Yes.

Use Qt Style Sheets to tweak how widgets looks.

For custom icons inside QLineEdit - well that will require some custom subclass I think. Unless you make a custom widget: QFrame, inside QLabel (for icon) and QLineEdit in a horizontal layout.

I assumed you're using QtWidgets. If you want Qt Quick, then look into https://doc.qt.io/qt-5/qtquickcontrols2-styles.html

[ManiRon]

@sierdzio Whether QQuickcontrols is available for QT Version 5.5.0

[sierdzio]

@maniron said in How do I change the appearance of the widgets ?:

@sierdzio Whether QQuickcontrols is available for QT Version 5.5.0

No, they were added in 5.7.

For 5.5.0, you'll need to go with Controls 1, which have different styling API (check the docs that came with your installation).

If you only can - upgrade Qt. 5.5 is very old.

[thaiboydigital]

This post is deleted!

[ManiRon]

@sierdzio I tried using stylesheet but it is nowhere near the image which i shared . This below is the image i edited using stylesheet

[sierdzio]

So you are using QtWidgets after all? Or why do you ask about QtQuick? I'm confused.

Sorry I won't write that stylesheet for you. What you have looks like you've got pretty close to how the target looks. A few tweaks here and there and it should be roughly OK. To get a transparent window you'll need to set proper window attribute for your main widget (and it may not work on some platforms).

[ManiRon]

@sierdzio said in How do I change the appearance of the widgets ?:

window attribute

What do you mean by window attribute ?

[J.Hilk]

@maniron
IIRC:
setAttribute(Qt::WA_TranslucentBackground, true);

[Pradeep P N]

@maniron
Also please check windowOpacity. [ void setWindowOpacity(qreal level) ]

You are also missing the Layouts & Alignments.

All the best

[ManiRon]

@j-hilk
It appears same even after setting the window attribute.

[sierdzio]

@maniron said in How do I change the appearance of the widgets ?:

@j-hilk
It appears same even after setting the window attribute.

You probably didn't specify alpha channel when setting background-color in your stylesheet.

[Pradeep P N]

@maniron
Did you try to setWindowOpacity for your widget ?

[ManiRon]

@pradeep-p-n

"You are also missing the Layouts & Alignments."

I'm doing a sample and my main aim is not the layout and allignment, i need to achieve that colour.

"Also please check windowOpacity. [ void setWindowOpacity(qreal level) ]"

I'm trying this out will let you know if it works or not.

thank you for your time

[ManiRon]

@sierdzio

sorry sierdzio, setting the attribute is working but it makes the window completely transparent. And I'm specifying the alpha channel also.

[J.Hilk]

@maniron said in How do I change the appearance of the widgets ?:

@sierdzio

sorry sierdzio, setting the attribute is working but it makes the window completely transparent. And I'm specifying the alpha channel also.

are you sure? setWindowOpacity makes the complete window (including child widgets) transparent, WA_TranslucentBackground should only effect the background

maybe sharing some code, would be helpful

[Pradeep P N]

@maniron Please share some sample code.