1
0
mirror of https://gitlab.com/kelteseth/ScreenPlay.git synced 2024-09-14 22:42:34 +02:00

Move StartInfo delegate into StartInfoLinkImage

Fix headlines lines
Add drag and drop area
This commit is contained in:
Elias Steurer 2021-01-09 11:34:27 +01:00
parent 241066d96d
commit 82ead021b2
11 changed files with 288 additions and 146 deletions

View File

@ -89,5 +89,6 @@
<file>qml/Common/Util.js</file>
<file>qml/Common/Dialogs/CriticalError.qml</file>
<file>qml/Common/ColorPicker.qml</file>
<file>qml/Create/StartInfoLinkImage.qml</file>
</qresource>
</RCC>

View File

@ -194,132 +194,15 @@ Item {
}
}
delegate: Item {
id:delegate
delegate: StartInfoLinkImage {
id: delegate
image: model.image
category: model.category + ":"
description: model.description
text: model.text
link: model.link
width: gridView.cellWidth
height: gridView.cellHeight
Rectangle {
id: img
anchors.fill: parent
anchors.margins: 5
clip: true
layer.enabled: true
layer.effect: ElevationEffect {
elevation: 4
}
Image {
id:image
anchors.fill: parent
fillMode: Image.PreserveAspectCrop
source: model.image
}
LinearGradient {
anchors.fill: parent
end: Qt.point(0, 0)
start: Qt.point(0, parent.height * .66)
gradient: Gradient {
GradientStop {
position: 0.0
color: "#DD000000"
}
GradientStop {
position: 1.0
color: "#00000000"
}
}
}
Text {
id: txtCategory
text: model.category + ":"
font.pointSize: 10
font.family: ScreenPlay.settings.font
color: "white"
anchors {
left: parent.left
right: parent.right
bottom: txtText.top
margins: 15
bottomMargin: 5
}
}
Text {
id: txtText
text: model.text
font.pointSize: 16
font.family: ScreenPlay.settings.font
color: "white"
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
anchors {
left: parent.left
right: parent.right
bottom: parent.bottom
margins: 15
}
}
Rectangle {
color: Material.backgroundDimColor
anchors {
top: img.bottom
right: parent.right
left: parent.left
bottom: parent.bottom
}
Text {
id: description
text: model.description
font.pointSize: 14
font.family: ScreenPlay.settings.font
color: Material.primaryTextColor
anchors {
fill: parent
margins: 5
}
}
}
MouseArea {
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
hoverEnabled: true
onClicked: Qt.openUrlExternally(model.link)
onEntered: {
delegate.state = "hover"
}
onExited: {
delegate.state = ""
}
}
}
transitions: [
Transition {
from: ""
to: "hover"
ScaleAnimator {
target: image
duration: 80
from: 1
to: 1.05
}
},
Transition {
from: "hover"
to: ""
ScaleAnimator {
target: image
duration: 80
from: 1.05
to: 1
}
}
]
}
}
}

View File

@ -0,0 +1,141 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.15
import QtQuick.Controls.Material 2.12
import QtQuick.Particles 2.0
import QtGraphicalEffects 1.0
import QtQuick.Controls.Material.impl 2.12
import ScreenPlay 1.0
import ScreenPlay.Create 1.0
import ScreenPlay.QMLUtilities 1.0
import "../Common" as Common
Item {
id: delegate
property alias image: image.source
property alias category: txtCategory.text
property alias text: txtText.text
property alias description: description.text
property url link
Rectangle {
id: img
anchors.fill: parent
anchors.margins: 5
clip: true
layer.enabled: true
layer.effect: ElevationEffect {
elevation: 4
}
Image {
id: image
anchors.fill: parent
fillMode: Image.PreserveAspectCrop
}
LinearGradient {
anchors.fill: parent
end: Qt.point(0, 0)
start: Qt.point(0, parent.height * .66)
gradient: Gradient {
GradientStop {
position: 0.0
color: "#DD000000"
}
GradientStop {
position: 1.0
color: "#00000000"
}
}
}
Text {
id: txtCategory
font.pointSize: 10
font.family: ScreenPlay.settings.font
color: "white"
anchors {
left: parent.left
right: parent.right
bottom: txtText.top
margins: 15
bottomMargin: 5
}
}
Text {
id: txtText
font.pointSize: 16
font.family: ScreenPlay.settings.font
color: "white"
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
anchors {
left: parent.left
right: parent.right
bottom: parent.bottom
margins: 15
}
}
Rectangle {
color: Material.backgroundDimColor
anchors {
top: img.bottom
right: parent.right
left: parent.left
bottom: parent.bottom
}
Text {
id: description
font.pointSize: 14
font.family: ScreenPlay.settings.font
color: Material.primaryTextColor
anchors {
fill: parent
margins: 5
}
}
}
MouseArea {
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
hoverEnabled: true
onClicked: Qt.openUrlExternally(delegate.link)
onEntered: {
delegate.state = "hover"
}
onExited: {
delegate.state = ""
}
}
}
transitions: [
Transition {
from: ""
to: "hover"
ScaleAnimator {
target: image
duration: 80
from: 1
to: 1.05
}
},
Transition {
from: "hover"
to: ""
ScaleAnimator {
target: image
duration: 80
from: 1.05
to: 1
}
}
]
}

View File

