added static image page widgets

Examples/src/VPGradientPage.qml

@@ -16,6 +16,7 @@ Page {
                 scrollPos: viewPort.globalPos
                 source:  modelData
                 viewground: root
+                height: root.height / 3
                 title: "Test ViewPortPage"
                 text: "Test ViewPortPage. General text and <i>html code</i>"
             }

Examples/src/VPStaticGradientPage.qml

@@ -0,0 +1,47 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Controls.Material 2.15
+
+import ViewSolutionsModule 1.0
+
+Page {
+    id: root
+
+    ListView {
+        id: viewPort
+        property real globalPos: 0
+        anchors.fill: parent
+        delegate: Component {
+            ViewPortStaticGradientPage {
+                source:  modelData
+                height: root.height / 3
+                width: viewPort.width
+                title: "Test ViewPortPage"
+                text: "Test ViewPortPage. General text and <i>html code</i>"
+            }
+        }
+
+        model: [
+            "qrc:/img/res/LOGO.png",
+            "qrc:/img/res/LOGO-GREAN.png",
+            "qrc:/img/res/LOGO-ORANGE.png",
+            "qrc:/img/res/LOGO-RED.png",
+            "qrc:/img/res/LOGO.png",
+            "qrc:/img/res/LOGO-GREAN.png",
+            "qrc:/img/res/LOGO-ORANGE.png",
+            "qrc:/img/res/LOGO-RED.png",
+            "qrc:/img/res/LOGO.png",
+            "qrc:/img/res/LOGO-GREAN.png",
+            "qrc:/img/res/LOGO-ORANGE.png",
+            "qrc:/img/res/LOGO-RED.png",
+            "qrc:/img/res/LOGO.png",
+            "qrc:/img/res/LOGO-GREAN.png",
+            "qrc:/img/res/LOGO-ORANGE.png",
+            "qrc:/img/res/LOGO-RED.png",
+            "qrc:/img/res/LOGO.png",
+            "qrc:/img/res/LOGO-GREAN.png",
+            "qrc:/img/res/LOGO-ORANGE.png",
+            "qrc:/img/res/LOGO-RED.png",
+        ]
+    }
+}

Examples/src/ViewPortContainerPage.qml

@@ -16,6 +16,8 @@ Page {
                 scrollPos: viewPort.globalPos
                 source:  modelData
                 viewground: root
+                height: root.height / 3
+
                 title: "Test ViewPortPage"
                 text: "Test ViewPortPage. General text and <i>html code</i>"
             }

Examples/src/main.qml

@@ -84,6 +84,7 @@ ApplicationWindow {
                 ListElement { title: "ImageView"; source: "qrc:/ImageViewPage.qml" }
                 ListElement { title: "ViewPortContainer"; source: "qrc:/ViewPortContainerPage.qml" }
                 ListElement { title: "ViewPortGradientPage"; source: "qrc:/VPGradientPage.qml" }
+                ListElement { title: "ViewPortStaticGradientPage"; source: "qrc:/VPStaticGradientPage.qml" }
 
             }
 

Examples/src/res.qrc

@@ -5,6 +5,7 @@
         <file>qtquickcontrols2.conf</file>
         <file>ViewPortContainerPage.qml</file>
         <file>VPGradientPage.qml</file>
+        <file>VPStaticGradientPage.qml</file>
     </qresource>
     <qresource prefix="/img">
         <file>res/LOGO.png</file>

ViewSolutions/src/ViewSolutionsModule/ViewPortDelegatBase.qml

@@ -4,20 +4,11 @@ import QtQuick.Controls 2.15
 import QtQuick.Controls.Material 2.15
 import QtQuick.Controls.Universal 2.15
 
