C

Qt Quick Ultralite fileloading Example

Demonstrates how to load assets from external storage.

Overview

This example shows how to read assets stored on an SD Card using a file system.

File loading example screenshot showing four Qt logos loaded from the file system.

The leftmost image is a regular asset included in the application binary, while the other three are being read from the file system and stored in different formats.

The example consists of a simple screen (fileloading.qml) that shows four different historical Qt logos. The leftmost image is a regular asset included in the application binary, while the other three are being read from the file system and stored in different formats.

Warning: Loading assets from external storage has potential security threats.

Target platforms

Running the example on a device

After building the example, the assets to be loaded from the file system are available in the build folder under CMakeFiles/fileloading.dir/resources/. Copy the three image files found in its sub-folders into a logos folder in the root directory of your SD Card.

Note: These are the converted assets produced by the build, not the .png files from the source tree. Despite the file name, they are in Qt Quick Ultralite's own asset format and the source images cannot be used in their place.

The images are spread over one sub-folder per resource prefix, and the accompanying text files are not needed at runtime and can be skipped.

Project structure

The example includes FatFS file system API implementations for STM32 and NXP platforms, and a Posix implementation in the desktop folder for Windows and Linux hosts.

The main functions in os/baremetal and os/freertos will call a ConfigureBoard() function that has to be implemented for a board. This function has to setup the SD Card hardware and register the file system with Qt Quick Ultralite.

Implementations for this functions are available at board_config.cpp in sub-folders named after the platforms (desktop, stm, nxp).

The 3rdparty folder contains auxiliary code provided by other parties, like the FatFS implementation for embedded devices.

fatfs/fatfsfilesystem.h contains the API integration of the FatFS code to the Qt Quick Ultralite API. Details on how to integrate a custom file system with Qt Quick Ultralite are described in File system integration.

Using images from a file system

In QML it is possible to access image files from a file system with the file:// protocol.

Image {
    source: "file://logos/2008.png"
}

The assets are converted to a format that is optimized for being rendered on the target device.

set_source_files_properties(2008.png 2015.png 2016.png PROPERTIES
    QUL_RESOURCE_AS_FILE ON
)

To use assets as file resources, set the QUL_RESOURCE_AS_FILE source file property. Nothing further is required: the images are declared with RESOURCES like any other asset, and the file:// URL names a location on the target's file system.

You can also apply other resource properties described in Managing Resources, such as enabling RLE compression. One of them is the resource prefix, which 2016.png uses:

qul_add_resources(fileloading
    FILES 2016.png
    PREFIX "custom_prefix"
)

The prefix changes the asset's path within the resource system, and with it the sub-folder the converted asset is written to in the build directory. It has no effect on the file:// URL that loads it: 2016.png is written to a different build sub-folder than the other two, yet all three are copied to the same place on the SD Card and loaded the same way.

Files:

Images:

Available under certain Qt licenses.
Find out more.