Merge pull request #134 from Unity-Technologies/inspector-window

Inspector window

MaterialGraphProject/Assets/UnityShaderEditor/Editor/Drawing/Inspector/GraphInspectorView.cs

 {
     public class GraphInspectorView : VisualElement, IDisposable
     {
+        enum ResizeDirection
+        {
+            Any,
+            Vertical,
+            Horizontal
+        }
+
         int m_SelectionHash;
 
         VisualElement m_PropertyItems;
             foreach (var property in m_Graph.properties)
                 m_PropertyItems.Add(new ShaderPropertyView(m_Graph, property));
 
+            var resizeHandleTop = new Label { name = "resize-top", text = "" };
+            resizeHandleTop.AddManipulator(new Draggable(mouseDelta => OnResize(mouseDelta, ResizeDirection.Vertical, true)));
+            Add(resizeHandleTop);
+
+            var resizeHandleRight = new Label { name = "resize-right", text = "" };
+            resizeHandleRight.AddManipulator(new Draggable(mouseDelta => OnResize(mouseDelta, ResizeDirection.Horizontal, false)));
+            Add(resizeHandleRight);
+
+            var resizeHandleLeft = new Label { name = "resize-left", text = "" };
+            resizeHandleLeft.AddManipulator(new Draggable(mouseDelta => OnResize(mouseDelta, ResizeDirection.Horizontal, true)));
+            Add(resizeHandleLeft);
+
+            var resizeHandleBottom = new Label { name = "resize-bottom", text = "" };
+            resizeHandleBottom.AddManipulator(new Draggable(mouseDelta => OnResize(mouseDelta, ResizeDirection.Vertical, false)));
+            Add(resizeHandleBottom);
+
             // Nodes missing custom editors:
             // - PropertyNode
             // - SubGraphInputNode
                 // { typeof(AbstractSurfaceMasterNode), typeof(SurfaceMasterNodeEditorView) }
             };
+        }
+
+        void OnResize(Vector2 resizeDelta, ResizeDirection direction, bool moveWhileResize)
+        {
+            Vector2 normalizedResizeDelta = resizeDelta / 2f;
+
+            if (direction == ResizeDirection.Vertical)
+            {
+                normalizedResizeDelta.x = 0f;
+            }
+            else if (direction == ResizeDirection.Horizontal)
+            {
+                normalizedResizeDelta.y = 0f;
+            }
+
+            Rect newLayout = layout;
+
+            // Resize form bottom/right
+            if (!moveWhileResize)
+            {
+                newLayout.width = Mathf.Max(layout.width + normalizedResizeDelta.x, 60f);
+                newLayout.height = Mathf.Max(layout.height + normalizedResizeDelta.y, 60f);
+
+                layout = newLayout;
+
+                return;
+            }
+
+            float previousFarX = layout.x + layout.width;
+            float previousFarY = layout.y + layout.height;
+
+            newLayout.width = Mathf.Max(layout.width - normalizedResizeDelta.x, 60f);
+            newLayout.height = Mathf.Max(layout.height - normalizedResizeDelta.y, 60f);
+
+            newLayout.x = Mathf.Min(layout.x + normalizedResizeDelta.x, previousFarX - 60f);
+            newLayout.y = Mathf.Min(layout.y + normalizedResizeDelta.y, previousFarY - 60f);
+
+            layout = newLayout;
         }
 
         MasterNode masterNode

MaterialGraphProject/Assets/UnityShaderEditor/Editor/Drawing/Manipulators/Draggable.cs

         void OnMouseUp(MouseUpEvent evt)
         {
             m_Active = false;
-            target.ReleaseMouseCapture();
+
+            if (target.HasMouseCapture())
+            {
+                target.ReleaseMouseCapture();
+            }
+
             evt.StopPropagation();
         }
     }

MaterialGraphProject/Assets/UnityShaderEditor/Editor/Drawing/Views/GraphEditorView.cs

                 content.Add(m_GraphView);
 
                 m_GraphInspectorView = new GraphInspectorView(assetName, previewManager, graph) { name = "inspector" };
+                m_GraphInspectorView.AddManipulator(new Draggable(OnMouseDrag, true));
+                m_GraphInspectorView.RegisterCallback<PostLayoutEvent>(OnPostLayout);
-                content.Add(m_GraphInspectorView);
+                m_GraphView.Add(m_GraphInspectorView);
 
                 m_GraphView.graphViewChanged = GraphViewChanged;
             }
                 AddEdge(edge);
 
             Add(content);