-Item {
+ViewSolutionsControl {
     id: delegateItem
 
     property string source: ""
     property alias imageSource: image
-    property var background: Rectangle {
-        border.color: "black"
-        anchors.fill: parent
-        color: "#00000000"
-
-    }
-
-    property var bloor: Item {
-    }
 
     property var viewground: null
     property real scrollPos: 0
@@ -31,20 +22,11 @@ Item {
 
     property int viewPortDelegatW: 0
     property int viewPortDelegatH: 0
-    property var content: Item {
+
+    background: Rectangle {
+        border.color: "black"
         anchors.fill: parent
-    }
+        color: "#00000000"
-
-    onBackgroundChanged:{
-        updateLayout()
-    }
-
-    onContentChanged:{
-        updateLayout()
-    }
-
-    onBloorChanged:{
-        updateLayout()
     }
 
     width: (viewPortDelegatW)? viewPortDelegatW: (viewground)? viewground.width : 0
@@ -66,58 +48,9 @@ Item {
         flickable.contentY = -img.y;
     }
 
-    function updateLayout() {
-
-
-        if (background !== flickable.backgroundOld) {
-            if (flickable.backgroundOld) {
-                flickable.backgroundOld.parent = null
-            }
-
-            background.parent = this;
-            background.anchors.fill = this;
-            background.z = 0;
-            flickable.backgroundOld = background
-        }
-
-        flickable.z = 1;
-
-        if (bloor !== flickable.bloorOld) {
-            if (flickable.bloorOld) {
-                flickable.bloorOld.parent = null
-
-            }
-            bloor.parent = this;
-            bloor.anchors.fill = this;
-            bloor.z = 2;
-            flickable.bloorOld = bloor
-
-        }
-
-        if (content !== flickable.contentOld) {
-            if (flickable.contentOld) {
-                flickable.contentOld.parent = null
-
-            }
-            content.parent = this;
-            content.anchors.fill = this;
-            content.z = 3;
-            flickable.contentOld = content
-
-        }
-    }
-
     Flickable {
         id: flickable
 
-        property var backgroundOld: Item {
-        }
-        property var bloorOld: Item {
-        }
-        property var contentOld: Item {
-        }
-
-
         contentWidth: viewground.width
         contentHeight: viewground.height
         clip: true

ViewSolutions/src/ViewSolutionsModule/ViewPortGradientPage.qml

@@ -14,13 +14,12 @@ ViewPortPage {
 
         function onStatusChanged(status) {
             if (status === Image.Ready) {
-                bacground.color = colorPicker.pick(source);
+                background.color = colorPicker.pick(source);
             }
         }
     }
 
     background: Rectangle {
-        id: bacground
         color: colorPicker.pick(source)
         radius: 16
     }

ViewSolutions/src/ViewSolutionsModule/ViewPortStaticGradientPage.qml

@@ -0,0 +1,39 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Controls 2.15
+import QtQuick.Controls.Material 2.15
+import QtQuick.Controls.Universal 2.15
+import QtGraphicalEffects 1.15
+
+ViewPortStaticPage {
+
+    bloor: Item {
+        id: privateRoot
+        clip: true
+
+        property var theme: Material.theme
+
+        Rectangle {
+            rotation: -90
+
+            anchors.centerIn: privateRoot
+            radius: background.radius
+
+            height: privateRoot.width
+            width: privateRoot.height
+
+            gradient: Gradient {
+                GradientStop {
+                    position: 0.50;
+                    color: "#ff"+ baseColor;
+                }
+
+                GradientStop {
+                    position: 0.70;
+                    color: "#00" + baseColor;
+                }
+            }
+        }
+
+    }
+}

ViewSolutions/src/ViewSolutionsModule/ViewPortStaticPage.qml

@@ -0,0 +1,111 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Controls 2.15
+import QtQuick.Controls.Material 2.15
+import QtQuick.Controls.Universal 2.15
+import QtGraphicalEffects 1.15
+
+ViewSolutionsControl {
+
+    id: root
+
+    property string source: ""
+    property alias imageSource: image
+
+    property var theme: Material.theme
+    property string baseLigtColor: "fafafa"
+    property string baseDarkColor: "242424"
+    property string baseColor: (theme === Material.Dark)? baseDarkColor: baseLigtColor
+    property int margins: 5
+
+    property int textMargins: 10
+    property int sourceTextPointSize: 20
+    property int headerTextPointSize: 32
+
+    property alias title: header.text
+    property alias text: sourceText.text
+    property alias headerFontColor: header.color
+    property alias fontColor: sourceText.color
+
+    Connections {
+        target: imageSource
+
+        function onStatusChanged(status) {
+            if (status === Image.Ready) {
+                background.color = colorPicker.pick(source);
+            }
+        }
+    }
+
+    background: Rectangle {
+        anchors.fill: parent
+        color: colorPicker.pick(root.source);
+
+
+        Image {
+            id: image;
+            source: root.source
+
+            fillMode: Image.PreserveAspectFit
+            anchors.right: parent.right
+            anchors.margins: margins
+            anchors.top: parent.top
+            anchors.bottom: parent.bottom
+            width: (parent.width / 2) - margins * 2
+        }
+
+    }
+
+    content: Item {
+        id: privatePage
+
+        clip: true
+        Label {
+            id: header
+            font.bold: true
+            font.pointSize: headerTextPointSize
+
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
+            wrapMode: Text.WordWrap
+            clip: true
+            height: paintedHeight
+
+            anchors.top: parent.top
+            anchors.left: parent.left
+            anchors.right: parent.right
+            anchors.margins: textMargins
+
+            layer.effect: DropShadow {
+                verticalOffset: 2
+                color: "#80000000"
+                radius: 1
+                samples: 3
+            }
+        }
+
+        Label {
+            id: sourceText
+            font.bold: false
+            font.pointSize: sourceTextPointSize
+            horizontalAlignment: Text.AlignLeft
+            verticalAlignment: Text.AlignVCenter
+            width: parent.width / 2
+
+            wrapMode: Text.WordWrap
+            anchors.bottom: parent.bottom
+            anchors.top: header.bottom
+            anchors.left: parent.left
+            anchors.horizontalCenter: parent.Center
+            anchors.margins: textMargins
+
+            layer.enabled: true
+            layer.effect: DropShadow {
+                verticalOffset: 2
+                color: "#80000000"
+                radius: 1
+                samples: 3
+            }
+        }
+    }
+}

ViewSolutions/src/ViewSolutionsModule/ViewSolutionsControl.qml

@@ -0,0 +1,30 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Controls 2.15
+import QtQuick.Controls.Material 2.15
+import QtQuick.Controls.Universal 2.15
+
+
+Item {
+    property alias background: backgroudFrame.contentItem
+    property alias bloor: bloorFrame.contentItem
+    property alias content: contentFrame.contentItem
+
+    Control {
+        id: backgroudFrame
+        anchors.fill: parent;
+        z: 0
+    }
+
+    Control {
+        id: bloorFrame
+        anchors.fill: parent;
+        z: 1
+    }
+
+    Control {
+        id: contentFrame
+        anchors.fill: parent;
+        z: 2
+    }
+}

ViewSolutions/src/ViewSolutionsModule/qmldir

@@ -3,3 +3,5 @@ ImageView 1.0 ImageView.qml
 ViewPortDelegatBase 1.0 ViewPortDelegatBase.qml
 ViewPortPage 1.0 ViewPortPage.qml
 ViewPortGradientPage 1.0 ViewPortGradientPage.qml
+ViewPortStaticPage 1.0 ViewPortStaticPage.qml
+ViewPortStaticGradientPage 1.0 ViewPortStaticGradientPage.qml

ViewSolutions/src/ViewSolutionsResources.qrc

@@ -5,6 +5,9 @@
         <file>ViewSolutionsModule/ViewPortDelegatBase.qml</file>
         <file>ViewSolutionsModule/ViewPortPage.qml</file>
         <file>ViewSolutionsModule/ViewPortGradientPage.qml</file>
+        <file>ViewSolutionsModule/ViewPortStaticPage.qml</file>
+        <file>ViewSolutionsModule/ViewPortStaticGradientPage.qml</file>
+        <file>ViewSolutionsModule/ViewSolutionsControl.qml</file>
     </qresource>
     <qresource prefix="/img"/>
 </RCC>