Results 1 to 12 of 12

Thread: Styling Qml desktop components

  1. #1
    Join Date
    Sep 2014
    Posts
    9
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Styling Qml desktop components

    Currently I'm working on a desktop application that supports touchscreen display. I use QML on Qt 4.8 and OpenSUSE 13.1 (I can't upgrade either Qt or the OS due to dependencies reason)

    Because of the lack of main components, I use qml desktop component. However, I don't find a way to style those conveniently, like use CSS. Something like change the color of the button, change the border... seem complicated

    I've read Qml styling guide, Qml integrating guide but can't find a satisfied answer.

    Any ideas are appreciated

  2. #2
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: Styling Qml desktop components

    Those components are not really meant to be styled.
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


  3. #3
    Join Date
    Sep 2014
    Posts
    9
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: Styling Qml desktop components

    So it's impossible or the cost outweigh the benefit?

  4. #4
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: Styling Qml desktop components

    Both If you want stylable Qt Quick components, you'll need to upgrade to Qt5.
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


  5. #5
    Join Date
    Sep 2014
    Posts
    9
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: Styling Qml desktop components

    I found a 2 years old thread, which contains your posts

    http://www.qtcentre.org/threads/4788...an-I-change-it

    I think this has something very promising, maybe I can "inject" CSS into the component...

    My wild idea, it ain't work. Do you have any comments, ideas, anythings... ?
    qstyleitem.cpp
    Qt Code:
    1. case Button: {
    2. if (!m_styleoption)
    3. m_styleoption = new QStyleOptionButton();
    4.  
    5. QStyleOptionButton *opt = qstyleoption_cast<QStyleOptionButton*>(m_styleoption);
    6. opt->text = text();
    7. a->setStyleSheet("background-color:black;");//=> set CSS here
    8. opt->initFrom(a);
    9.  
    10. opt->features = (activeControl() == "default") ?
    11. QStyleOptionButton::DefaultButton :
    12. }
    13. break;
    To copy to clipboard, switch view to plain text mode 

  6. #6
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: Styling Qml desktop components

    I don't understand what this code is supposed to do. You are creating a push button and then you are not doing anything with it. What is the intention behind this code? If you expected that calling initFrom and passing the button would magically make your qml desktop component black then this won't happen. QStyleOption::initFrom does not do anything regarding drawing, it simply fills the QStyleOption structure with data taken from its argument. The list of variables is public so you can see in the docs what they are.
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


  7. #7
    Join Date
    Sep 2014
    Posts
    9
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: Styling Qml desktop components

    Yes, that's a wild idea

    I think it's the only place that can modify the style of conponents, so I try to modify it to "inject" a Qss file.

    Another idea is use QDeclarative to "convert" QML to a widget and set style from there. But I have no idea how to do it now

    You have any ideas?

  8. #8
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: Styling Qml desktop components

    Quote Originally Posted by unias View Post
    You have any ideas?
    Yes. Forget stylesheets. Either implement a regular style for your components or don't use the components at all and do styling via regular qml statements.
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


  9. #9
    Join Date
    Sep 2014
    Posts
    9
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: Styling Qml desktop components

    Reality is that harsh

    My team is using those components so I can't change to regulars components which use just qml statements.

    Okay, I think I'll look at the source code of Qt5, hope I can reuse some elements to solve the problem.

    Thank for the help I appreciate that

  10. #10
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: Styling Qml desktop components

    Quote Originally Posted by unias View Post
    My team is using those components
    What is your team using for styling them?
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


  11. #11
    Join Date
    Sep 2014
    Posts
    9
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: Styling Qml desktop components

    Quote Originally Posted by wysota View Post
    What is your team using for styling them?
    LOL, they just use them, my job is styling those components

  12. #12
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: Styling Qml desktop components

    Quote Originally Posted by unias View Post
    LOL, they just use them, my job is styling those components
    In that case don't use them or implement a proper style in C++.
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


Similar Threads

  1. Replies: 8
    Last Post: 23rd January 2013, 22:31
  2. QML Desktop Components weird Menu ...
    By travick in forum Qt Quick
    Replies: 9
    Last Post: 23rd December 2012, 23:09
  3. Using QML Components for the Desktop with PySide
    By hansotronic in forum Qt Quick
    Replies: 2
    Last Post: 30th October 2012, 01:49
  4. Replies: 3
    Last Post: 13th July 2012, 10:39
  5. QtCreator and Desktop Components
    By Splashy in forum Qt Quick
    Replies: 6
    Last Post: 24th March 2012, 01:43

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Digia, Qt and their respective logos are trademarks of Digia Plc in Finland and/or other countries worldwide.