Merge pull request #7966 from ctrlaltdavid/20932

make file dialog resizable and movable
This commit is contained in:
Brad Hefta-Gaub 2016-05-25 17:13:55 -07:00
commit 7131920312
8 changed files with 65 additions and 33 deletions

View file

@ -25,10 +25,13 @@ import "fileDialog"
//FIXME implement shortcuts for favorite location //FIXME implement shortcuts for favorite location
ModalWindow { ModalWindow {
id: root id: root
//resizable: true resizable: true
implicitWidth: 640 implicitWidth: 640
implicitHeight: 480 implicitHeight: 480
minSize: Qt.vector2d(300, 240)
draggable: true
HifiConstants { id: hifi } HifiConstants { id: hifi }
Settings { Settings {

View file

@ -141,6 +141,7 @@ Item {
readonly property real textPadding: 8 readonly property real textPadding: 8
readonly property real sliderHandleSize: 18 readonly property real sliderHandleSize: 18
readonly property real sliderGrooveHeight: 8 readonly property real sliderGrooveHeight: 8
readonly property real frameIconSize: 22
readonly property real spinnerSize: 50 readonly property real spinnerSize: 50
readonly property real tablePadding: 12 readonly property real tablePadding: 12
readonly property real tableRowHeight: largeScreen ? 26 : 23 readonly property real tableRowHeight: largeScreen ? 26 : 23

View file

@ -20,6 +20,14 @@ Frame {
Rectangle { Rectangle {
// Dialog frame // Dialog frame
id: frameContent id: frameContent
readonly property int iconSize: hifi.dimensions.frameIconSize
readonly property int frameMargin: 9
readonly property int frameMarginLeft: frameMargin
readonly property int frameMarginRight: frameMargin
readonly property int frameMarginTop: 2 * frameMargin + iconSize
readonly property int frameMarginBottom: iconSize + 11
anchors { anchors {
topMargin: -frameMarginTop topMargin: -frameMarginTop
leftMargin: -frameMarginLeft leftMargin: -frameMarginLeft
@ -34,7 +42,7 @@ Frame {
} }
radius: hifi.dimensions.borderRadius radius: hifi.dimensions.borderRadius
// Allow dragging of the window // Enable dragging of the window
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
drag.target: window drag.target: window
@ -45,17 +53,17 @@ Frame {
anchors { anchors {
right: parent.right; right: parent.right;
top: parent.top; top: parent.top;
topMargin: frameMargin + 1 // Move down a little to visually align with the title topMargin: frameContent.frameMargin + 1 // Move down a little to visually align with the title
rightMargin: frameMarginRight; rightMargin: frameContent.frameMarginRight;
} }
spacing: iconSize / 4 spacing: frameContent.iconSize / 4
HiFiGlyphs { HiFiGlyphs {
// "Pin" button // "Pin" button
visible: false visible: false
text: (frame.pinned && !pinClickArea.containsMouse) || (!frame.pinned && pinClickArea.containsMouse) ? hifi.glyphs.pinInverted : hifi.glyphs.pin text: (frame.pinned && !pinClickArea.containsMouse) || (!frame.pinned && pinClickArea.containsMouse) ? hifi.glyphs.pinInverted : hifi.glyphs.pin
color: pinClickArea.containsMouse && !pinClickArea.pressed ? hifi.colors.redHighlight : hifi.colors.white color: pinClickArea.containsMouse && !pinClickArea.pressed ? hifi.colors.redHighlight : hifi.colors.white
size: iconSize size: frameContent.iconSize
MouseArea { MouseArea {
id: pinClickArea id: pinClickArea
anchors.fill: parent anchors.fill: parent
@ -70,7 +78,7 @@ Frame {
visible: window ? window.closable : false visible: window ? window.closable : false
text: closeClickArea.containsPress ? hifi.glyphs.closeInverted : hifi.glyphs.close text: closeClickArea.containsPress ? hifi.glyphs.closeInverted : hifi.glyphs.close
color: closeClickArea.containsMouse ? hifi.colors.redHighlight : hifi.colors.white color: closeClickArea.containsMouse ? hifi.colors.redHighlight : hifi.colors.white
size: iconSize size: frameContent.iconSize
MouseArea { MouseArea {
id: closeClickArea id: closeClickArea
anchors.fill: parent anchors.fill: parent
@ -85,11 +93,11 @@ Frame {
id: titleText id: titleText
anchors { anchors {
left: parent.left left: parent.left
leftMargin: frameMarginLeft + hifi.dimensions.contentMargin.x leftMargin: frameContent.frameMarginLeft + hifi.dimensions.contentMargin.x
right: controlsRow.left right: controlsRow.left
rightMargin: iconSize rightMargin: frameContent.iconSize
top: parent.top top: parent.top
topMargin: frameMargin topMargin: frameContent.frameMargin
} }
text: window ? window.title : "" text: window ? window.title : ""
color: hifi.colors.white color: hifi.colors.white

View file

@ -22,12 +22,10 @@ Item {
property bool gradientsSupported: desktop.gradientsSupported property bool gradientsSupported: desktop.gradientsSupported
readonly property int iconSize: 22 readonly property int frameMarginLeft: frameContent.frameMarginLeft
readonly property int frameMargin: 9 readonly property int frameMarginRight: frameContent.frameMarginRight
readonly property int frameMarginLeft: frameMargin readonly property int frameMarginTop: frameContent.frameMarginTop
readonly property int frameMarginRight: frameMargin readonly property int frameMarginBottom: frameContent.frameMarginBottom
readonly property int frameMarginTop: 2 * frameMargin + iconSize
readonly property int frameMarginBottom: iconSize + 11
// Frames always fill their parents, but their decorations may extend // Frames always fill their parents, but their decorations may extend
// beyond the window via negative margin sizes // beyond the window via negative margin sizes
@ -76,8 +74,8 @@ Item {
id: sizeOutline id: sizeOutline
x: -frameMarginLeft x: -frameMarginLeft
y: -frameMarginTop y: -frameMarginTop
width: window ? window.width + frameMarginLeft + frameMarginRight : 0 width: window ? window.width + frameMarginLeft + frameMarginRight + 2 : 0
height: window ? window.height + frameMarginTop + frameMarginBottom : 0 height: window ? window.height + frameMarginTop + frameMarginBottom + 2 : 0
color: hifi.colors.baseGrayHighlight15 color: hifi.colors.baseGrayHighlight15
border.width: 3 border.width: 3
border.color: hifi.colors.white50 border.color: hifi.colors.white50
@ -88,11 +86,11 @@ Item {
MouseArea { MouseArea {
// Resize handle // Resize handle
id: sizeDrag id: sizeDrag
width: iconSize width: hifi.dimensions.frameIconSize
height: iconSize height: hifi.dimensions.frameIconSize
enabled: window ? window.resizable : false enabled: window ? window.resizable : false
hoverEnabled: true hoverEnabled: true
x: window ? window.width + frameMarginRight - iconSize : 0 x: window ? window.width + frameMarginRight - hifi.dimensions.frameIconSize : 0
y: window ? window.height + 4 : 0 y: window ? window.height + 4 : 0
property vector2d pressOrigin property vector2d pressOrigin
property vector2d sizeOrigin property vector2d sizeOrigin
@ -124,10 +122,12 @@ Item {
HiFiGlyphs { HiFiGlyphs {
visible: sizeDrag.enabled visible: sizeDrag.enabled
x: -11 // Move a little to visually align x: -11 // Move a little to visually align
y: -4 // "" y: window.modality == Qt.ApplicationModal ? -6 : -4
text: hifi.glyphs.resizeHandle text: hifi.glyphs.resizeHandle
size: iconSize + 10 size: hifi.dimensions.frameIconSize + 10
color: sizeDrag.containsMouse || sizeDrag.pressed ? hifi.colors.white : hifi.colors.white50 color: sizeDrag.containsMouse || sizeDrag.pressed
? hifi.colors.white
: (window.colorScheme == hifi.colorSchemes.dark ? hifi.colors.white50 : hifi.colors.lightGrayText80)
} }
} }
} }

View file

@ -18,16 +18,21 @@ Frame {
HifiConstants { id: hifi } HifiConstants { id: hifi }
Rectangle { Rectangle {
id: modalFrame id: frameContent
readonly property bool hasTitle: window.title != "" readonly property bool hasTitle: window.title != ""
readonly property int frameMarginLeft: hifi.dimensions.modalDialogMargin.x
readonly property int frameMarginRight: hifi.dimensions.modalDialogMargin.x
readonly property int frameMarginTop: hifi.dimensions.modalDialogMargin.y + (frameContent.hasTitle ? hifi.dimensions.modalDialogTitleHeight + 10 : 0)
readonly property int frameMarginBottom: hifi.dimensions.modalDialogMargin.y
anchors { anchors {
fill: parent fill: parent
topMargin: -hifi.dimensions.modalDialogMargin.y - (modalFrame.hasTitle ? hifi.dimensions.modalDialogTitleHeight + 10 : 0) topMargin: -frameMarginTop
leftMargin: -hifi.dimensions.modalDialogMargin.x leftMargin: -frameMarginLeft
rightMargin: -hifi.dimensions.modalDialogMargin.x rightMargin: -frameMarginRight
bottomMargin: -hifi.dimensions.modalDialogMargin.y bottomMargin: -frameMarginBottom
} }
border { border {
@ -37,8 +42,15 @@ Frame {
radius: hifi.dimensions.borderRadius radius: hifi.dimensions.borderRadius
color: hifi.colors.faintGray color: hifi.colors.faintGray
// Enable dragging of the window
MouseArea {
anchors.fill: parent
drag.target: window
enabled: window.draggable
}
Item { Item {
visible: modalFrame.hasTitle visible: frameContent.hasTitle
anchors.fill: parent anchors.fill: parent
anchors { anchors {
topMargin: -parent.anchors.topMargin topMargin: -parent.anchors.topMargin

View file

@ -14,9 +14,13 @@ import "."
Window { Window {
id: window id: window
anchors.centerIn: parent
modality: Qt.ApplicationModal modality: Qt.ApplicationModal
destroyOnCloseButton: true destroyOnCloseButton: true
destroyOnInvisible: true destroyOnInvisible: true
frame: ModalFrame{} frame: ModalFrame { }
property int colorScheme: hifi.colorSchemes.light
property bool draggable: false
anchors.centerIn: draggable ? undefined : parent
} }

View file

@ -52,6 +52,7 @@ Fadable {
// property bool pinned: false // property bool pinned: false
property bool resizable: false property bool resizable: false
property bool gradientsSupported: desktop.gradientsSupported property bool gradientsSupported: desktop.gradientsSupported
property int colorScheme: hifi.colorSchemes.dark
property vector2d minSize: Qt.vector2d(100, 100) property vector2d minSize: Qt.vector2d(100, 100)
property vector2d maxSize: Qt.vector2d(1280, 800) property vector2d maxSize: Qt.vector2d(1280, 800)

View file

@ -23,14 +23,17 @@ ApplicationWindow {
Desktop { Desktop {
id: desktop id: desktop
anchors.fill: parent anchors.fill: parent
rootMenu: StubMenu { id: rootMenu }
//rootMenu: StubMenu { id: rootMenu }
//Component.onCompleted: offscreenWindow = appWindow //Component.onCompleted: offscreenWindow = appWindow
/*
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
acceptedButtons: Qt.RightButton acceptedButtons: Qt.RightButton
onClicked: desktop.popupMenu(Qt.vector2d(mouseX, mouseY)); onClicked: desktop.popupMenu(Qt.vector2d(mouseX, mouseY));
} }
*/
Row { Row {
id: testButtons id: testButtons