How create my own button with my own look

  • hi, coders

    i'm beginner and i would like to know how design or create my own buttons
    which classes should i use to be able to create my own widgets

  • read this book :

    example :


    import QtQuick 2.5
    import QtQuick.Window 2.2
    Window {
        visible: true
        width: 320
        height: 240
        title: qsTr("Hello World")
        Button {
            id: button
            onClicked: console.log("clicked");
        Circle {
            id: circle
            color: "black"


    import QtQuick 2.5
    import QtQuick.Window 2.2
        signal clicked()
        anchors.centerIn: parent
        border{ width: 1 ; color: "black"}
        radius: 5
        color: "transparent"
        gradient: Gradient{
            GradientStop { position: 0; color:"#eeeeee"}
            GradientStop { position: 1; color:"#777777"}
        implicitWidth: Math.max(buttoncontent.implicitWidth+8,80)
            anchors.centerIn: parent
            spacing: 4
            anchors.verticalCenterOffset:  buttomMouseArea.pressed ? 1 : 0
            anchors.horizontalCenterOffset:   buttomMouseArea.pressed ? 1 : 0
            Image {
                id: buttonicon
                source: "qrc:/arrow.png"
            Text {
                id: buttonText
                text: "Button"
                color: buttomMouseArea.containsMouse ? "white" : "black"
            id: buttomMouseArea
            hoverEnabled: true
            anchors.fill: parent
            onClicked: button.clicked()

  • Moderators

    @billy.N Hi!
    QML or Widgets? If widgets then you can use QWidget as base class and use any other widgets (QLineEdit, QLabel, ...) to compose your own widgets.

Log in to reply

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.