116 lines
3.0 KiB
QML
116 lines
3.0 KiB
QML
import QtQuick
|
|
import QtQuick.Layouts
|
|
import QtQuick.Window
|
|
import QtQuick.Controls
|
|
import FluentUI.Controls
|
|
import Gallery
|
|
|
|
ScrollablePage{
|
|
|
|
title: qsTr("Acrylic")
|
|
|
|
CardHighlight{
|
|
Layout.fillWidth: true
|
|
showDisabled: false
|
|
codeSnippet:
|
|
`import QtQuick
|
|
import QtQuick.Layouts
|
|
import QtQuick.Controls
|
|
import FluentUI.Controls
|
|
|
|
ColumnLayout{
|
|
width: parent.width
|
|
RowLayout{
|
|
spacing: 10
|
|
Label{
|
|
text:"tintColor:"
|
|
Layout.alignment: Qt.AlignVCenter
|
|
}
|
|
ColorPicker{
|
|
id:color_picker
|
|
}
|
|
}
|
|
RowLayout{
|
|
spacing: 10
|
|
Label{
|
|
text:"tintOpacity:"
|
|
Layout.alignment: Qt.AlignVCenter
|
|
}
|
|
Slider{
|
|
id:slider_tint_opacity
|
|
from:0
|
|
to:100
|
|
stepSize: 1
|
|
value: 65
|
|
}
|
|
}
|
|
RowLayout{
|
|
spacing: 10
|
|
Label{
|
|
text:"blurRadius:"
|
|
Layout.alignment: Qt.AlignVCenter
|
|
}
|
|
Slider{
|
|
id:slider_blur_radius
|
|
from:0
|
|
to:100
|
|
stepSize: 1
|
|
value: 32
|
|
}
|
|
}
|
|
Frame{
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: 1200/4+20
|
|
padding: 10
|
|
Layout.topMargin: 10
|
|
RoundClip{
|
|
width: 1920/4
|
|
height: 1200/4
|
|
radius:[8,8,8,8]
|
|
Image {
|
|
id:image
|
|
asynchronous: true
|
|
source: "qrc:/qt/qml/Gallery/res/image/bg_scenic.webp"
|
|
anchors.fill: parent
|
|
sourceSize: Qt.size(2*width,2*height)
|
|
}
|
|
Acrylic {
|
|
id:acrylic
|
|
target: image
|
|
width: 200
|
|
height: 200
|
|
tintOpacity: slider_tint_opacity.value/100
|
|
tintColor: color_picker.current
|
|
blurRadius: slider_blur_radius.value
|
|
x:(image.width-width)/2
|
|
y:(image.height-height)/2
|
|
Label {
|
|
anchors.centerIn: parent
|
|
text: "Acrylic"
|
|
color: "#FFFFFF"
|
|
font: Typography.subtitle
|
|
}
|
|
MouseArea {
|
|
property point clickPos: Qt.point(0,0)
|
|
id:drag_area
|
|
preventStealing: true
|
|
anchors.fill: parent
|
|
onPressed: (mouse)=>{
|
|
clickPos = Qt.point(mouse.x, mouse.y)
|
|
}
|
|
onPositionChanged: (mouse)=>{
|
|
var delta = Qt.point(mouse.x - clickPos.x,mouse.y - clickPos.y)
|
|
acrylic.x = acrylic.x + delta.x
|
|
acrylic.y = acrylic.y + delta.y
|
|
}
|
|
}
|
|
}
|
|
Layout.topMargin: 20
|
|
}
|
|
}
|
|
}
|
|
`}
|
|
|
|
|
|
}
|