Changed right panel

[*] DapWalletTab.qml
[-] DapRightPanel_New.qml
[+] DapRightPanel_New.qml; DapRightPanelPage.qml;
DapRightPanelTextHeader.qml; DapRightPanelComboBoxHeader.qml

CellFrameDashboardGUI/qml.qrc

@@ -198,6 +198,9 @@
         <file>resources/icons/Icon_sync_net_hover.svg</file>
         <file>resources/icons/next-page.svg</file>
         <file>resources/icons/next-page_hover.svg</file>
-        <file>screen/desktop/DapRightPanel_New.qml</file>
+        <file>screen/desktop/RightPanel/DapRightPanelTextHeader.qml</file>
+        <file>screen/desktop/RightPanel/DapRightPanel_New.qml</file>
+        <file>screen/desktop/RightPanel/DapRightPanelPage.qml</file>
+        <file>screen/desktop/RightPanel/DapRightPanelComboBoxHeader.qml</file>
     </qresource>
 </RCC>

CellFrameDashboardGUI/screen/desktop/RightPanel/DapRightPanelComboBoxHeader.qml

+import QtQuick 2.7
+import "qrc:/widgets"
+
+Item {
+    property alias caption: text.text
+    property alias comboBox: _comboBox
+
+    Text {
+        id: text
+
+        anchors.verticalCenter: parent.verticalCenter
+        width: Math.min(implicitWidth, parent.width - _comboBox.x)
+
+        elide: Text.ElideRight
+        font: quicksandFonts.bold14
+        color: "#3E3853"
+    }
+
+    Item {
+        anchors.right: parent.right
+        width: _comboBox.widthPopupComboBoxNormal
+        height: parent.height
+
+        DapComboBox {
+            id: _comboBox
+
+            anchors.centerIn: parent
+            indicatorImageNormal: "qrc:/resources/icons/ic_arrow_drop_down_dark.png"
+            indicatorImageActive: "qrc:/resources/icons/ic_arrow_drop_up.png"
+            sidePaddingNormal: 0 * pt
+            sidePaddingActive: 20 * pt
+            normalColorText: "#070023"
+            hilightColorText: "#FFFFFF"
+            normalColorTopText: "#070023"
+            hilightColorTopText: "#070023"
+            hilightColor: "#330F54"
+            normalTopColor: "transparent"
+            widthPopupComboBoxNormal: 100 * pt
+            widthPopupComboBoxActive: 144 * pt
+            heightComboBoxNormal: 24 * pt
+            heightComboBoxActive: 44 * pt
+            bottomIntervalListElement: 8 * pt
+            topEffect: false
+            normalColor: "#FFFFFF"
+            hilightTopColor: normalColor
+            paddingTopItemDelegate: 8 * pt
+            heightListElement: 32 * pt
+            intervalListElement: 10 * pt
+            indicatorWidth: 20 * pt
+            indicatorHeight: indicatorWidth
+            indicatorLeftInterval: 20 * pt
+            colorTopNormalDropShadow: "#00000000"
+            colorDropShadow: "#40ABABAB"
+            fontComboBox: [quicksandFonts.medium14]
+            colorMainTextComboBox: [["#070023", "#070023"]]
+            colorTextComboBox: [["#070023", "#FFFFFF"]]
+        }
+    }
+}

CellFrameDashboardGUI/screen/desktop/RightPanel/DapRightPanelPage.qml

+import QtQuick 2.7
+
+Item {
+    id: control
+
+    property string caption
+    property Component headerComponent
+
+    signal pushPageRequest(var page)
+    signal popPageRequest
+    signal closeRightPanelRequest
+}

CellFrameDashboardGUI/screen/desktop/RightPanel/DapRightPanelTextHeader.qml

+import QtQuick 2.7
+
+Item {
+    property alias caption: text.text
+
+    Text {
+        id: text
+
+        anchors.verticalCenter: parent.verticalCenter
+        width: Math.min(implicitWidth, parent.width)
+
+        elide: Text.ElideRight
+        font: quicksandFonts.bold14
+        color: "#3E3853"
+    }
+}

CellFrameDashboardGUI/screen/desktop/DapRightPanel_New.qml → CellFrameDashboardGUI/screen/desktop/RightPanel/DapRightPanel_New.qml

-import QtQuick 2.4
-import QtQuick.Controls 1.4
+import QtQuick 2.7
+import QtQuick.Controls 2.2
 import "qrc:/widgets"
 
