CSS modifying the source location for images.

[SPlatten]

I have the following CSS for a QFrame:

QFrame {background-color: #e9efef;
	background-image: url("meshtile_4x4.png");
        border: 2px solid #cccccc;
  	border-top-left-radius: 8px;
        border-top-right-radius: 8px;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;}

This CSS is specified in an XML file which my C++ application reads at startup. The problem is the application doesn't locate the image. I've added the following to my XML file:

    images="~/XMLMPAM/config/images/"

The intention is that this attribute is read by the C++ application and used to resolve any image specified in the CSS. The question is how to I implement / modify any image path to include this?

I could implement this when reading the XML file, just curious if there is a better way to implement this?

[SPlatten]

Thank you, I've since implemented a working solution.

[Pl45m4]

@SPlatten

You could add one or more qrc resource(s) for your images and then switch between them.

https://doc.qt.io/qt-5/resources.html

[SPlatten]

Thank you, although thats really the exact opposite of why I'm doing this. My approach is to not put anything in the build or compiled application, I want to use the XML to give a dynamic approach to the resources so the C++ engine will remain unchanged and the look and feel of the application is supplied in the XML.

[Pl45m4]

@SPlatten said in CSS modifying the source location for images.:

I want to use the XML to give a dynamic approach to the resources

So you want to load images or styles from theoretically everywhere, not only from your app / build directory?

[SPlatten]

Anywhere on the local file system.

[Pl45m4]

If I got it right, you want to keep this images="~/XMLMPAM/config/images/" variable in your XML / CSS file to define a path for background-image: url("meshtile_4x4.png"); without changing anything in your application or at runtime?!

I don't know if this is even possible, without parsing and re-writing the same CSS everything you change the path. But I wouldn't consider myself an expert when it comes to XML or CSS ;-)

[SPlatten]

The engine I referred to is the C++ which I'm modifying now to look at the CSS attribute and if it finds a URL(, it will then apply the images folder which it has translated into a full path.

[SimonSchroeder]

I guess what your looking for is void QDir::setSearchPaths(const QString &prefix, const QStringList &searchPaths):

Sets or replaces Qt's search paths for file names with the prefix prefix to searchPaths.
To specify a prefix for a file name, prepend the prefix followed by a single colon (e.g., "images:undo.png", "xmldocs:books.xml"). prefix can only contain letters or numbers (e.g., it cannot contain a colon, nor a slash).

I haven't used it myself so far. But it could help with your problem.

[SPlatten]

Thank you, I've since implemented a working solution.

[JonB]

@SPlatten said in CSS modifying the source location for images.:

I could implement this when reading the XML file, just curious if there is a better way to implement this?

That is how I would do it. Similarly, when I've needed to modify a QSS/CSS file for something which has to be dynamic beyond what QSS/CSS supports statically, I pre-process the stylesheet file before applying it to the application.