+        }
+
+        void OnPostLayout(PostLayoutEvent evt)
+        {
+            const float minimumVisibility = 60f;
+
+            Rect inspectorViewRect = m_GraphInspectorView.layout;
+
+            float minimumXPosition = minimumVisibility - inspectorViewRect.width;
+            float maximumXPosition = m_GraphView.layout.width - minimumVisibility;
+
+            float minimumYPosition = minimumVisibility - inspectorViewRect.height;
+            float maximumYPosition = m_GraphView.layout.height - minimumVisibility;
+
+            inspectorViewRect.x = Mathf.Clamp(inspectorViewRect.x, minimumXPosition, maximumXPosition);
+            inspectorViewRect.y = Mathf.Clamp(inspectorViewRect.y, minimumYPosition, maximumYPosition);
+
+            inspectorViewRect.width = Mathf.Min(inspectorViewRect.width, layout.width);
+            inspectorViewRect.height = Mathf.Min(inspectorViewRect.height, layout.height);
+
+            m_GraphInspectorView.layout = inspectorViewRect;
+        }
+
+        void OnMouseDrag(Vector2 mouseDelta)
+        {
+            Vector2 normalizedDelta = mouseDelta / 2f;
+
+            Rect inspectorWindowRect = m_GraphInspectorView.layout;
+
+            inspectorWindowRect.x += normalizedDelta.x;
+            inspectorWindowRect.y += normalizedDelta.y;
+
+            m_GraphInspectorView.layout = inspectorWindowRect;
         }
 
         GraphViewChange GraphViewChanged(GraphViewChange graphViewChange)

MaterialGraphProject/Assets/UnityShaderEditor/Editor/Resources/Styles/MaterialGraph.uss

 }
 
 MaterialNodeView > #resize {
-    background-color: rgb(0, 0, 255);
+    background-image : resource("GraphView/Nodes/NodeChevronLeft.png");
-}
-
-MaterialNodeView > #resize:hover {
-    background-color: rgb(0, 127, 127);
-}
-
-MaterialNodeView > #resize:active {
-    background-color: rgb(0, 225, 25);
+    cursor: resize-up-left;
 }
 
 PortInputView {
     background-color: rgb(56, 56, 56);
     flex-direction: column;
     justify-content: space-between;
+    position-type: absolute;
+    position-right: 0;
+    position-top: 0;
+    width: 600;
+    height: 800;
+}
+
+GraphInspectorView * {
+    font-size: 11;
 }
 
 GraphInspectorView > #top > #header {
     padding-bottom: 10;
 }
 
+GraphInspectorView > #bottom {
+    margin-bottom: 20;
+}
+
-    height: 400;
+    max-height: 400;
     background-color: rgb(79, 79, 79);
 }
 
 
 GraphInspectorView > #bottom > #properties > #items {
     padding-bottom: 4;
+}
+
+GraphInspectorView > #resize-right {
+    cursor: resize-horizontal;
+    background-color: rgba(0, 0, 0, 0);
+    position-type: absolute;
+    width: 10;
+    position-right: 0;
+    position-top: 0;
+    position-bottom: 0;
+}
+
+GraphInspectorView > #resize-left {
+    cursor: resize-horizontal;
+    background-color: rgba(0, 0, 0, 0);
+    position-type: absolute;
+    width: 10;
+    position-left: 0;
+    position-top: 0;
+    position-bottom: 0;
+    padding-left: 0;
+    margin-left: 0;
+}
+
+GraphInspectorView > #resize-top {
+    cursor: resize-vertical;
+    background-color: rgba(0, 0, 0, 0);
+    position-type: absolute;
+    height: 10;
+    position-left: 0;
+    position-right: 0;
+    position-top: 0;
+    padding-top: 0;
+    margin-top: 0;
+}
+
+GraphInspectorView > #resize-bottom {
+    cursor: resize-vertical;
+    background-color: rgba(0, 0, 0, 0);
+    position-type: absolute;
+    height: 10;
+    position-left: 0;
+    position-right: 0;
+    position-bottom: 0;
 }
 
 ShaderPropertyView {