-Rectangle
-{
-    id: root
+Rectangle {
+    id: control
 
-    property string caption: "New Wallet"
-    property alias stackView: stackView
+    property alias initialPage: stackView.initialItem
 
+    function push(item)
+    {
+        stackView.push(item);
+    }
+
+    function pop()
+    {
+        if (stackView.depth > 1) {
+            stackView.pop();
+        } else if (stackView.depth == 1) {
+            stackView.clear();
+        }
+    }
+
+    function clear()
+    {
+        stackView.clear();
+    }
+
+    visible: stackView.currentItem != null
     anchors.top: parent.top
     anchors.right: parent.right
     anchors.bottom: parent.bottom
-    anchors.margins: visible ? 24*pt : 0
+    anchors.margins: visible ? 24 * pt : 0
     anchors.leftMargin: 0
     width: visible ? 350 * pt : 0;
     border.color: "#E2E1E6"
@@ -20,59 +38,99 @@ Rectangle
     radius: 8 * pt
 
     Item {
-        id: title
+        id: headerFrame
 
         width: parent.width
         height: 40 * pt
 
-        DapButton_New
-        {
+        DapButton_New {
             id: backButton
 
+            x: 16 * pt
             height: 20 * pt
             width: height
-            x: 16 * pt
             anchors.verticalCenter: parent.verticalCenter
 
             iconSource:      stackView.depth > 1 ? "qrc:/resources/icons/back_icon.png"       : "qrc:/resources/icons/Certificates/close_icon.svg"
             hoverIconSource: stackView.depth > 1 ? "qrc:/resources/icons/back_icon_hover.png" : "qrc:/resources/icons/Certificates/close_icon_hover.svg"
 
             iconSubcontroll.sourceSize: Qt.size(20 * pt, 20 * pt)
-            onClicked:
-            {
-                if(stackView.pop() === null)
-                    root.visible = false;
-            }
+            onClicked: control.pop()
         }
 
-        Text {
-            id: titleText
-            anchors
-            {
+        Item {
+            id: headerItemFrame
+
+            anchors {
                 left: backButton.right
-                leftMargin: 13 * pt
-                verticalCenter: parent.verticalCenter
+                top: parent.top
+                right: parent.right
+                bottom: parent.bottom
+                leftMargin: 16 * pt
+                rightMargin: 16 * pt
             }
-            font: quicksandFonts.bold14
-            color: "#3E3853"
-            text: qsTr(root.caption)
         }
     }
-    StackView
-    {
-        id: stackView
-        anchors
-        {
-            top:title.bottom
+
+    Flickable {
+        id: flickable
+
+        anchors {
             left: parent.left
+            top: headerFrame.bottom
             right: parent.right
             bottom: parent.bottom
         }
-        delegate: StackViewDelegate
-        {
-            pushTransition: StackViewTransition { }
+
+        contentWidth: stackView.width
+        contentHeight: stackView.height
+        clip: true
+
+        ScrollBar.vertical: ScrollBar {
+            policy: size == 1 ? ScrollBar.AsNeeded : ScrollBar.AlwaysOn
+        }
+
+        StackView {
+            id: stackView
+
+            width: flickable.width
+            height: Math.max(currentItem ? currentItem.implicitHeight : 0, flickable.height)
+
+            onCurrentItemChanged: {
+                if (headerItemFrame.children.length)
+                    headerItemFrame.children[0].destroy();
+
+                if (!currentItem)
+                    return;
+
+                var headerComponent = currentItem.headerComponent ? currentItem.headerComponent : defaultHeaderComponent;
+                var headerItem = headerComponent.createObject(headerItemFrame);
+                headerItem.width = Qt.binding(function() { return headerItemFrame.width });
+                headerItem.height = Qt.binding(function() { return headerItemFrame.height });
+            }
+
+            pushEnter: null
+            pushExit: null
+            popEnter: null
+            popExit: null
+            replaceEnter: null
+            replaceExit: null
         }
     }
 
+    Connections {
+        target: stackView.currentItem
+
+        onPushPageRequest: control.push(page)
+        onPopPageRequest: control.pop()
+        onCloseRightPanelRequest: control.clear()
+    }
+
+    Component {
+        id: defaultHeaderComponent
 
+        DapRightPanelTextHeader {
+            caption: stackView.currentItem ? stackView.currentItem.caption : ""
+        }
+    }
 }

CellFrameDashboardGUI/screen/desktop/Wallet/DapWalletTab.qml

 import QtQuick 2.4
 import QtQuick.Controls 1.4
 import "qrc:/"
-import "../../"
 import "../"
+import "../RightPanel"
 
 
 
@@ -30,21 +30,81 @@ Item
             DapRightPanel_New
             {
                 id: rightPanel
-                stackView.initialItem: firstPage
-                Component.onCompleted: stackView.push(secondPage)
+                initialPage: firstPageComponent
             }
             Component
             {
-                id:firstPage
-                Rectangle{
-                    color: "#ff0000"
+                id: firstPageComponent
+
+                DapRightPanelPage {
+                    id: firstPage
+
+                    caption: qsTr("First page");
+
+                    Rectangle {
+                        anchors.fill: parent
+                        color: "red"
+                        opacity: 0.1
+                    }
+
+                    Column {
+                        id: column1
+
+                        Rectangle {
+                            width: firstPage.width
+                            height: pt * 100
+                            color: "#ff0000"
+                        }
+
+                        Button {
+                            text: "Next panel"
+                            onClicked: firstPage.pushPageRequest(secondPageComponent)
+                        }
+                    }
                 }
             }
-            Component
-            {
-                id:secondPage
-                Rectangle{
-                    color: "#00ff62"
+            Component {
+                id: secondPageComponent
+
+                DapRightPanelPage {
+                    id: secondPage
+
+                    // Нужно установить implicitHeight для работы скролла. Не очень красиво получилось.
+                    implicitHeight: column2.height
+
+                    caption: qsTr("Second page");
+
+                    headerComponent: DapRightPanelComboBoxHeader {
+                        caption: secondPage.caption
+
+                        comboBox.comboBoxTextRole: ["text"]
+                        comboBox.model: ListModel {
+                            ListElement { text: "asd" }
+                            ListElement { text: "asd1" }
+                            ListElement { text: "asd2" }
+                        }
+
+                        Rectangle {
+                            color: "green"
+                            opacity: 0.1
+                            anchors.fill: parent
+                        }
+                    }
+
+                    Column {
+                        id: column2
+
+                        Repeater {
+                            model: 40
+
+                            Text {
+                                id: text
+
+                                text: qsTr("Second page")
+                                font.pixelSize: pt * 25
+                            }
+                        }
+                    }
                 }
             }
         }