mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2025-07-04 17:15:29 +08:00
update
This commit is contained in:
@ -1,20 +1,24 @@
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtMultimedia 5.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
Rectangle {
|
||||
|
||||
property url source
|
||||
id:control
|
||||
width: 480
|
||||
height: 270
|
||||
color: FluColors.Black
|
||||
clip: true
|
||||
|
||||
property url source
|
||||
property bool showControl: true
|
||||
|
||||
|
||||
Rectangle{
|
||||
MouseArea{
|
||||
anchors.fill: parent
|
||||
color: FluColors.Black
|
||||
onClicked: {
|
||||
showControl = !showControl
|
||||
}
|
||||
}
|
||||
|
||||
MediaPlayer {
|
||||
@ -38,7 +42,7 @@ Item {
|
||||
}
|
||||
|
||||
onSourceChanged: {
|
||||
slider.seek(0)
|
||||
slider.seek(0)
|
||||
}
|
||||
|
||||
VideoOutput {
|
||||
@ -48,24 +52,27 @@ Item {
|
||||
|
||||
Item{
|
||||
height: 100
|
||||
y:showControl ? control.height - 110 : control.height
|
||||
anchors{
|
||||
bottom: parent.bottom
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
leftMargin: 10
|
||||
rightMargin: 10
|
||||
bottomMargin: 10
|
||||
}
|
||||
MouseArea{
|
||||
anchors.fill: parent
|
||||
}
|
||||
|
||||
Behavior on y{
|
||||
NumberAnimation{
|
||||
duration: 150
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
color:FluTheme.isDark ? Qt.rgba(45/255,45/255,45/255,0.97) : Qt.rgba(237/255,237/255,237/255,0.97)
|
||||
radius: 5
|
||||
layer.enabled: true
|
||||
layer.effect: GaussianBlur {
|
||||
radius: 5
|
||||
samples: 16
|
||||
}
|
||||
}
|
||||
|
||||
FluSlider{
|
||||
@ -81,6 +88,9 @@ Item {
|
||||
mediaplayer.seek(value*mediaplayer.duration/slider.maxValue)
|
||||
mediaplayer.autoSeek = true
|
||||
}
|
||||
onLineClickFunc:function(val){
|
||||
mediaplayer.seek(val*mediaplayer.duration/slider.maxValue)
|
||||
}
|
||||
}
|
||||
|
||||
FluText{
|
||||
@ -135,7 +145,13 @@ Item {
|
||||
return value.toString().padStart(2, '0');
|
||||
}
|
||||
|
||||
function pause(){
|
||||
mediaplayer.pause()
|
||||
}
|
||||
|
||||
function play(){
|
||||
mediaplayer.play()
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
@ -1,7 +1,6 @@
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
|
||||
Menu {
|
||||
id: popup
|
||||
@ -11,18 +10,11 @@ Menu {
|
||||
height: container.height
|
||||
|
||||
background: Item {
|
||||
|
||||
Rectangle{
|
||||
anchors.fill: parent
|
||||
color:FluTheme.isDark ? Qt.rgba(45/255,45/255,45/255,0.97) : Qt.rgba(237/255,237/255,237/255,0.97)
|
||||
radius: 5
|
||||
layer.enabled: true
|
||||
layer.effect: GaussianBlur {
|
||||
radius: 5
|
||||
samples: 16
|
||||
}
|
||||
}
|
||||
|
||||
FluShadow{
|
||||
radius: 5
|
||||
}
|
||||
|
@ -4,39 +4,51 @@ import QtGraphicalEffects 1.15
|
||||
|
||||
Item{
|
||||
|
||||
id:root
|
||||
|
||||
property int size: 180
|
||||
property int dotSize: 24
|
||||
|
||||
property int value: 50
|
||||
|
||||
property int maxValue: 100
|
||||
|
||||
|
||||
enum Orientation {
|
||||
Horizontal,
|
||||
Vertical
|
||||
}
|
||||
|
||||
height: control.height
|
||||
width: control.width
|
||||
|
||||
property int size: 180
|
||||
property int dotSize: 24
|
||||
property int value: 50
|
||||
property int maxValue: 100
|
||||
property int orientation: FluSlider.Horizontal
|
||||
|
||||
property bool isHorizontal: orientation === FluSlider.Horizontal
|
||||
|
||||
property bool enableTip : true
|
||||
|
||||
property var onLineClickFunc
|
||||
signal pressed
|
||||
signal released
|
||||
|
||||
id:root
|
||||
height: control.height
|
||||
width: control.width
|
||||
rotation: isHorizontal ? 0 : 180
|
||||
|
||||
Component.onCompleted: {
|
||||
seek(0)
|
||||
}
|
||||
|
||||
MouseArea{
|
||||
id:mouse_line
|
||||
anchors.centerIn: control
|
||||
width: isHorizontal ? control.width : 10
|
||||
height: isHorizontal ? 10 : control.height
|
||||
hoverEnabled: true
|
||||
onClicked:
|
||||
(mouse) => {
|
||||
var val;
|
||||
if(isHorizontal){
|
||||
val = mouse.x*maxValue/control.width
|
||||
}else{
|
||||
val = mouse.y*maxValue/control.height
|
||||
}
|
||||
if(onLineClickFunc){
|
||||
onLineClickFunc(val)
|
||||
}else{
|
||||
seek(val)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: control
|
||||
width: isHorizontal ? size : 4
|
||||
@ -51,6 +63,8 @@ Item{
|
||||
height: isHorizontal ? 5 : control.height*(value/maxValue)
|
||||
color:FluTheme.isDark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
Rectangle{
|
||||
@ -70,7 +84,7 @@ Item{
|
||||
radius: dotSize/4
|
||||
color:FluTheme.isDark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
|
||||
anchors.centerIn: parent
|
||||
scale: control_mouse.containsMouse ? 1.2 : 1
|
||||
scale: control_mouse.containsMouse || mouse_line.containsMouse ? 1.3 : 1
|
||||
Behavior on scale {
|
||||
NumberAnimation{
|
||||
duration: 150
|
||||
@ -109,14 +123,14 @@ Item{
|
||||
}
|
||||
}
|
||||
|
||||
function seek(position){
|
||||
function seek(val){
|
||||
if(isHorizontal){
|
||||
dot.x =position/maxValue*control.width - dotSize/2
|
||||
dot.x =val/maxValue*control.width - dotSize/2
|
||||
root.value = Qt.binding(function(){
|
||||
return (dot.x+dotSize/2)/control.width*maxValue
|
||||
})
|
||||
}else{
|
||||
dot.y =position/maxValue*control.height - dotSize/2
|
||||
dot.y =val/maxValue*control.height - dotSize/2
|
||||
root.value = Qt.binding(function(){
|
||||
return (dot.y+dotSize/2)/control.height*maxValue
|
||||
})
|
||||
|
Reference in New Issue
Block a user