better size hints

src/shell/panelconfigview.cpp

@@ -66,21 +66,21 @@ void PanelConfigView::syncGeometry()
     }
 
     if (m_containment->formFactor() == Plasma::Vertical) {
-        resize(128, screen()->size().height());
+        resize(rootObject()->implicitWidth(), screen()->size().height());
 
         if (m_containment->location() == Plasma::LeftEdge) {
-            setPosition(screen()->geometry().left() + m_panelView->thickness(), 0);
+            setPosition(screen()->geometry().left() + m_panelView->thickness(), screen()->geometry().top());
         } else if (m_containment->location() == Plasma::RightEdge) {
-            setPosition(screen()->geometry().right() - 128 - m_panelView->thickness(), 0);
+            setPosition(screen()->geometry().right() - width() - m_panelView->thickness(), screen()->geometry().top());
         }
 
     } else {
-        resize(screen()->size().width(), 128);
+        resize(screen()->size().width(), rootObject()->implicitHeight());
 
         if (m_containment->location() == Plasma::TopEdge) {
-            setPosition(0, screen()->geometry().top() + m_panelView->thickness());
+            setPosition(screen()->geometry().left(), screen()->geometry().top() + m_panelView->thickness());
         } else if (m_containment->location() == Plasma::BottomEdge) {
-            setPosition(0, screen()->geometry().bottom() - 128 - m_panelView->thickness());
+            setPosition(screen()->geometry().left(), screen()->geometry().bottom() - height() - m_panelView->thickness());
         }
     }
 }

src/shell/qmlpackages/desktop/contents/configuration/PanelConfiguration.qml