@ -10,24 +10,23 @@ import "../../Common" as Common
WizardPage {
id: root
property url file
sourceComponent: ColumnLayout {
function create() {
ScreenPlay.wizards.createGifWallpaper(tfTitle.text,
cbLicense.name,
ScreenPlay.wizards.createGifWallpaper(tfTitle.text, cbLicense.name,
cbLicense.licenseFile,
tfCreatedBy.text,
fileSelector.file,
tfCreatedBy.text, root.file,
tagSelector.getTags())
}
property bool ready: tfTitle.text.length >= 1
&& fileSelector.file.length > 1
property bool ready: tfTitle.text.length >= 1 && root.file.length !== ""
onReadyChanged: root.ready = ready
Common.Headline {
id: txtHeadline
text: qsTr("Create a Gif Wallpaper")
text: qsTr("Import a Gif Wallpaper")
Layout.fillWidth: true
}
@ -47,15 +46,44 @@ WizardPage {
Rectangle {
id: leftWrapper
color: "#333333"
color: Qt.darker(Material.backgroundColor)
radius: 3
Layout.fillHeight: true
Layout.fillWidth: true
DropArea {
id: dropArea
anchors.fill: parent
onDropped: {
root.file = drop.urls[0]
leftWrapper.color = Qt.darker(
Qt.darker(Material.backgroundColor))
}
onExited: {
leftWrapper.color = Qt.darker(
Material.backgroundColor)
}
onEntered: {
leftWrapper.color = Qt.darker(
Qt.darker(Material.backgroundColor))
drag.accept(Qt.LinkAction)
}
}
Image {
id: bgPattern
anchors.fill: parent
fillMode: Image.Tile
opacity: .2
source: "qrc:/assets/images/noisy-texture-3.png"
}
Text {
color: Material.secondaryTextColor
color: Material.primaryTextColor
font.family: ScreenPlay.settings.font
text: qsTr("Select a gif below.")
font.pointSize: 13
text: qsTr("Drop a *.gif file here or use 'Select file' below.")
anchors.centerIn: parent
}
@ -63,7 +91,7 @@ WizardPage {
id: imgPreview
anchors.fill: parent
fillMode: Image.PreserveAspectCrop
source: fileSelector.fileDialog.fileUrl
source: root.file
}
}
@ -77,6 +105,7 @@ WizardPage {
Layout.fillWidth: true
placeHolderText: qsTr("Select your gif")
fileDialog.nameFilters: ["Gif (*.gif)"]
onFileChanged: root.file = file
}
}

View File

@ -32,6 +32,7 @@ WizardPage {
Common.Headline {
text: qsTr("Create a HTML Wallpaper")
Layout.fillWidth: true
}
Common.HeadlineSection {

View File

@ -28,7 +28,7 @@ Item {
Common.Headline {
Layout.alignment: Qt.AlignTop
Layout.fillWidth: true
text: qsTr("Import a video")
text: qsTr("Import any video type")
}
Text {

View File

@ -9,6 +9,7 @@ import ScreenPlay.Create 1.0
import "../../../Common" as Common
Item {
id: root

View File

@ -9,40 +9,122 @@ import ScreenPlay 1.0
import ScreenPlay.Create 1.0
import "../../../Common" as Common
import "../../"
Item {
id: root
signal next(var filePath)
ColumnLayout {
id: wrapper
spacing: 40
anchors {
top: parent.top
bottom: btnOpenDocs.top
left: parent.left
right: parent.right
margins: 20
}
Common.Headline {
Layout.alignment: Qt.AlignTop
Layout.fillWidth: true
text: qsTr("Import a video")
text: qsTr("Import a .webm video")
}
Text {
id: txtDescription
text: qsTr("When importing webm we can skip the long conversion.")
color: Material.primaryTextColor
RowLayout {
Layout.fillHeight: true
Layout.fillWidth: true
font.pointSize: 13
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
font.family: ScreenPlay.settings.font
}
spacing: 40
ColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
spacing: 40
Text {
id: txtDescription
text: qsTr("When importing webm we can skip the long conversion. When you get unsatisfying results with the ScreenPlay importer from 'ideo import and convert (all types)' you can also convert via the free and open source HandBrake!")
color: Material.primaryTextColor
Layout.fillWidth: true
font.pointSize: 13
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
font.family: ScreenPlay.settings.font
}
DropArea {
id: dropArea
Layout.fillHeight: true
Layout.fillWidth: true
Rectangle {
id: bg
anchors.fill: parent
radius: 3
color: Qt.darker(Material.backgroundColor)
}
Image {
id: bgPattern
anchors.fill: parent
fillMode: Image.Tile
opacity: .2
source: "qrc:/assets/images/noisy-texture-3.png"
}
onExited: {
bg.color = Qt.darker(Material.backgroundColor)
}
onEntered: {
bg.color = Qt.darker(Qt.darker(
Material.backgroundColor))
drag.accept(Qt.LinkAction)
}
onDropped: {
let file = ScreenPlay.util.toLocal(drop.urls[0])
bg.color = Qt.darker(Qt.darker(
Material.backgroundColor))
if (file.endsWith(".webm")) {
root.next(drop.urls[0])
} else {
txtFile.text = qsTr(
"Invalid file type. Must be valid VP8 or VP9 (*.webm)!")
}
}
Text {
id: txtFile
text: qsTr("Drop a *.webm file here or use 'Select file' below.")
anchors {
fill: parent
margins: 40
}
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
color: Material.primaryTextColor
font.pointSize: 13
horizontalAlignment: Qt.AlignHCenter
verticalAlignment: Qt.AlignVCenter
font.family: ScreenPlay.settings.font
}
}
}
Item {
Layout.fillHeight: true
Layout.preferredWidth: wrapper.width * .33
StartInfoLinkImage {
text: "Handbreak"
image: "qrc:/assets/startinfo/handbreak.png"
link: "https://handbrake.fr/"
description: "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cum sociis natoque penatibus et magnis dis parturient montes,"
category: "Tools"
width: 300
height: parent.height
anchors.centerIn: parent
}
}
}
}
Button {
id: btnOpenDocs
text: qsTr("Open Documentation")
Material.background: Material.LightGreen
Material.foreground: "white"
@ -55,6 +137,7 @@ Item {
"https://kelteseth.gitlab.io/ScreenPlayDocs/wallpaper/wallpaper/#performance")
anchors {
bottom: parent.bottom
left: parent.left
margins: 20
}
}

View File

@ -32,6 +32,7 @@ WizardPage {
Common.Headline {
text: qsTr("Create a QML Wallpaper")
Layout.fillWidth: true
}
Common.HeadlineSection {

View File

@ -31,6 +31,7 @@ WizardPage {
Common.Headline {
text: qsTr("Create a Website Wallpaper")
Layout.fillWidth: true
}
Common.HeadlineSection {

View File

@ -17,6 +17,7 @@ FocusScope {
signal saveFinished
signal cancelClicked
property Component sourceComponent
property alias savePopup: savePopup
property bool ready: false