How to implement custom titlebar?

[qiezi]

This is an example:
@Rectangle {
width: 800
height: 600
Rectangle {
id: titlebar
width: parent.width
height: 50
color: "#0000ff"
}
}@

It loaded by QDeclarativeView in a subclass of QMainWindow, the window without default titlebar.

How to implement the TitleBar with drag-move function?

[Chuck Gao]

So you understand your qml view is in a QMainWindow based class. If you want to drag and move your window, it's actually need moving your mainWindow. So the way to do this is:

1. Have a mouseArea in your titlebar
2. When pressed and mousePositionChanged, emit the a signal to your mainWindow, and let your mainWindow to handle the moving staff.

Btw, what's the app target for? Symbian ?Desktop?

[qiezi]

[quote author="Chuck.Gao" date="1309355528"]So you understand your qml view is in a QMainWindow based class. If you want to drag and move your window, it's actually need moving your mainWindow. So the way to do this is:

1. Have a mouseArea in your titlebar
2. When pressed and mousePositionChanged, emit the a signal to your mainWindow, and let your mainWindow to handle the moving staff.

Btw, what's the app target for? Symbian ?Desktop?[/quote]

Thanks for you help, I solved it.

It's a desktop application.

[Aleskey78]

Or you can handle mousePositionChanged on QML side.
@QmlApplicationViewer viewer;
...
viewer.rootContext()->setContextProperty("mainwindow", &viewer);@

@TitleBar { id: titleBar; width: parent.width; height: 40; opacity: 0.9
MouseArea {
id: mouseRegion
anchors.fill: parent;
property variant clickPos: "1,1"
onPressed: {
clickPos = Qt.point(mouse.x,mouse.y)
}
onPositionChanged: {
var delta = Qt.point(mouse.x-clickPos.x, mouse.y-clickPos.y)
mainwindow.pos = Qt.point(mainwindow.pos.x+delta.x,
mainwindow.pos.y+delta.y)
//console.log(mouse.x-clickPos.x,mouse.y-clickPos.y)
}
}
}@