QmlDesigner: Enable toggling the helper grid on/off

Also remove the toolbar buttons from the puppet side and few other
clean-ups.

Task-number: QDS-1849
Change-Id: I075753552043a9f1bc649f6baf54dc7b689e4f64
Reviewed-by: Miikka Heikkinen <miikka.heikkinen@qt.io>
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>
This commit is contained in:
Mahmoud Badri
2020-03-27 20:16:29 +02:00
parent 8288d6e97b
commit 621a823a53
13 changed files with 90 additions and 213 deletions

View File

@@ -43,7 +43,8 @@ public:
SelectionModeToggle,
CameraToggle,
OrientationToggle,
EditLightToggle
EditLightToggle,
ShowGrid
};
explicit View3DActionCommand(Type type, bool enable);

View File

@@ -24,7 +24,6 @@
****************************************************************************/
import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick3D 1.15
import QtQuick.Controls 2.0
import QtGraphicalEffects 1.0
@@ -40,11 +39,18 @@ Item {
property View3D editView: null
property string sceneId
property alias showEditLight: btnEditViewLight.toggled
property alias usePerspective: btnPerspective.toggled
property alias globalOrientation: btnLocalGlobal.toggled
property bool showEditLight: false
property bool showGrid: true
property bool usePerspective: true
property bool globalOrientation: false
property alias contentItem: contentItem
enum SelectionMode { Item, Group }
enum TransformMode { Move, Rotate, Scale }
property int selectionMode: EditView3D.SelectionMode.Item
property int transformMode: EditView3D.TransformMode.Move
property Node selectedNode: null // This is non-null only in single selection case
property var selectedNodes: [] // All selected nodes
@@ -53,16 +59,18 @@ Item {
property var selectionBoxes: []
property rect viewPortRect: Qt.rect(0, 0, 1000, 1000)
property bool showButtons: false
signal selectionChanged(var selectedNodes)
signal commitObjectProperty(var object, var propName)
signal changeObjectProperty(var object, var propName)
signal notifyActiveSceneChange()
onUsePerspectiveChanged: _generalHelper.storeToolState(sceneId, "usePerspective", usePerspective)
onShowEditLightChanged: _generalHelper.storeToolState(sceneId,"showEditLight", showEditLight)
onUsePerspectiveChanged: _generalHelper.storeToolState(sceneId, "usePerspective", usePerspective)
onShowEditLightChanged: _generalHelper.storeToolState(sceneId, "showEditLight", showEditLight)
onGlobalOrientationChanged: _generalHelper.storeToolState(sceneId, "globalOrientation", globalOrientation)
onShowGridChanged: _generalHelper.storeToolState(sceneId, "showGrid", showGrid);
onSelectionModeChanged: _generalHelper.storeToolState(sceneId, "selectionMode", selectionMode);
onTransformModeChanged: _generalHelper.storeToolState(sceneId, "transformMode", transformMode);
onActiveSceneChanged: updateActiveScene()
function createEditView()
@@ -72,11 +80,13 @@ Item {
editView = component.createObject(viewRect,
{"usePerspective": usePerspective,
"showSceneLight": showEditLight,
"showGrid": showGrid,
"importScene": activeScene,
"cameraZoomFactor": cameraControl._zoomFactor,
"z": 1});
editView.usePerspective = Qt.binding(function() {return usePerspective;});
editView.showSceneLight = Qt.binding(function() {return showEditLight;});
editView.showGrid = Qt.binding(function() {return showGrid;});
editView.cameraZoomFactor = Qt.binding(function() {return cameraControl._zoomFactor;});
selectionBoxes.length = 0;
@@ -148,41 +158,31 @@ Item {
showEditLight = toolStates.showEditLight;
else if (resetToDefault)
showEditLight = false;
if ("showGrid" in toolStates)
showGrid = toolStates.showGrid;
else if (resetToDefault)
showGrid = true;
if ("usePerspective" in toolStates)
usePerspective = toolStates.usePerspective;
else if (resetToDefault)
usePerspective = false;
usePerspective = true;
if ("globalOrientation" in toolStates)
globalOrientation = toolStates.globalOrientation;
else if (resetToDefault)
globalOrientation = false;
var groupIndex;
var group;
var i;
if ("selectionMode" in toolStates)
selectionMode = toolStates.selectionMode;
else if (resetToDefault)
selectionMode = EditView3D.SelectionMode.Item;
if ("groupSelect" in toolStates) {
groupIndex = toolStates.groupSelect;
group = toolbarButtons.buttonGroups["groupSelect"];
for (i = 0; i < group.length; ++i)
group[i].selected = (i === groupIndex);
_generalHelper.storeToolState(sceneId, "groupSelect", groupIndex)
} else if (resetToDefault) {
btnSelectItem.selected = true;
btnSelectGroup.selected = false;
}
if ("groupTransform" in toolStates) {
groupIndex = toolStates.groupTransform;
group = toolbarButtons.buttonGroups["groupTransform"];
for (i = 0; i < group.length; ++i)
group[i].selected = (i === groupIndex);
_generalHelper.storeToolState(sceneId, "groupTransform", groupIndex)
} else if (resetToDefault) {
btnRotate.selected = false;
btnScale.selected = false;
btnMove.selected = true;
}
if ("transformMode" in toolStates)
transformMode = toolStates.transformMode;
else if (resetToDefault)
selectionMode = EditView3D.TransformMode.Move;
if ("editCamState" in toolStates)
cameraControl.restoreCameraState(toolStates.editCamState);
@@ -193,25 +193,11 @@ Item {
function storeCurrentToolStates()
{
_generalHelper.storeToolState(sceneId, "showEditLight", showEditLight)
_generalHelper.storeToolState(sceneId, "showGrid", showGrid)
_generalHelper.storeToolState(sceneId, "usePerspective", usePerspective)
_generalHelper.storeToolState(sceneId, "globalOrientation", globalOrientation)
var group = toolbarButtons.buttonGroups["groupSelect"];
var i;
for (i = 0; i < group.length; ++i) {
if (group[i].selected) {
_generalHelper.storeToolState(sceneId, "groupSelect", i)
break;
}
}
group = toolbarButtons.buttonGroups["groupTransform"];
for (i = 0; i < group.length; ++i) {
if (group[i].selected) {
_generalHelper.storeToolState(sceneId, "groupTransform", i)
break;
}
}
_generalHelper.storeToolState(sceneId, "selectionMode", selectionMode);
_generalHelper.storeToolState(sceneId, "transformMode", transformMode);
cameraControl.storeCameraState(0);
}
@@ -259,7 +245,7 @@ Item {
function handleObjectClicked(object, multi)
{
var theObject = object;
if (btnSelectGroup.selected) {
if (selectionMode === EditView3D.SelectionMode.Group) {
while (theObject && theObject !== activeScene && theObject.parent !== activeScene)
theObject = theObject.parent;
}
@@ -434,7 +420,7 @@ Item {
highlightOnHover: true
targetNode: viewRoot.selectedNode
globalOrientation: viewRoot.globalOrientation
visible: viewRoot.selectedNode && btnMove.selected
visible: viewRoot.selectedNode && transformMode === EditView3D.TransformMode.Move
view3D: overlayView
dragHelper: gizmoDragHelper
@@ -447,7 +433,7 @@ Item {
scale: autoScale.getScale(Qt.vector3d(5, 5, 5))
highlightOnHover: true
targetNode: viewRoot.selectedNode
visible: viewRoot.selectedNode && btnScale.selected
visible: viewRoot.selectedNode && transformMode === EditView3D.TransformMode.Scale
view3D: overlayView
dragHelper: gizmoDragHelper
@@ -461,7 +447,7 @@ Item {
highlightOnHover: true
targetNode: viewRoot.selectedNode
globalOrientation: viewRoot.globalOrientation
visible: viewRoot.selectedNode && btnRotate.selected
visible: viewRoot.selectedNode && transformMode === EditView3D.TransformMode.Rotate
view3D: overlayView
dragHelper: gizmoDragHelper
@@ -626,107 +612,6 @@ Item {
}
}
Rectangle { // toolbar
id: toolbar
color: "#9F000000"
width: 35
height: toolbarButtons.height
visible: viewRoot.showButtons
Column {
id: toolbarButtons
anchors.horizontalCenter: parent.horizontalCenter
spacing: 5
padding: 5
// Button groups must be defined in parent object of buttons
property var buttonGroups: {
"groupSelect": [btnSelectGroup, btnSelectItem],
"groupTransform": [btnMove, btnRotate, btnScale]
}
ToolBarButton {
id: btnSelectItem
selected: true
tooltip: qsTr("Select Item")
shortcut: "Q"
currentShortcut: selected ? "" : shortcut
tool: "item_selection"
buttonGroup: "groupSelect"
sceneId: viewRoot.sceneId
}
ToolBarButton {
id: btnSelectGroup
tooltip: qsTr("Select Group")
shortcut: "Q"
currentShortcut: btnSelectItem.currentShortcut === shortcut ? "" : shortcut
tool: "group_selection"
buttonGroup: "groupSelect"
sceneId: viewRoot.sceneId
}
Rectangle { // separator
width: 25
height: 1
color: "#f1f1f1"
anchors.horizontalCenter: parent.horizontalCenter
}
ToolBarButton {
id: btnMove
selected: true
tooltip: qsTr("Move current selection")
shortcut: "W"
currentShortcut: shortcut
tool: "move"
buttonGroup: "groupTransform"
sceneId: viewRoot.sceneId
}
ToolBarButton {
id: btnRotate
tooltip: qsTr("Rotate current selection")
shortcut: "E"
currentShortcut: shortcut
tool: "rotate"
buttonGroup: "groupTransform"
sceneId: viewRoot.sceneId
}
ToolBarButton {
id: btnScale
tooltip: qsTr("Scale current selection")
shortcut: "R"
currentShortcut: shortcut
tool: "scale"
buttonGroup: "groupTransform"
sceneId: viewRoot.sceneId
}
Rectangle { // separator
width: 25
height: 1
color: "#f1f1f1"
anchors.horizontalCenter: parent.horizontalCenter
}
ToolBarButton {
id: btnFit
tooltip: qsTr("Fit camera to current selection")
shortcut: "F"
currentShortcut: shortcut
tool: "fit"
togglable: false
onSelectedChanged: {
if (selected)
viewRoot.fitToView();
}
}
}
}
AxisHelper {
anchors.right: parent.right
anchors.top: parent.top
@@ -735,41 +620,5 @@ Item {
editCameraCtrl: cameraControl
selectedNode : viewRoot.selectedNodes.length ? selectionBoxes[0].model : null
}
Rectangle { // top controls bar
color: "#aa000000"
width: 290
height: btnPerspective.height + 10
anchors.top: parent.top
anchors.right: parent.right
anchors.rightMargin: 100
visible: viewRoot.showButtons
Row {
padding: 5
anchors.fill: parent
ToggleButton {
id: btnPerspective
width: 105
tooltip: qsTr("Toggle Perspective / Orthographic Projection")
states: [{iconId: "ortho", text: qsTr("Orthographic")}, {iconId: "persp", text: qsTr("Perspective")}]
}
ToggleButton {
id: btnLocalGlobal
width: 65
tooltip: qsTr("Toggle Global / Local Orientation")
states: [{iconId: "local", text: qsTr("Local")}, {iconId: "global", text: qsTr("Global")}]
}
ToggleButton {
id: btnEditViewLight
width: 110
toggleBackground: true
tooltip: qsTr("Toggle Edit Light")
states: [{iconId: "edit_light_off", text: qsTr("Edit Light Off")}, {iconId: "edit_light_on", text: qsTr("Edit Light On")}]
}
}
}
}
}

View File

@@ -23,7 +23,6 @@
**
****************************************************************************/
import QtQuick 2.12
import QtQuick3D 1.15
View3D {
@@ -31,7 +30,8 @@ View3D {
anchors.fill: parent
property bool usePerspective: false
property bool showSceneLight: false
property alias showSceneLight: sceneLight.visible
property alias showGrid: helperGrid.visible
property alias sceneHelpers: sceneHelpers
property alias perspectiveCamera: scenePerspectiveCamera
property alias orthoCamera: sceneOrthoCamera
@@ -62,7 +62,6 @@ View3D {
PointLight {
id: sceneLight
visible: showSceneLight
position: usePerspective ? scenePerspectiveCamera.position
: sceneOrthoCamera.position
quadraticFade: 0

View File

@@ -1162,19 +1162,19 @@ void Qt5InformationNodeInstanceServer::view3DAction(const View3DActionCommand &c
switch (command.type()) {
case View3DActionCommand::MoveTool:
updatedState.insert("groupTransform", 0);
updatedState.insert("transformMode", 0);
break;
case View3DActionCommand::RotateTool:
updatedState.insert("groupTransform", 1);
updatedState.insert("transformMode", 1);
break;
case View3DActionCommand::ScaleTool:
updatedState.insert("groupTransform", 2);
updatedState.insert("transformMode", 2);
break;
case View3DActionCommand::FitToView:
QMetaObject::invokeMethod(m_editView3DRootItem, "fitToView");
break;
case View3DActionCommand::SelectionModeToggle:
updatedState.insert("groupSelect", command.isEnabled() ? 0 : 1);
updatedState.insert("selectionMode", command.isEnabled() ? 1 : 0);
break;
case View3DActionCommand::CameraToggle:
updatedState.insert("usePerspective", command.isEnabled());
@@ -1187,6 +1187,9 @@ void Qt5InformationNodeInstanceServer::view3DAction(const View3DActionCommand &c
case View3DActionCommand::EditLightToggle:
updatedState.insert("showEditLight", command.isEnabled());
break;
case View3DActionCommand::ShowGrid:
updatedState.insert("showGrid", command.isEnabled());
break;
default:
break;
}

View File

@@ -8,6 +8,10 @@
<file>images/edit_light_off@2x.png</file>
<file>images/edit_light_on.png</file>
<file>images/edit_light_on@2x.png</file>
<file>images/grid_off.png</file>
<file>images/grid_off@2x.png</file>
<file>images/grid_on.png</file>
<file>images/grid_on@2x.png</file>
<file>images/fit_selected.png</file>
<file>images/fit_selected@2x.png</file>
<file>images/move_off.png</file>

View File

@@ -101,12 +101,13 @@ void Edit3DView::renderImage3DChanged(const QImage &img)
void Edit3DView::updateActiveScene3D(const QVariantMap &sceneState)
{
const QString sceneKey = QStringLiteral("sceneInstanceId");
const QString selectKey = QStringLiteral("groupSelect");
const QString transformKey = QStringLiteral("groupTransform");
const QString sceneKey = QStringLiteral("sceneInstanceId");
const QString selectKey = QStringLiteral("selectionMode");
const QString transformKey = QStringLiteral("transformMode");
const QString perspectiveKey = QStringLiteral("usePerspective");
const QString orientationKey = QStringLiteral("globalOrientation");
const QString editLightKey = QStringLiteral("showEditLight");
const QString editLightKey = QStringLiteral("showEditLight");
const QString gridKey = QStringLiteral("showGrid");
if (sceneState.contains(sceneKey)) {
qint32 newActiveScene = sceneState[sceneKey].value<qint32>();
@@ -115,7 +116,7 @@ void Edit3DView::updateActiveScene3D(const QVariantMap &sceneState)
}
if (sceneState.contains(selectKey))
m_selectionModeAction->action()->setChecked(sceneState[selectKey].toInt() == 0);
m_selectionModeAction->action()->setChecked(sceneState[selectKey].toInt() == 1);
else
m_selectionModeAction->action()->setChecked(false);
@@ -135,14 +136,21 @@ void Edit3DView::updateActiveScene3D(const QVariantMap &sceneState)
m_cameraModeAction->action()->setChecked(sceneState[perspectiveKey].toBool());
else
m_cameraModeAction->action()->setChecked(false);
if (sceneState.contains(orientationKey))
m_orientationModeAction->action()->setChecked(sceneState[orientationKey].toBool());
else
m_orientationModeAction->action()->setChecked(false);
if (sceneState.contains(editLightKey))
m_editLightAction->action()->setChecked(sceneState[editLightKey].toBool());
else
m_editLightAction->action()->setChecked(false);
if (sceneState.contains(gridKey))
m_showGridAction->action()->setChecked(sceneState[gridKey].toBool());
else
m_showGridAction->action()->setChecked(false);
}
void Edit3DView::modelAttached(Model *model)
@@ -247,6 +255,12 @@ void Edit3DView::createEdit3DActions()
QKeySequence(Qt::Key_U), true, false, Icons::EDIT3D_LIGHT_OFF.icon(),
Icons::EDIT3D_LIGHT_ON.icon());
m_showGridAction = new Edit3DAction(
QmlDesigner::Constants::EDIT3D_EDIT_SHOW_GRID, View3DActionCommand::ShowGrid,
QCoreApplication::translate("ShowGridAction", "Toggle grid visibility"),
QKeySequence(Qt::Key_G), true, true, Icons::EDIT3D_GRID_OFF.icon(),
Icons::EDIT3D_GRID_ON.icon());
SelectionContextOperation resetTrigger = [this](const SelectionContext &) {
setCurrentStateNode(rootModelNode());
resetPuppet();
@@ -270,6 +284,7 @@ void Edit3DView::createEdit3DActions()
m_leftActions << m_cameraModeAction;
m_leftActions << m_orientationModeAction;
m_leftActions << m_editLightAction;
m_leftActions << m_showGridAction;
m_rightActions << m_resetAction;
}

View File

@@ -87,6 +87,7 @@ private:
Edit3DAction *m_cameraModeAction = nullptr;
Edit3DAction *m_orientationModeAction = nullptr;
Edit3DAction *m_editLightAction = nullptr;
Edit3DAction *m_showGridAction = nullptr;
Edit3DAction *m_resetAction = nullptr;
};

Binary file not shown.

After

Width:  |  Height:  |  Size: 221 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 116 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 221 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 116 B

View File

@@ -55,14 +55,15 @@ const char FORMEDITOR_NO_SNAPPING[] = "QmlDesigner.FormEditor.NoSnapping";
const char FORMEDITOR_NO_SNAPPING_AND_ANCHORING[] = "QmlDesigner.FormEditor.NoSnappingAndAnchoring";
const char FORMEDITOR_NO_SHOW_BOUNDING_RECTANGLE[] = "QmlDesigner.FormEditor.ShowBoundingRectangle";
const char EDIT3D_SELECTION_MODE[] = "QmlDesigner.Editor3D.SelectionModeToggle";
const char EDIT3D_MOVE_TOOL[] = "QmlDesigner.Editor3D.MoveTool";
const char EDIT3D_ROTATE_TOOL[] = "QmlDesigner.Editor3D.RotateTool";
const char EDIT3D_SCALE_TOOL[] = "QmlDesigner.Editor3D.ScaleTool";
const char EDIT3D_FIT_SELECTED[] = "QmlDesigner.Editor3D.FitSelected";
const char EDIT3D_EDIT_CAMERA[] = "QmlDesigner.Editor3D.EditCameraToggle";
const char EDIT3D_ORIENTATION[] = "QmlDesigner.Editor3D.OrientationToggle";
const char EDIT3D_EDIT_LIGHT[] = "QmlDesigner.Editor3D.EditLightToggle";
const char EDIT3D_RESET_VIEW[] = "QmlDesigner.Editor3D.ResetView";
const char EDIT3D_MOVE_TOOL[] = "QmlDesigner.Editor3D.MoveTool";
const char EDIT3D_ROTATE_TOOL[] = "QmlDesigner.Editor3D.RotateTool";
const char EDIT3D_SCALE_TOOL[] = "QmlDesigner.Editor3D.ScaleTool";
const char EDIT3D_FIT_SELECTED[] = "QmlDesigner.Editor3D.FitSelected";
const char EDIT3D_EDIT_CAMERA[] = "QmlDesigner.Editor3D.EditCameraToggle";
const char EDIT3D_ORIENTATION[] = "QmlDesigner.Editor3D.OrientationToggle";
const char EDIT3D_EDIT_LIGHT[] = "QmlDesigner.Editor3D.EditLightToggle";
const char EDIT3D_EDIT_SHOW_GRID[] = "QmlDesigner.Editor3D.ToggleGrid";
const char EDIT3D_RESET_VIEW[] = "QmlDesigner.Editor3D.ResetView";
const char QML_DESIGNER_SUBFOLDER[] = "/designer/";
const char QUICK_3D_ASSETS_FOLDER[] = "/Quick3DAssets";

View File

@@ -51,6 +51,10 @@ const Utils::Icon EDIT3D_LIGHT_ON({
{QLatin1String(":/edit3d/images/edit_light_on.png"), Utils::Theme::IconsBaseColor}});
const Utils::Icon EDIT3D_LIGHT_OFF({
{QLatin1String(":/edit3d/images/edit_light_off.png"), Utils::Theme::IconsBaseColor}});
const Utils::Icon EDIT3D_GRID_ON({
{QLatin1String(":/edit3d/images/grid_on.png"), Utils::Theme::IconsBaseColor}});
const Utils::Icon EDIT3D_GRID_OFF({
{QLatin1String(":/edit3d/images/grid_off.png"), Utils::Theme::IconsBaseColor}});
const Utils::Icon EDIT3D_SELECTION_MODE_ON({
{QLatin1String(":/edit3d/images/select_group.png"), Utils::Theme::IconsBaseColor}});
const Utils::Icon EDIT3D_SELECTION_MODE_OFF({