Protoyping custom qtquickcontrols2 styles with qmlscene

fulekia

I've found a few posts and bugs about loading the stock styles with qmlscene (e.g., Material), but not custom styles, and I can't seem to figure it out. I created a myTheme sub folder, copied in the default quick controls Button.qml template, and changed some things (background color, radius, etc.). Now how do I get qmlscene to load that? Neither QT_QUICK_CONTROLS_STYLE=myTheme nor -style myTheme work (by name, relative path, or absolute path).

I created a test.qml file with a Dialog component + OK/Cancel buttons, and the buttons still have the default look, and not the modified background from ./myTheme/Button.qml.

How do you do this? Setting the style to Material clearly changes the Dialog buttons.

Markkyboy

You need to add a 'qtquickcontrols2.conf' file to your project and populate it;

https://doc.qt.io/qt-5/qtquickcontrols2-configuration.html

fulekia

@Markkyboy ah, I’m just running qmlscene directly, and not in a project. I have several very complicated projects, and I was hoping to do rapid prototyping with less project overhead. Will that just not work? I suppose making a project shell isn’t that much work, I just didn’t know if qmlscene was aware of the resource system.

Interestingly, if I do this:
QT_QUICK_CONTROLS_STYLE=./myTheme qmlscene main.qml

Then buttons used directly in main show the rounded corners of my sample style, but the buttons in the Dialog do not. So it can clearly find the style, it just doesn’t use it everywhere? I thought maybe there was a name conflict, but namespacing/aliasing the quick controls import didn’t help.

fulekia

Creating a full project doesn't work either. I used Qt Creator to make a basic Qt Quick app (Stack view with Material style), added a MyStyle sub directory with my styled Button.qml to qml.qrc, updated qtquickcontrols2.conf to say Style=MyStyle, and I get the same result:

You can see that the "Wuzzup" button is rounded and blue, but the Dialog buttons are not.

Am I missing some fundamental conceptual piece for how controls styling works? Do I have to rebuild dialogs from scratch? That can't be right, otherwise custom styles just end up being complete re-implementations.

fulekia

So, I don't know that I'd call this a solution, but I'm leaving a note here for future reference. I needed to add a DialogButtonBox.qml to my custom style to make the button styles apply to Dialogs. Just copy-pasting the default template from the Quick Controls source without changes was sufficient.

I suppose this means that making a custom Quick Controls 2 style really means implementing the whole enchilada; you need to define every component in the chain, which in my case means forking and maintaining everything. That's a lot more work than I'd hoped for, but I suppose that's how this particular cookie crumbles.

Zuuka

As far as i know, the controls defined in the style need to inherit from Template classes (e.g. T.Dialog {...}).