diff --git a/example/Info.plist b/example/Info.plist deleted file mode 100644 index 23f254d..0000000 --- a/example/Info.plist +++ /dev/null @@ -1,28 +0,0 @@ - - - - - CFBundleExecutable - example - CFBundleIconFile - - CFBundleIdentifier - com.yourcompany.example - CFBundlePackageType - APPL - CFBundleSignature - ???? - LSMinimumSystemVersion - 10.14 - NOTE - This file was generated by Qt/QMake. - NSPrincipalClass - NSApplication - NSSupportsAutomaticGraphicsSwitching - - CFBundleDevelopmentRegion - en - CFBundleAllowMixedLocalizations - - - diff --git a/example/T_MediaPlayer.qml b/example/T_MediaPlayer.qml index 17a0c39..eaa668b 100644 --- a/example/T_MediaPlayer.qml +++ b/example/T_MediaPlayer.qml @@ -9,6 +9,14 @@ FluScrollablePage{ title:"MediaPlayer" + onVisibleChanged: { + if(visible){ + player.play() + }else{ + player.pause() + } + } + FluArea{ width: parent.width height: 320 @@ -21,6 +29,7 @@ FluScrollablePage{ } FluMediaPlayer{ + id:player source:"http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" } diff --git a/example/T_Typography.qml b/example/T_Typography.qml index d602fd1..4cc34f4 100644 --- a/example/T_Typography.qml +++ b/example/T_Typography.qml @@ -8,6 +8,10 @@ FluContentPage { title: "Typography" property int textSize: 13 + Component.onCompleted: { + slider.seek(31) + } + ScrollView{ clip: true width: parent.width @@ -68,17 +72,17 @@ FluContentPage { FluSlider{ + id:slider orientation:FluSlider.Vertical anchors{ right: parent.right - rightMargin: 30 + rightMargin: 45 top: parent.top topMargin: 30 } onValueChanged:{ textSize = value/100*16+8 } - value: 31 } } diff --git a/example/example.pro b/example/example.pro index 3212a08..e845f46 100644 --- a/example/example.pro +++ b/example/example.pro @@ -1,6 +1,5 @@ QT += quick concurrent network multimedia CONFIG += c++11 -CONFIG -= app_bundle DEFINES += QT_DEPRECATED_WARNINGS QT_NO_WARNING_OUTPUT SOURCES += \ @@ -8,9 +7,12 @@ SOURCES += \ main.cpp RESOURCES += qml.qrc + RC_ICONS = favicon.ico + QML_IMPORT_PATH = QML_DESIGNER_IMPORT_PATH = + CONFIG(debug,debug|release) { DESTDIR = $$absolute_path($${_PRO_FILE_PWD_}/../bin/debug) } else { diff --git a/src/controls/FluMediaPlayer.qml b/src/controls/FluMediaPlayer.qml index 3dc8e49..2de151b 100644 --- a/src/controls/FluMediaPlayer.qml +++ b/src/controls/FluMediaPlayer.qml @@ -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() + } } diff --git a/src/controls/FluMenu.qml b/src/controls/FluMenu.qml index f8c78e1..5a54e57 100644 --- a/src/controls/FluMenu.qml +++ b/src/controls/FluMenu.qml @@ -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 } diff --git a/src/controls/FluSlider.qml b/src/controls/FluSlider.qml index 2d872cb..d7e8c71 100644 --- a/src/controls/FluSlider.qml +++ b/src/controls/FluSlider.qml @@ -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 })