Improve scaling of components in dialog

CustomQueryDialog now better handles the absence of one or more input
fields and scales appropriately.
This commit is contained in:
Zander Otavka 2016-07-18 11:14:45 -07:00
parent 6c47db016f
commit 6bd7034c1a

View file

@ -93,13 +93,17 @@ ModalWindow {
function resize() { function resize() {
var targetWidth = Math.max(titleWidth, pane.width); var targetWidth = Math.max(titleWidth, pane.width);
var targetHeight = (textInput ? textField.controlHeight : 0) + extraInputs.height + var targetHeight = (textField.visible ? textField.controlHeight + hifi.dimensions.contentSpacing.y : 0) +
(5 * hifi.dimensions.contentSpacing.y) + buttons.height; (extraInputs.visible ? extraInputs.height + hifi.dimensions.contentSpacing.y : 0) +
(buttons.height + 3 * hifi.dimensions.contentSpacing.y);
root.width = (targetWidth < d.minWidth) ? d.minWidth : ((targetWidth > d.maxWdith) ? d.maxWidth : targetWidth); root.width = (targetWidth < d.minWidth) ? d.minWidth : ((targetWidth > d.maxWdith) ? d.maxWidth : targetWidth);
root.height = (targetHeight < d.minHeight) ? d.minHeight: ((targetHeight > d.maxHeight) ? root.height = (targetHeight < d.minHeight) ? d.minHeight : ((targetHeight > d.maxHeight) ?
d.maxHeight : targetHeight); d.maxHeight : targetHeight);
if (comboBoxField.visible) { if (checkBoxField.visible && comboBoxField.visible) {
checkBoxField.width = extraInputs.width / 2;
comboBoxField.width = extraInputs.width / 2; comboBoxField.width = extraInputs.width / 2;
} else if (!checkBoxField.visible && comboBoxField.visible) {
comboBoxField.width = extraInputs.width;
} }
} }
} }
@ -107,7 +111,7 @@ ModalWindow {
Item { Item {
anchors { anchors {
top: parent.top; top: parent.top;
bottom: extraInputs.top; bottom: extraInputs.visible ? extraInputs.top : buttons.top;
left: parent.left; left: parent.left;
right: parent.right; right: parent.right;
margins: 0; margins: 0;
@ -130,6 +134,7 @@ ModalWindow {
Row { Row {
id: extraInputs; id: extraInputs;
visible: Boolean(root.checkBox || root.comboBox);
spacing: hifi.dimensions.contentSpacing.x; spacing: hifi.dimensions.contentSpacing.x;
anchors { anchors {
left: parent.left; left: parent.left;
@ -144,8 +149,8 @@ ModalWindow {
CheckBox { CheckBox {
id: checkBoxField; id: checkBoxField;
text: root.checkBox.label; text: root.checkBox.label;
focus: root.checkBox ? true : false; focus: Boolean(root.checkBox);
visible: root.checkBox ? true : false; visible: Boolean(root.checkBox);
anchors { anchors {
left: parent.left; left: parent.left;
bottom: parent.bottom; bottom: parent.bottom;
@ -156,8 +161,8 @@ ModalWindow {
ComboBox { ComboBox {
id: comboBoxField; id: comboBoxField;
label: root.comboBox.label; label: root.comboBox.label;
focus: root.comboBox ? true : false; focus: Boolean(root.comboBox);
visible: root.comboBox ? true : false; visible: Boolean(root.comboBox);
anchors { anchors {
right: parent.right; right: parent.right;
bottom: parent.bottom; bottom: parent.bottom;
@ -195,21 +200,11 @@ ModalWindow {
Button { Button {
id: cancelButton; id: cancelButton;
action: cancelAction; action: cancelAction;
// anchors {
// bottom: parent.bottom;
// right: parent.right;
// leftMargin: hifi.dimensions.contentSpacing.x;
// }
} }
Button { Button {
id: acceptButton; id: acceptButton;
action: acceptAction; action: acceptAction;
// anchors {
// bottom: parent.bottom;
// right: cancelButton.left;
// leftMargin: hifi.dimensions.contentSpacing.x;
// }
} }
Text { Text {