CODEWITHSUNDEEP
qtqml
WildHippie
WildHippie

Reputation: 13

QML same settings for different buttons

I have to use the same settings for different buttons, but I don't understand how can I do it without write this settings in each button :( I mean text color, font size, button color, button color when button pressed

RowLayout {
        id: rowLayout
        width: 100
        height: 100
        Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter

        Button {
            id: button
            Text {
            color:"#666666"
            text: qsTr("й")
            font.family: "Geometria Medium"
            font.pointSize: 18
            }
            background: Rectangle {
                implicitWidth: 60
                implicitHeight: 60
                color: button.down ? "#B3B3B3" : "#E6E6E6"
                radius: 4
            }

        }

        Button {
            id: button1
            height: 40
            //                width: 70
            text: qsTr("ц")

        }

        Button {
            id: button2
            width: 50
            text: qsTr("у")
        }

Upvotes: 1

Views: 321

Answers (1)

eyllanesc
eyllanesc

Reputation: 243983

You have to create a component, for example CustomButton.qml:

CustomButton.qml

import QtQuick 2.14
import QtQuick.Controls 2.14

Button {
    id: control
    contentItem: Text {
        color:"#666666"
        text: control.text
        font.family: "Geometria Medium"
        font.pointSize: 18
    }
    background: Rectangle {
        implicitWidth: 60
        implicitHeight: 60
        color: control.down ? "#B3B3B3" : "#E6E6E6"
        radius: 4
    }
}

RowLayout {
    id: rowLayout
    width: 100
    height: 100
    Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
    CustomButton{
        text: qsTr("й")
    }
    CustomButton{
        text: qsTr("ц")
    }
    CustomButton{
        text: qsTr("у")
    }
}

Upvotes: 1

Related Questions