How to: Using Qt Designer to make gradients

Post Reply
User avatar
Vadi
Posts: 4711
Joined: Sat Mar 14, 2009 3:13 pm

How to: Using Qt Designer to make gradients

Post by Vadi » Tue Jun 15, 2010 12:01 am

This shows how to make fancy label gradients via Qt Designer.

Firstly, download it from here: http://qt.nokia.com/downloads - select LGPL, and download the "Qt SDK: Complete Development Environment" for your platform. Start Qt Designer, and you'll get something like this:
Image
Type label top-left, and drag the label over to the window:
Image
Right-click:
Image
Besides the Add Gradient button, click the down arrow and select background-color:
Image
Hit New, see editor. You can click and drag the on the things blue arrows are pointing at to change the look:
Image
When done, hit Ok, Ok, get CSS code:
Image
Copy it, and use it with the setLabelStyleSheet like so:
Code: [show] | [select all] lua
setLabelStyleSheet("mylabel", [[background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:0.681, y2:0.778, stop:0.29902 rgba(0, 0, 0, 255), stop:1 rgba(255, 255, 255, 255));]])
See result:
Image

My example is quite ugly, but I'm sure others have better artistic skills than me (and more time to spend fiddling).

Post Reply

Who is online

Users browsing this forum: No registered users and 1 guest