I see that QML provides color dialogs out of which i can pick a color , on click of a button i can launch this color picker dialogs what if dont want the color picker dialog where on click of a button i want to show the same color picker dialog but as a drow down, something like this.

if i have to add the dialog in an overlay object? can you give me an example as to how to add it?

i have tried this and it still opens as a seperate dialog

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Dialogs 1.3
//import Qt.labs.platform 1.1
import QtQuick.Controls 2.15
Window { width: 640 height: 480 visible: true title: qsTr("Hello World") Rectangle{ id: rect1 height: 50 width: 100 color: "red" anchors.centerIn: parent } Button{ id:b1 width: 50 height: 50 anchors.left: rect1.right anchors.verticalCenter: parent.verticalCenter text: "V" onClicked: { console.log("launch color picker as an overlay") popup.open() colorPicker.visible = true } Popup{ id: popup parent: Overlay.overlay x: Math.round((parent.width - width) / 2) + 25 y: Math.round((parent.height - height) / 2) + 50 height: 200 width: 150 ColorDialog{ id:colorPicker } } }
}

3

1 Answer

Overlay is for popups:

A window overlay for popups.
Overlay provides a layer for popups, ensuring that popups are displayed above other content...

As @JarMan rightly pointed out, if you use ColorDialog, it will always be shown as a separate dialog.

If you want the color picker to be shown in the same window as a drop down, then you have to implement the color picker component and control its visibility based on user actions.
You can implement your own version of color picker component or you could reuse any existing component.

Your Answer

Sign up or log in

Sign up using Google Sign up using Facebook Sign up using Email and Password Submit

Post as a guest

Post Your Answer Discard

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy