mirror of
https://github.com/QuasarApp/ViewSolutions.git
synced 2025-04-26 17:54:41 +00:00
added static image page widgets
This commit is contained in:
parent
b4b9368f41
commit
c37366eb19
@ -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>"
|
||||
}
|
||||
|
47
Examples/src/VPStaticGradientPage.qml
Normal file
47
Examples/src/VPStaticGradientPage.qml
Normal file
@ -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",
|
||||
]
|
||||
}
|
||||
}
|
@ -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>"
|
||||
}
|
||||
|
@ -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" }
|
||||
|
||||
}
|
||||
|
||||
|
@ -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>
|
||||
|
@ -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
|
||||
}
|
||||
|
||||
onBackgroundChanged:{
|
||||
updateLayout()
|
||||
}
|
||||
|
||||
onContentChanged:{
|
||||
updateLayout()
|
||||
}
|
||||
|
||||
onBloorChanged:{
|
||||
updateLayout()
|
||||
color: "#00000000"
|
||||
}
|
||||
|
||||
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
|
||||
|
@ -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
|
||||
}
|
||||
|
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
111
ViewSolutions/src/ViewSolutionsModule/ViewPortStaticPage.qml
Normal file
111
ViewSolutions/src/ViewSolutionsModule/ViewPortStaticPage.qml
Normal file
@ -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
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -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
|
||||
}
|
||||
}
|
@ -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
|
||||
|
@ -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>
|
||||
|
Loading…
x
Reference in New Issue
Block a user