Add vertical spacing above other settings fields

This commit is contained in:
David Rowe 2016-03-03 18:49:13 +13:00
parent 2d250e2f64
commit fb675dbaf5
8 changed files with 175 additions and 109 deletions

View file

@ -21,7 +21,7 @@ TextField {
property int colorScheme: hifi.colorSchemes.light
readonly property bool isLightColorScheme: colorScheme == hifi.colorSchemes.light
property string label: ""
property real controlHeight: height + (textFieldLabel.visible ? textFieldLabel.height + textFieldLabel.anchors.bottomMargin : 0)
property real controlHeight: height + (textFieldLabel.visible ? textFieldLabel.height : 0)
placeholderText: textField.placeholderText

View file

@ -18,9 +18,8 @@ Preference {
property alias text: dataTextField.text
property alias buttonText: button.text
property alias placeholderText: dataTextField.placeholderText
property real spacing: 0
property var browser;
height: Math.max(dataTextField.controlHeight, button.height) + spacing
height: control.height + hifi.dimensions.controlInterlineHeight
Component.onCompleted: {
dataTextField.text = preference.value;
@ -52,6 +51,15 @@ Preference {
preference.save();
}
Item {
id: control
anchors {
left: parent.left
right: parent.right
bottom: parent.bottom
}
height: Math.max(dataTextField.controlHeight, button.height)
TextField {
id: dataTextField
placeholderText: root.placeholderText
@ -61,7 +69,7 @@ Preference {
left: parent.left
right: button.left
rightMargin: hifi.dimensions.contentSpacing.x
bottomMargin: spacing
bottom: parent.bottom
}
colorScheme: hifi.colorSchemes.dark
}
@ -73,8 +81,11 @@ Preference {
Button {
id: button
anchors { right: parent.right; verticalCenter: dataTextField.verticalCenter }
text: "Browse"
anchors {
right: parent.right
verticalCenter: dataTextField.verticalCenter
}
onClicked: {
root.browser = avatarBrowserBuilder.createObject(desktop);
root.browser.windowDestroyed.connect(function(){
@ -82,4 +93,6 @@ Preference {
})
}
}
}
}

View file

@ -17,8 +17,7 @@ Preference {
id: root
property alias text: dataTextField.text
property alias placeholderText: dataTextField.placeholderText
property real spacing: 0
height: Math.max(dataTextField.controlHeight, button.height) + spacing
height: control.height + hifi.dimensions.controlInterlineHeight
Component.onCompleted: {
dataTextField.text = preference.value;
@ -29,6 +28,15 @@ Preference {
preference.save();
}
Item {
id: control
anchors {
left: parent.left
right: parent.right
bottom: parent.bottom
}
height: Math.max(dataTextField.controlHeight, button.height)
TextField {
id: dataTextField
@ -36,7 +44,7 @@ Preference {
left: parent.left
right: button.left
rightMargin: hifi.dimensions.contentSpacing.x
bottomMargin: spacing
bottom: parent.bottom
}
label: root.label
@ -51,8 +59,11 @@ Preference {
Button {
id: button
anchors { right: parent.right; verticalCenter: dataTextField.verticalCenter }
text: preference.browseLabel
anchors {
right: parent.right
verticalCenter: dataTextField.verticalCenter
}
onClicked: {
var browser = fileBrowserBuilder.createObject(desktop, { selectDirectory: true, folder: fileDialogHelper.pathToUrl(preference.value) });
browser.selectedFile.connect(function(fileUrl){
@ -62,3 +73,4 @@ Preference {
}
}
}
}

View file

@ -14,7 +14,7 @@ import "../../controls-uit"
Preference {
id: root
height: button.height
height: button.height + hifi.dimensions.controlInterlineHeight
Component.onCompleted: button.text = preference.name;
@ -24,5 +24,6 @@ Preference {
id: button
onClicked: preference.trigger()
width: 180
anchors.bottom: parent.bottom
}
}

View file

@ -17,7 +17,7 @@ import "../../styles-uit"
Preference {
id: root
height: dataComboBox.controlHeight
height: control.height + hifi.dimensions.controlInterlineHeight
Component.onCompleted: {
dataComboBox.currentIndex = dataComboBox.comboBox.find(preference.value);
@ -25,18 +25,27 @@ Preference {
function save() {
preference.value = dataComboBox.currentText;
//preference.value = comboBox.currentText;
preference.save();
}
Item {
id: control
anchors {
left: parent.left
right: parent.right
bottom: parent.bottom
}
height: Math.max(labelText.height, dataComboBox.controlHeight)
HiFiControls.Label {
id: labelText
text: root.label + ":"
colorScheme: hifi.colorSchemes.dark
anchors {
left: parent.left
right: dataComboBox.left
rightMargin: hifi.dimensions.labelPadding
verticalCenter: dataComboBox.verticalCenter
verticalCenter: parent.verticalCenter
}
horizontalAlignment: Text.AlignRight
wrapMode: Text.Wrap
@ -46,7 +55,11 @@ Preference {
id: dataComboBox
model: preference.items
width: 150
anchors { right: parent.right }
anchors {
right: parent.right
verticalCenter: parent.verticalCenter
}
colorScheme: hifi.colorSchemes.dark
}
}
}

View file

@ -15,8 +15,7 @@ import "../../controls-uit"
Preference {
id: root
property real spacing: 8
height: dataTextField.controlHeight + spacing
height: dataTextField.controlHeight + hifi.dimensions.controlInterlineHeight
Component.onCompleted: {
dataTextField.text = preference.value;
@ -36,7 +35,7 @@ Preference {
anchors {
left: parent.left
right: parent.right
bottomMargin: spacing
bottom: parent.bottom
}
}
}

View file

@ -16,7 +16,7 @@ import "../../controls-uit"
Preference {
id: root
property alias slider: slider
height: slider.controlHeight
height: control.height + hifi.dimensions.controlInterlineHeight
Component.onCompleted: {
slider.value = preference.value;
@ -27,14 +27,24 @@ Preference {
preference.save();
}
Item {
id: control
anchors {
left: parent.left
right: parent.right
bottom: parent.bottom
}
height: Math.max(labelText.height, slider.height)
Label {
id: labelText
text: root.label + ":"
colorScheme: hifi.colorSchemes.dark
anchors {
left: parent.left
right: slider.left
rightMargin: hifi.dimensions.labelPadding
verticalCenter: slider.verticalCenter
verticalCenter: parent.verticalCenter
}
horizontalAlignment: Text.AlignRight
wrapMode: Text.Wrap
@ -44,7 +54,11 @@ Preference {
id: slider
value: preference.value
width: 130
anchors { right: parent.right }
anchors {
right: parent.right
verticalCenter: parent.verticalCenter
}
colorScheme: hifi.colorSchemes.dark
}
}
}

View file

@ -15,7 +15,7 @@ import "../../controls-uit"
Preference {
id: root
property alias spinner: spinner
height: spinner.controlHeight
height: control.height + hifi.dimensions.controlInterlineHeight
Component.onCompleted: {
spinner.value = preference.value;
@ -26,14 +26,24 @@ Preference {
preference.save();
}
Item {
id: control
anchors {
left: parent.left
right: parent.right
bottom: parent.bottom
}
height: Math.max(spinnerLabel.height, spinner.controlHeight)
Label {
id: spinnerLabel
text: root.label + ":"
colorScheme: hifi.colorSchemes.dark
anchors {
left: parent.left
right: spinner.left
rightMargin: hifi.dimensions.labelPadding
verticalCenter: spinner.verticalCenter
verticalCenter: parent.verticalCenter
}
horizontalAlignment: Text.AlignRight
wrapMode: Text.Wrap
@ -45,7 +55,11 @@ Preference {
minimumValue: preference.min
maximumValue: preference.max
width: 100
anchors { right: parent.right }
anchors {
right: parent.right
verticalCenter: parent.verticalCenter
}
colorScheme: hifi.colorSchemes.dark
}
}
}