Qt provides us with a platform-independent resource system which allows us to store any type of files in our program's executable for later use. There is no limit to the types of files we can store in our executable—images, audio, video HTML, XML, text files, binary files, and so on, are all permitted. This is useful if your application always needs a certain set of files (icons, translation files, and so on) and you don't want to run the risk of losing the files. To achieve this, we must tell Qt which files we want to add to its resource system in the .qrc
file and Qt will handle the rest during the build process.
To add a new .qrc
file to our project, go to File | New File or Project. Then, select Qt under the Files and Classes category and select Qt Resources File. After that, give it a name (that is, resources
) and click the Next button followed by the Finish button. The .qrc
file will not be created and automatically opened by Qt Creator.
You don't have to edit the .qrc
file directly in the XML format as Qt Creator provides you the user interface to manage your resources. To add images and icons to your project, first you need to make sure that the images and icons are being placed in your project's directory.
While the .qrc
file is opened in Qt Creator, click the Add button followed by Add Prefix button. The prefix is used to categorize your resources so that it can be better managed when you have a ton of resources in your project:
/icons
./images
./icon
prefix and click Add followed by Add Files./images
prefix and click the Add button followed by the Add Files button. The file selection window will pop up again, and this time we will select the background image./images
prefix.Don't forget to save once you're done by pressing Ctrl + S. Your .qrc
file should now look like this:
mainwindow.ui
file; we will now make use of the resources we have just added to our project. First, we will select the restart button located on the top panel. Then, scroll down the property editor until you see the icon
property. Click the little button with a drop-down arrow icon and click Choose Resources from its menu.icons
prefix on the left panel and then select the restart icon on the right panel. After that, press OK.16x16
. Change the iconSize
property to 50x50
and you will see the icon appear bigger now.Repeat the preceding steps for the shutdown button, except this time we will choose the shutdown icon instead.
pixmap
property.pixmap
property and select Choose Resources from the menu. After that, select the logo image and click OK. You will now see the logo size no longer follow the dimension you set previously and follow the actual dimension of the image instead. We cannot change its dimension because this is simply how pixmap
works.pixmap
property and use a style sheet instead. You can use the following code to apply an image to the icon container: border-image: url(:/images/logo.png);
pixmap
in this case. Instead, we will use the border-image
property in a style sheet to achieve this. Right click the main window and select Change styleSheet to open up the Edit Style Sheet window. We will add a new line under the style sheet of the central widget:#centralWidget
{
background: rgba(32, 80, 96, 100);
border-image: url(:/images/login_bg.png);
}
The resource system in Qt stores binary files, such as images, translation files, and so on, in the executable when it gets compiled. It reads the resource collection files (.qrc
) in your project to locate the files that need to be stored in the executable and include them into the build process. A .qrc
file looks something like this:
<!DOCTYPE RCC><RCC version="1.0"> <qresource> <file>images/copy.png</file> <file>images/cut.png</file> <file>images/new.png</file> <file>images/open.png</file> <file>images/paste.png</file> <file>images/save.png</file> </qresource> </RCC>
It uses XML format to store the paths of the resource files which are relative to the directory containing it. Do note that the listed resource files must be located in the same directory as the .qrc
file, or one of its sub-directories.
3.144.47.218