Getting the group styled and scrollview working all together

This commit is contained in:
Sam Gateau 2019-03-11 00:08:31 -07:00
parent 6da3165754
commit 530b871eef
8 changed files with 159 additions and 127 deletions

View file

@ -28,7 +28,7 @@ PropItem {
flat: true
anchors.left: root.splitter.right
anchors.right: parent.right
anchors.right: root.right
anchors.verticalCenter: root.verticalCenter
height: global.slimHeight

View file

@ -25,56 +25,83 @@ Item {
property var label: "group"
property var isUnfold: false
property alias isUnfold: headerRect.icon
Item {
id: header
height: global.slimHeight
anchors.left: parent.left
anchors.right: parent.right
Item {
id: folder
anchors.left: header.left
width: headerRect.width * 2
anchors.verticalCenter: header.verticalCenter
height: parent.height
PropCanvasIcon {
id: headerRect
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
MouseArea{
id: mousearea
anchors.fill: parent
onClicked: {
root.isUnfold = !root.isUnfold
}
}
}
}
PropLabel {
id: labelControl
anchors.left: header.left
width: 0.9 * header.width
anchors.left: folder.right
anchors.right: header.right
anchors.verticalCenter: header.verticalCenter
text: root.label
horizontalAlignment: Text.AlignHCenter
}
Rectangle {
id: headerRect
color: global.color
border.color: global.colorBorderLight
border.width: global.valueBorderWidth
radius: global.valueBorderRadius
anchors.left: labelControl.right
anchors.right: header.right
anchors.verticalCenter: header.verticalCenter
height: parent.height
/* Rectangle {
anchors.left: parent.left
anchors.right: parent.right
height: 1
anchors.bottom: parent.bottom
color: global.colorBorderHighight
visible: root.isUnfold
}*/
}
MouseArea{
id: mousearea
anchors.fill: parent
onClicked: {
root.isUnfold = !root.isUnfold
}
}
Rectangle {
visible: root.isUnfold
color: "transparent"
border.color: global.colorBorderLight
border.width: global.valueBorderWidth
radius: global.valueBorderRadius
anchors.left: parent.left
anchors.right: parent.right
anchors.top: header.bottom
anchors.bottom: root.bottom
Column {
id: column
// anchors.top: header.bottom
anchors.left: parent.left
anchors.right: parent.right
clip: true
// Where the propItems are added
}
}
Column {
id: column
visible: root.isUnfold
anchors.top: header.bottom
anchors.left: parent.left
anchors.right: parent.right
clip: true
// Where the propItems are added
}
height: header.height + isUnfold * column.height
anchors.leftMargin: global.horizontalMargin
anchors.rightMargin: global.horizontalMargin
function updatePropItems() {
for (var i = 0; i < root.propItems.length; i++) {

View file

@ -61,7 +61,6 @@ PropItem {
stepSize: root.integral ? 1.0 : 0.0
anchors.left: valueLabel.right
anchors.right: root.right
anchors.rightMargin: 0
anchors.verticalCenter: root.verticalCenter
onValueChanged: { root.valueVarSetter(value) }

View file

@ -4,6 +4,7 @@ PropText 1.0 style/PiText.qml
PropLabel 1.0 style/PiLabel.qml
PropSplitter 1.0 style/PiSplitter.qml
PropComboBox 1.0 style/PiComboBox.qml
PropCanvasIcon 1.0 style/PiCanvasIcon.qml
PropItem 1.0 PropItem.qml
PropScalar 1.0 PropScalar.qml

View file

@ -21,7 +21,7 @@ Item {
property real lineHeight: 32
property real slimHeight: 24
property real horizontalMargin: 2
property real horizontalMargin: 4
property var color: hifi.colors.baseGray
property var colorBackHighlight: hifi.colors.baseGrayHighlight
@ -35,6 +35,9 @@ Item {
property var splitterRightWidthScale: 0.45
property real splitterWidth: 8
property real iconWidth: fontSize
property real iconHeight: fontSize
property var labelTextAlign: Text.AlignRight
property var labelTextElide: Text.ElideMiddle

View file

@ -0,0 +1,50 @@
//
// Prop/style/PiFoldCanvas.qml
//
// Created by Sam Gateau on 3/9/2019
// Copyright 2019 High Fidelity, Inc.
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or https://www.apache.org/licenses/LICENSE-2.0.html
//
import QtQuick 2.7
import QtQuick.Controls 2.2
Canvas {
Global { id: global }
width: global.iconWidth
height: global.iconHeight
property var icon: 0
onIconChanged: function () { requestPaint() }
property var fillColor: global.colorBorderHighight
contextType: "2d"
onPaint: {
context.reset();
switch (icon) {
case 0:
case 1:
case 2:
default: {
if ((icon % 3) == 0) {
context.moveTo(width * 0.25, 0);
context.lineTo(width * 0.25, height);
context.lineTo(width, height / 2);
} else if ((icon % 3) == 1) {
context.moveTo(0, height * 0.25);
context.lineTo(width, height * 0.25);
context.lineTo(width / 2, height);
} else {
context.moveTo(0, height * 0.75);
context.lineTo(width, height* 0.75);
context.lineTo(width / 2, 0);
}
context.closePath();
context.fillStyle = fillColor;
context.fill();
}}
}
}

View file

@ -33,28 +33,16 @@ ComboBox {
highlighted: valueCombo.highlightedIndex === index
}
indicator: Canvas {
indicator: PiCanvasIcon {
id: canvas
x: valueCombo.width - width - valueCombo.rightPadding
y: valueCombo.topPadding + (valueCombo.availableHeight - height) / 2
width: 12
height: 8
contextType: "2d"
Connections {
icon: 1
/*Connections {
target: valueCombo
onPressedChanged: canvas.requestPaint()
}
onPaint: {
context.reset();
context.moveTo(0, 0);
context.lineTo(width, 0);
context.lineTo(width / 2, height);
context.closePath();
context.fillStyle = (valueCombo.pressed) ? global.colorBorderHighight : global.colorBorderLight;
context.fill();
}
onPressedChanged: { canvas.icon = control.down + 1 }
}*/
}
contentItem: PiText {

View file

@ -8,7 +8,7 @@
// See the accompanying file LICENSE or https://www.apache.org/licenses/LICENSE-2.0.html
//
import QtQuick 2.7
import QtQuick.Controls 1.4
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import controlsUit 1.0 as HifiControls
@ -16,86 +16,50 @@ import controlsUit 1.0 as HifiControls
import "../lib/prop" as Prop
import "../lib/jet/qml" as Jet
Original.ScrollView {
Prop.Global { id: prop;}
id: render;
Rectangle {
anchors.fill: parent
// color: prop.color;
id: render;
property var mainViewTask: Render.getConfig("RenderMainView")
Column {
anchors.left: parent.left
anchors.right: parent.right
/* Repeater {
model: [ "Tone mapping exposure:ToneMapping:exposure:5.0:-5.0",
"Tone:ToneMapping:exposure:5.0:-5.0"
Prop.Global { id: global;}
color: global.color
ScrollView {
id: control
anchors.fill: parent
clip: true
Column {
width: render.width
Prop.PropEnum {
label: "Tone Curve"
object: render.mainViewTask.getConfig("ToneMapping")
property: "curve"
enums: [
"RGB",
"SRGB",
"Reinhard",
"Filmic",
]
Prop.PropScalar {
label: qsTr(modelData.split(":")[0])
integral: false
object: render.mainViewTask.getConfig(modelData.split(":")[1])
property: modelData.split(":")[2]
max: modelData.split(":")[3]
min: modelData.split(":")[4]
anchors.left: parent.left
anchors.right: parent.right
}
Jet.TaskPropView {
jobPath: "RenderMainView.ToneMapping"
label: "Le ToneMapping Job"
anchors.left: parent.left
anchors.right: parent.right
anchors.left: parent.left
anchors.right: parent.right
}
}
Prop.PropEnum {
label: "Tone Curve"
object: render.mainViewTask.getConfig("ToneMapping")
property: "curve"
enums: [
"RGB",
"SRGB",
"Reinhard",
"Filmic",
]
anchors.left: parent.left
anchors.right: parent.right
}
Prop.PropBool {
label: "Background"
object: render.mainViewTask.getConfig("LightingModel")
property: "enableBackground"
anchors.left: parent.left
anchors.right: parent.right
}*/
/* Prop.PropGroup {
label: "My group"
propItems: [
{"type": "PropBool", "object": render.mainViewTask.getConfig("LightingModel"), "property": "enableBackground"},
{"type": "PropScalar", "object": render.mainViewTask.getConfig("ToneMapping"), "property": "exposure"},
{"type": "PropBool", "object": render.mainViewTask.getConfig("LightingModel"), "property": "enableEmissive"},
{"type": "PropEnum", "object": render.mainViewTask.getConfig("ToneMapping"), "property": "curve", enums: [
"RGB",
"SRGB",
"Reinhard",
"Filmic",
]},
]
anchors.left: parent.left
anchors.right: parent.right
}*/
Jet.TaskPropView {
jobPath: "RenderMainView.Antialiasing"
label: "Le Antialiasing Job"
Jet.TaskPropView {
jobPath: "RenderMainView.ToneMapping"
label: "Le ToneMapping Job"
anchors.left: parent.left
anchors.right: parent.right
}
Jet.TaskPropView {
jobPath: "RenderMainView.Antialiasing"
label: "Le Antialiasing Job"
anchors.left: parent.left
anchors.right: parent.right
anchors.left: parent.left
anchors.right: parent.right
}
}
}
}