Tag Archives: Qt

Dark Fusion Theme for Qt 5

My favorite new theme (for Windows applications, at least) is the Fusion theme that came with Qt 5. I was working on an application recently where the people I was making it for wanted to be able to switch between a lighter and darker theme. Luckily, the Fusion theme uses the applications color palette. I’m putting the code up on Github in a gist, but there won’t be the code to switch between the two themes. I’ll post that later as a quick tip/tutorial.

You can find the theme on Github here. Alternatively, I’m posting the code below in a collapsed code box. Feel free to make changes and submit them back on Github though! You can use this theme in all your applications, but be sure to tell me about them if you can. I’d love to see what people do with it. 🙂


QPalette darkPalette;
darkPalette.setColor(QPalette::Window, QColor(53,53,53));
darkPalette.setColor(QPalette::WindowText, Qt::white);
darkPalette.setColor(QPalette::Base, QColor(25,25,25));
darkPalette.setColor(QPalette::AlternateBase, QColor(53,53,53));
darkPalette.setColor(QPalette::ToolTipBase, Qt::white);
darkPalette.setColor(QPalette::ToolTipText, Qt::white);
darkPalette.setColor(QPalette::Text, Qt::white);
darkPalette.setColor(QPalette::Button, QColor(53,53,53));
darkPalette.setColor(QPalette::ButtonText, Qt::white);
darkPalette.setColor(QPalette::BrightText, Qt::red);
darkPalette.setColor(QPalette::Link, QColor(42, 130, 218));

darkPalette.setColor(QPalette::Highlight, QColor(42, 130, 218));
darkPalette.setColor(QPalette::HighlightedText, Qt::black);

qApp->setStyleSheet("QToolTip { color: #ffffff; background-color: #2a82da; border: 1px solid white; }");

Quick Tip: Load Fonts from a Local File with QML

If you are familiar with CSS, you have probably loaded an external font before. With an Internet application, you usually wouldn’t load it from a file, but for a desktop application that doesn’t require an Internet connection, loading from a file is a must. Luckily, this is extremely easy and the TTF file can be embedded right in the executable using the Qt resource system (QRC protocol). In QML, there is a provided FontLoader element that makes quick work of loading fonts. Here’s quick example:

FontLoader { id: myCustomFont; source: "qrc:/fonts/myCustomFont.ttf" }

Note that if you want to do so, it is possible to directly link to a URL on the Internet. However, I wouldn’t recommend this unless you can ensure that your user will have an Internet connection at run-time. Otherwise, I would recommend downloading the TTF file instead and putting it in a local resource file. Be sure to read the license before doing this though!

When you want to use the font later in a font field, for example, you can simply do:

font.family: myCustomFont.name

And that’s it! You are all set to use custom Truetype Fonts in QML! I hope this helps you out with your QML application. Happy coding!

Quick Tip: QProgressBar as a Busy Indicator

This is a super simple tip that doesn’t really have much to it. A busy indicator is just a visual cue to show the user that something is happening. To use a progress bar in Qt as one, you just need to set the minimum and maximum values to 0. If you do this, you get an infinite progress indicator. This is a better alternative to a progress bar when you have a process in which you cannot calculate the percentage completed, or one that takes a really long, undetermined, amount of time. An example with the Fusion style (that I use for basically any QWidgets these days) yields an animated diagonal stitch pattern:

Busy Progress Bar

The Qt Fusion style progress bar.

On Windows 7, you get a nice animated effect as well, but with a smaller colored area moving from left to right infinitely.

Windows 7 Busy Progress Bar

The Windows 7 version of the busy progress bar indicator

I hope the tip helped you out! Happy coding!

Quick Tip: Copy a QPixmap to the System Clipboard in Qt

A few days ago, we went over copying any amount of text to the system clipboard using the system clipboard. However, you can also leverage the full-power of this by copying images and pixmaps to the system clipboard. Let’s get started!

Example UI with Pixmap

Our example UI for this. Simply set a pixmap on a label. along with a button.

Behold my stunning UI for this example. 😛 Now that you have your GUI setup, go to the push button’s slot (or wherever you want to put the code) and you are left with this:

    QClipboard *p_Clipboard = QApplication::clipboard();

This is essentially what we did with text, however, with a different method. Note the dereference of the constant pointer we get to the label’s pixmap. This is essential, because the setPixmap() function wants a QPixmap object (taken by reference, not pointer). How can you not love C++? 🙂

Then you can paste it anywhere that lets you insert images through the paste!

The image pasted in MS Word

Here’s the copied pixmap pasted into Word. You can also paste it elsewhere, as long as the form accepts images from the clipboard.

And that about wraps it up. I hope you can use this in one of your projects, and share it if it was useful. Happy coding!

Quick Tip: Copy Any Text to the System Clipboard in Qt

Now, this is a super quick tip, as it’s really a no-brainer. The explanation (if you need one) is that a QApplication has a global instance of the clipboard, which can be accessed by simply getting a pointer to it. So lets just get to the code!

    QClipboard *p_Clipboard = QApplication::clipboard();

And viola! Just like that, your text should now be on the system clipboard. Happy coding!

Qt Creator 2.8.0 is finally here!

At long last, we have the release version of Qt Creator 2.8.0! I can’t wait to fill up all my monitors with multiple Qt Creator windows, and refactor C++ like C# (okay, maybe not that good… yet). If I’d have to ask for a feature improvement though, it’d be speeding up the autocompletion. Visual Studio is still way ahead in terms of that, however, Qt Creator is free and open-source, so I am not complaining. 😉

You can read the Digia write-up over on their Qt blog for all the finer details.

Quick Tip: Qt 5 Standard Paths

In Qt 5, the way you retrieve standard paths for a system has changed. Now, you use a special class named QStandardPaths instead of the desktop services class. By far my favorite use for this is locating directories without user interaction. In this quick example, we’ll locate the user’s home directory. Note that you can use any of the provided enums in replace of QStandardPaths::HomeLocation.

QString homeLocation = QStandardPaths::locate(QStandardPaths::HomeLocation, QString(), QStandardPaths::LocateDirectory);

This will return C:/Users/Admin on my development PC. This should work cross platform as well, so no more fiddling with the preprocessor to decide which default location to use. 🙂 You can replace the QString() with additional details for location.