[solved] Creating own components?

pascal95abc

Hello,

I want to use buttons in QML.
Therefor, I wrote this code
@ Rectangle {
id: rectangle1
height: 50
color: "#ffffff"
radius: 5
anchors.left: item1.right
anchors.leftMargin: 0
anchors.right: parent.right
anchors.rightMargin: 0
anchors.bottom: parent.bottom
anchors.bottomMargin: 0
transformOrigin: Item.BottomRight
border.width: 2
border.color: "#000000"

        Text {
            id: text2
            text: qsTr("button's caption")
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.verticalCenter: parent.verticalCenter
            transformOrigin: Item.Center
            font.bold: true
            font.pixelSize: 20
        }

        MouseArea {
            id: mouse_area1
            z: 1
            hoverEnabled: true
            anchors.fill: parent
            anchors.bottom: page.top
            anchors.top: page.bottom
            onClicked: {
                // button's function
            }
        }
    }@

and because I don't want to rewrite this or copy it always when needed, I want to create a component that includes the code above.
!http://i46.img-up.net/Screenshotq3f3.png(Qt Quick, Elements)!

Thank you

mikealfa

you can write this code in a separate file say Button.qml and it will be automatically available to you just like the available built-in components

pascal95abc

Oh, and where should I save the file, so that it is available from all my projects?
(my project directory is c:\qtsdk\projects)

What should I write in the file in addition ?

mikealfa

you ll have to save the file in the folder in which you have the .pro file of ur project...
you ll have to do so for all the projects for which u need the button element...

pascal95abc

Ok, I saved the file and added it to my project.
!http://e96.img-up.net/Screenshota8zh.png(Button.qml)!

But I can't load it via the menu with the elements like "Border Image", "Image", "Item", "Rectangle".

jackyang

You should write a qmldir for that .qml file.
"Modules":http://doc.qt.nokia.com/main-snapshot/qdeclarativemodules.html

kahon

To access to component created. You have to be sure that you import dir of this.

for example:

thinking in an order, you could create a folder named myComponents inside: c:\qtsdk\projects

so: c:\qtsdk\projects\myComponents\Button.qml exists.

At first in your main.qml you type: "import myComponents" then you can write Button{} an it will work fine.

Best,
Fernando.

DiegoBR

Good! iam learning QML too, and it's so very helpfull. Sorry for my poor english.