How to set style of button in qml?



  • I read the documentation about this but my code not work.
    http://doc.qt.io/qt-5/qml-qtquick-controls-styles-buttonstyle.html

    import QtQuick 2.7
    import QtQuick.Controls 2.0
    import QtQuick.Controls.Styles 1.4
    import QtQuick.Controls.Material 2.1
    import QtQuick.Layouts 1.0
    import QtQuick.Window 2.2
    import QtQuick.Layouts 1.3
    
    
    ApplicationWindow {
        visible: true
        width: 360
        height: 640
        title: qsTr("Hello World")
    
        Button {
            text: "A button"
            style: ButtonStyle {
                background: Rectangle {
                    implicitWidth: 100
                    implicitHeight: 25
                    border.width: control.activeFocus ? 2 : 1
                    border.color: "#888"
                    radius: 4
                    gradient: Gradient {
                        GradientStop { position: 0 ; color: control.pressed ? "#ccc" : "#eee" }
                        GradientStop { position: 1 ; color: control.pressed ? "#aaa" : "#ccc" }
                    }
                }
            }
        }
    }
    

    I have a error.
    QQmlApplicationEngine failed to load component
    qrc:/main.qml:21 Cannot assign to non-existent property "style"

    What happened?


  • Moderators

    Hi! You're importing QtQuick.Controls 2. So your Button is from Controls 2. But styles are only for buttons from Controls 1. See Button QML Type, and Customizing Button for the Controls 2 / Button doc pages.


Log in to reply