@@ -27,8 +27,11 @@ import "panelconfiguration"
 
 //TODO: all of this will be done with desktop components
 PlasmaCore.FrameSvgItem {
-    id: root
+    id: dialogRoot
 
+//BEGIN Properties
+    width: 640
+    height: 64
     imagePath: "dialogs/background"
 
     state: {
@@ -49,9 +52,7 @@ PlasmaCore.FrameSvgItem {
         }
     }
 
-//BEGIN properties
+    property bool vertical: (panel.location == 5 || panel.location == 6)
-    width: 640
-    height: 64
 //END properties
 
 //BEGIN Connections
@@ -68,18 +69,16 @@ PlasmaCore.FrameSvgItem {
 
     Ruler {
         id: ruler
-        state: root.state
+        state: dialogRoot.state
     }
 
-    PlasmaComponents.ButtonRow {
+    ToolBar {
-        spacing: 0
+        id: toolBar
-        exclusive: false
-        anchors {
-            centerIn: parent
-        }
-        EdgeHandle {}
-        SizeHandle{}
     }
+//END UI components
+
+//BEGIN Animations
+    //when EdgeHandle is released animate to old panel position
     ParallelAnimation {
         id: panelResetAnimation
         NumberAnimation {
@@ -134,37 +133,53 @@ PlasmaCore.FrameSvgItem {
             duration: 150
         }
     }
-//END UI components
+//END Animations
 
 //BEGIN States
 states: [
         State {
             name: "TopEdge"
             PropertyChanges {
-                target: root
+                target: dialogRoot
                 enabledBorders: "TopBorder|BottomBorder"
             }
+            PropertyChanges {
+                target: dialogRoot
+                implicitHeight: ruler.implicitHeight + toolBar.implicitHeight
+            }
         },
         State {
             name: "BottomEdge"
             PropertyChanges {
-                target: root
+                target: dialogRoot
                 enabledBorders: "TopBorder|BottomBorder"
             }
+            PropertyChanges {
+                target: dialogRoot
+                implicitHeight: ruler.implicitHeight + toolBar.implicitHeight
+            }
         },
         State {
             name: "LeftEdge"
             PropertyChanges {
-                target: root
+                target: dialogRoot
                 enabledBorders: "LeftBorder|RightBorder"
             }
+            PropertyChanges {
+                target: dialogRoot
+                implicitWidth: ruler.implicitWidth + toolBar.implicitWidth
+            }
         },
         State {
             name: "RightEdge"
             PropertyChanges {
-                target: root
+                target: dialogRoot
                 enabledBorders: "LeftBorder|RightBorder"
             }
+            PropertyChanges {
+                target: dialogRoot
+                implicitWidth: ruler.implicitWidth + toolBar.implicitWidth
+            }
         }
     ]
 //END States

src/shell/qmlpackages/desktop/contents/configuration/panelconfiguration/EdgeHandle.qml

@@ -43,23 +43,23 @@ PlasmaComponents.ToolButton {
             switch (panel.location) {
             //TopEdge
             case 3:
-                configDialog.y = mouse.screenY - mapToItem(root, 0, startMouseY).y
+                configDialog.y = mouse.screenY - mapToItem(dialogRoot, 0, startMouseY).y
                 panel.y = configDialog.y - panel.height
                 break
             //LeftEdge
             case 5:
-                configDialog.x = mouse.screenX - mapToItem(root, startMouseX, 0).x
+                configDialog.x = mouse.screenX - mapToItem(dialogRoot, startMouseX, 0).x
                 panel.x = configDialog.x - panel.width
                 break;
             //RightEdge
             case 6:
-                configDialog.x = mouse.screenX - mapToItem(root, startMouseX, 0).x
+                configDialog.x = mouse.screenX - mapToItem(dialogRoot, startMouseX, 0).x
                 panel.x = configDialog.x + configDialog.width
                 break;
             //BottomEdge
             case 4:
             default:
-                configDialog.y = mouse.screenY - mapToItem(root, 0, startMouseY).y
+                configDialog.y = mouse.screenY - mapToItem(dialogRoot, 0, startMouseY).y
                 panel.y = configDialog.y + configDialog.height
             }
 

src/shell/qmlpackages/desktop/contents/configuration/panelconfiguration/Ruler.qml

@@ -33,8 +33,8 @@ PlasmaCore.FrameSvgItem {
 
     imagePath: "widgets/containment-controls"
     state: "BottomEdge"
-    implicitWidth: offsetButton.implicitwidth + minimumLengthHandle.implicitwidth
+    implicitWidth: offsetHandle.width + minimumLengthHandle.width
-    implicitHeight: 32//offsetButton.implicitheight + minimumLengthHandle.implicitheight
+    implicitHeight: offsetHandle.height + minimumLengthHandle.height
 
     Component.onCompleted: {
         offsetHandle.value = panel.offset

src/shell/qmlpackages/desktop/contents/configuration/panelconfiguration/SizeHandle.qml

@@ -38,23 +38,23 @@ PlasmaComponents.ToolButton {
             switch (panel.location) {
             //TopEdge
             case 3:
-                configDialog.y = mouse.screenY - mapToItem(root, 0, startMouseY).y
+                configDialog.y = mouse.screenY - mapToItem(dialogRoot, 0, startMouseY).y
                 panel.thickness = configDialog.y - panel.y
                 break;
             //LeftEdge
             case 5:
-                configDialog.x = mouse.screenX - mapToItem(root, startMouseX, 0).x
+                configDialog.x = mouse.screenX - mapToItem(dialogRoot, startMouseX, 0).x
                 panel.thickness = configDialog.x - panel.x
                 break;
             //RightEdge
             case 6:
-                configDialog.x = mouse.screenX - mapToItem(root, startMouseX, 0).x
+                configDialog.x = mouse.screenX - mapToItem(dialogRoot, startMouseX, 0).x
                 panel.thickness = (panel.x + panel.width) - (configDialog.x + configDialog.width)
                 break;
             //BottomEdge
             case 4:
             default:
-                configDialog.y = mouse.screenY - mapToItem(root, 0, startMouseY).y
+                configDialog.y = mouse.screenY - mapToItem(dialogRoot, 0, startMouseY).y
                 panel.thickness = (panel.y + panel.height) - (configDialog.y + configDialog.height)
             }
         }

src/shell/qmlpackages/desktop/contents/configuration/panelconfiguration/ToolBar.qml

@@ -0,0 +1,115 @@
+/*
+ *  Copyright 2013 Marco Martin <mart@kde.org>
+ *
+ *  This program is free software; you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation; either version 2 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program; if not, write to the Free Software
+ *  Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  2.010-1301, USA.
+ */
+
+import QtQuick 2.0
+import org.kde.plasma.components 2.0 as PlasmaComponents
+import org.kde.plasma.extras 2.0 as PlasmaExtras
+import org.kde.plasma.core 2.0 as PlasmaCore
+import org.kde.plasma.configuration 2.0
+
+Item {
+    id: root
+    state: parent.state
+    implicitWidth: childrenRect.width + 20
+    implicitHeight: childrenRect.height + 20
+    PlasmaComponents.ButtonRow {
+        id: row
+        spacing: 0
+        exclusive: false
+        visible: !dialogRoot.vertical
+        anchors {
+            centerIn: parent
+        }
+        EdgeHandle {
+            id: edgeHandle
+        }
+        SizeHandle {
+            id: sizeHandle
+        }
+    }
+    //FIXME: remove this duplication, use desktopcomponents linear layouts that can switch between horizontal and vertical
+    PlasmaComponents.ButtonColumn {
+        id: column
+        spacing: 0
+        exclusive: false
+        visible: dialogRoot.vertical
+        anchors {
+            centerIn: parent
+        }
+        EdgeHandle {
+            width: 80
+        }
+        SizeHandle {
+            width: 80
+        }
+    }
+
+
+//BEGIN States
+    states: [
+        State {
+            name: "TopEdge"
+            AnchorChanges {
+                target: root
+                anchors {
+                    top: undefined
+                    bottom: root.parent.bottom
+                    left: root.parent.left
+                    right: root.parent.right
+                }
+            }
+        },
+        State {
+            name: "BottomEdge"
+            AnchorChanges {
+                target: root
+                anchors {
+                    top: root.parent.top
+                    bottom: undefined
+                    left: root.parent.left
+                    right: root.parent.right
+                }
+            }
+        },
+        State {
+            name: "LeftEdge"
+            AnchorChanges {
+                target: root
+                anchors {
+                    top: root.parent.top
+                    bottom: root.parent.bottom
+                    left: undefined
+                    right: root.parent.right
+                }
+            }
+        },
+        State {
+            name: "RightEdge"
+            AnchorChanges {
+                target: root
+                anchors {
+                    top: root.parent.top
+                    bottom: root.parent.bottom
+                    left: root.parent.left
+                    right: undefined
+                }
+            }
+        }
+    ]
+//END States
+}