[Interest] QtQuick Controls 2 and Designer: Should I use Styles or Customize?

Jérôme Godbout godboutj at amotus.ca
Mon Apr 9 18:05:00 CEST 2018


You could have a property inside the controler to select the proper theme value with a fallback, your theme singleton would then need to have different set of color.


Theme

{

   id: component

   property var defaultTheme: panelTheme

   property var mainTheme: ...

   property var panelTheme: ...


  function getTheme(prop)

  {

     if(prop && component.hasOwnProperty(prop))

        return component[prop];

     return component.defaultTheme;

  }

}


T.Button

{

   id: component

    color: Theme.getTheme(component.customTheme).backgroundColor

}

// use style with default theme
Button
{
}

// Button with theme color
Button
{
property string customTheme: 'mainTheme'
}

As for loading a multiple different template I think it would be impossible.

________________________________
From: Interest <interest-bounces+godboutj=amotus.ca at qt-project.org> on behalf of Shantanu Tushar <shaan7in at gmail.com>
Sent: April 9, 2018 11:30 AM
To: Thomas Hartmann
Cc: interest at qt-project.org
Subject: Re: [Interest] QtQuick Controls 2 and Designer: Should I use Styles or Customize?

Hi,

I've been slowly implementing these suggestions and so far the results
have been great. My button style looks like this-

import QtQuick 2.9
import QtQuick.Templates 2.1 as T

import My.theme 0.2

T.Button {
    // Here i use properties like Theme.backgroundColor, Theme.textColor etc
}

However, I just hit a roadblock which deals with multiple styles in
the same application. Our designer has created two sets of theme
colors - Glass and Dark, Glass it to be used on the "Main window" of
our application and Dark is used on rest of the dialogs. See
https://www.sostronk.com/assets/tilt-a780c798bf78e6c5.png

Now, because Theme is a singleton, there is no way for me to define a
different set of colors for a Dialog. Any suggestions on how to
achieve this?

Thanks,

On 26 March 2018 at 19:37, Shantanu Tushar <shaan7in at gmail.com> wrote:
> Hi Thomas,
>
> I've tried both your suggestions in a PoC project and it works! My
> actual app will need some refactoring to get the ball rolling but I
> think this will work fine.
>
> Thanks a lot,
>
>
> On 16 March 2018 at 19:32, Thomas Hartmann <Thomas.Hartmann at qt.io> wrote:
>> Hi,
>>
>>
>> I would suggest solution number 1 (Creating a Custom Style).
>>
>>
>> To get the designer to show your custom style you have to configure it in
>> qtquickcontrols2.conf.
>>
>> You can do this in the editable combo box in the form editor if
>> qtquickcontrols2.conf does exist.
>>
>> You can refer to the Qt  Quick Controls 2 Flat Style example
>> (https://doc.qt.io/qt-5.10/qtquickcontrols2-flatstyle-example.html).
>>
>> You can use QT_QUICK_CONTROLS_STYLE_PATH to specify additional paths that
>> are used to lookup Qt Quick Controls 2 styles.
>>
>> You can also write your own QML plugin (2. Customizing a Control), but you
>> have to create a QML file for every control
>>
>> and you have to implement a full plugin/import. For these customized
>> controls to show up in the item library you have to provide a .metainfo
>> file. You can look at the origin Qt Quick Controls 2 implementation for
>> reference.
>>
>>
>> I hope this solves your issue.
>>
>>
>> Kind Regards,
>>
>> Thomas Hartmann
>>
>>
>>
>> _______________________________________________
>> Interest mailing list
>> Interest at qt-project.org
>> http://lists.qt-project.org/mailman/listinfo/interest
>>
>
>
>
> --
> Shantanu Tushar    (UTC +0530)
> shantanu.io



--
Shantanu Tushar    (UTC +0530)
shantanu.io
_______________________________________________
Interest mailing list
Interest at qt-project.org
http://lists.qt-project.org/mailman/listinfo/interest
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.qt-project.org/pipermail/interest/attachments/20180409/c909e94b/attachment.html>


More information about the Interest mailing list