Mirrors/ScreenPlay
Mirrors/ScreenPlay
1
0
Fork 0
mirror of https://gitlab.com/kelteseth/ScreenPlay.git synced 2024-11-22 10:42:29 +01:00
Code Issues Projects Releases Activity

Change overall look like border radius and better font rendering

Browse Source
This commit is contained in:
kelteseth 2017-04-23 12:52:34 +02:00
parent abac757df1
commit f9b2af952e
9 changed files with 151 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ScreenPlay.pro
View File

@ -55,6 +55,7 @@ contains(QT_ARCH, i386) {
DISTFILES += \
steam_appid.txt \
assets/icons/favicon.ico

1
assets/icons/icon_window.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;"><path d="M9.073,2.606c-0.708,-0.141 -1.438,-0.141 -2.146,0l-0.26,1.467c-0.516,0.175 -0.992,0.45 -1.402,0.809l-1.4,-0.508c-0.476,0.543 -0.841,1.174 -1.073,1.858l1.14,0.959c-0.106,0.534 -0.106,1.084 0,1.618l-1.14,0.959c0.232,0.684 0.597,1.315 1.073,1.858l1.4,-0.508c0.41,0.359 0.886,0.634 1.402,0.809l0.26,1.467c0.708,0.141 1.438,0.141 2.146,0l0.26,-1.467c0.516,-0.175 0.992,-0.45 1.402,-0.809l1.4,0.508c0.476,-0.543 0.841,-1.174 1.073,-1.858l-1.14,-0.959c0.106,-0.534 0.106,-1.084 0,-1.618l1.14,-0.959c-0.232,-0.684 -0.597,-1.315 -1.073,-1.858l-1.4,0.508c-0.41,-0.359 -0.886,-0.634 -1.402,-0.809l-0.26,-1.467Zm-1.073,3.224c1.197,0 2.17,0.973 2.17,2.17c0,1.197 -0.973,2.17 -2.17,2.17c-1.197,0 -2.17,-0.973 -2.17,-2.17c0,-1.197 0.973,-2.17 2.17,-2.17Z" style="fill:#ffab00;"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

2
assets/images/Window.svg
View File

@ -1 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 186 121" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;"><path d="M185.562,119.752c0,0.596 -0.483,1.079 -1.079,1.079l-183.404,0c-0.596,0 -1.079,-0.483 -1.079,-1.079l0,-118.673c0,-0.596 0.483,-1.079 1.079,-1.079l183.404,0c0.596,0 1.079,0.483 1.079,1.079l0,118.673Z" style="fill:#fff;fill-rule:nonzero;"/></svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 310 121" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;"><path d="M310,5c0,-2.76 -2.24,-5 -5,-5l-300,0c-2.76,0 -5,2.24 -5,5l0,116l310,0l0,-116Z" style="fill:#484848;"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 664 B

After

Width:  |  Height:  |  Size: 529 B

104
qml/Components/Monitors.qml
View File

@ -14,53 +14,129 @@ Item {
}
onStateChanged: {
monitorWrapper.focus = monitors.state == "active" ? true : false
}
Rectangle {
id:blurParent
color: "#80ffffff"
id:background
color: "#80000000"
anchors.fill: parent
MouseArea {
anchors.fill: parent
onClicked: monitors.state = "inactive"
}
}
Rectangle {
width: 800
id:monitorWrapper
width: 900
height: 600
radius: 6
z:99
anchors.centerIn: parent
MouseArea {
id: mouseArea
anchors.fill: parent
Rectangle {
id: rectangle
height: 464
color: "#dfdfdf"
anchors.right: parent.right
anchors.rightMargin: 20
anchors.left: parent.left
anchors.leftMargin: 20
anchors.top: parent.top
anchors.topMargin: 20
}
}
}
FastBlur {
id:blur
anchors.fill: monitors
source: blurParent
radius: 64
DropShadow {
anchors.fill: monitorWrapper
radius: 12.0
cached: true
samples: 17
color: "#80000000"
source: monitorWrapper
}
states: [
State {
name: "active"
PropertyChanges {
target: monitors
visible: true
opacity: 1
enabled:true
}
PropertyChanges {
target: monitorWrapper
anchors.topMargin: 0
}
PropertyChanges {
target: blur
target: background
opacity: 1
}
},
State {
name: "inactive"
PropertyChanges {
target: monitors
visible: false
opacity: 0
enabled:false
}
PropertyChanges {
target: blur
target: monitorWrapper
anchors.topMargin: 50
}
PropertyChanges {
target: background
opacity: 0
}
}
]
transitions: [
Transition {
NumberAnimation {
target: background
property: "opacity"
duration: 200
easing.type: Easing.InOutQuad
}
NumberAnimation {
target: monitors
property: "opacity"
duration: 200
easing.type: Easing.InOutQuad
}
NumberAnimation {
target: monitorWrapper
property: "anchors.topMargin"
duration: 200
}
}
]

1
qml/Components/Navigation.qml
View File

@ -108,6 +108,7 @@ Rectangle {
anchors.verticalCenter: parent.verticalCenter
font.pixelSize: 16
font.family: font_Roboto_Regular.name
renderType: Text.NativeRendering
FontLoader{
id: font_Roboto_Regular

1
qml/Components/NavigationItem.qml
View File

@ -49,6 +49,7 @@ Item {
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
font.family: font_Roboto_Regular.name
renderType: Text.NativeRendering
FontLoader{
id: font_Roboto_Regular

67
qml/Components/ScreenPlayItem.qml
View File

@ -10,31 +10,41 @@ Item {
property string screenId: ""
signal itemClicked(var screenId)
Image {
id: mask
source: "qrc:/assets/images/Window.svg"
sourceSize: Qt.size(itemWrapper.width, itemWrapper.height)
smooth: true
sourceSize: Qt.size(rectangle1.width, rectangle1.height)
visible: false
fillMode: Image.PreserveAspectFit
antialiasing: true
}
RectangularGlow {
id: effect
anchors.fill: itemWrapper
glowRadius: 2
spread: 0.5
color: "black"
opacity: .2
cornerRadius: itemWrapper.radius + glowRadius
}
Rectangle {
id: itemWrapper
color: "white"
radius: 6
clip: true
radius: 5
anchors {
fill: parent
margins: 5
}
Rectangle {
id: rectangle1
height: 121
color: "#8b8b8b"
clip: true
visible: false
anchors.right: parent.right
anchors.rightMargin: 0
anchors.left: parent.left
@ -42,36 +52,55 @@ Item {
anchors.top: parent.top
anchors.topMargin: 0
ScreenPlayItemImage {
id: screenPlayItemImage
sourceImage: Qt.resolvedUrl(
"file:///" + installedListModel._screensPath
+ screenFolderId + "/" + screenPreview)
}
}
OpacityMask {
anchors.fill: rectangle1
antialiasing: true
source: rectangle1
maskSource: mask
}
MouseArea {
anchors.fill: parent
onClicked: {
itemClicked(screenId)
}
}
Text {
id: text1
y: 136
height: 29
text: screenTitle
anchors.rightMargin: 156
anchors.leftMargin: 5
anchors.bottomMargin: 5
anchors.topMargin: 5
renderType: Text.NativeRendering
anchors.rightMargin: 108
anchors.leftMargin: 10
anchors.bottomMargin: 10
anchors.topMargin: 10
anchors.top: rectangle1.bottom
anchors.right: parent.right
anchors.bottom: parent.bottom
anchors.left: parent.left
wrapMode: Text.WrapAnywhere
font.pixelSize: 11
anchors.margins: 10
}
wrapMode: Text.WordWrap
MouseArea {
anchors.fill: parent
onClicked: {
itemClicked(screenId)
font.pixelSize: 12
color: "#2F2F2F"
anchors.margins: 10
font.family: font_Roboto_Regular.name
FontLoader {
id: font_Roboto_Regular
source: "qrc:/assets/fonts/Roboto-Regular.ttf"
}
}

8
qml/Components/ScreenPlayItemImage.qml
View File

@ -2,10 +2,12 @@ import QtQuick 2.7
Image {
id: image
width: 300
height: 250
width: 320
height: 121
state: "loading"
property string sourceImage: ""
states: [
State {
name: "loading"
@ -39,7 +41,7 @@ Image {
}
]
property string sourceImage: ""
onSourceImageChanged: {
image.source = sourceImage

6
qml/Components/Sidebar.qml
View File

@ -78,13 +78,13 @@ Item {
Image {
id: imgBack
width: 22
height: 30
anchors.left: parent.left
anchors.leftMargin: 0
opacity: 1
source: "qrc:/assets/icons/icon_arrow_left.svg"
sourceSize: Qt.size(22,30)
sourceSize: Qt.size(14,23)
fillMode: Image.PreserveAspectCrop
anchors {
top:parent.top
topMargin: 0