diff --git a/example/App.qml b/example/App.qml
index 3dd88134..137a62b2 100644
--- a/example/App.qml
+++ b/example/App.qml
@@ -16,6 +16,7 @@ Window {
             "/about":"qrc:/page/AboutPage.qml",
             "/login":"qrc:/page/LoginPage.qml",
             "/chat":"qrc:/page/ChatPage.qml",
+            "/mediaplayer":"qrc:/page/MediaPlayerPage.qml",
         }
         FluApp.initialRoute = "/"
         FluApp.run()
diff --git a/example/example.pro b/example/example.pro
index 007595fe..5bdb77ad 100644
--- a/example/example.pro
+++ b/example/example.pro
@@ -1,5 +1,5 @@
-QT += quick quickcontrols2  concurrent network multimedia
-CONFIG += c++11
+QT += quick quickcontrols2 concurrent network multimedia
+CONFIG += c++17
 DEFINES += QT_DEPRECATED_WARNINGS QT_NO_WARNING_OUTPUT
 
 HEADERS += \
diff --git a/example/main.cpp b/example/main.cpp
index 9ff17505..e67f0767 100644
--- a/example/main.cpp
+++ b/example/main.cpp
@@ -18,7 +18,6 @@ int main(int argc, char *argv[])
     QCoreApplication::setOrganizationName("ZhuZiChu");
     QCoreApplication::setOrganizationDomain("https://zhuzichu520.github.io");
     QCoreApplication::setApplicationName("FluentUI");
-    //    QQuickWindow::setSceneGraphBackend(QSGRendererInterface::Software);
     QQuickStyle::setStyle("Basic");
     QGuiApplication app(argc, argv);
     QQmlApplicationEngine engine;
diff --git a/example/page/MediaPlayerPage.qml b/example/page/MediaPlayerPage.qml
new file mode 100644
index 00000000..6a29aae5
--- /dev/null
+++ b/example/page/MediaPlayerPage.qml
@@ -0,0 +1,37 @@
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import FluentUI
+
+FluWindow {
+
+    width: 640
+    height: 480
+    minimumWidth: 640
+    minimumHeight: 480
+
+    title:"视频播放器"
+
+
+    FluAppBar{
+        id:appbar
+        title:"视频播放器"
+        width:parent.width
+    }
+
+
+    FluMediaPlayer{
+        id:player
+        anchors{
+            left: parent.left
+            right: parent.right
+            top: appbar.bottom
+            bottom: parent.bottom
+        }
+        //                source:"http://mirror.aarnet.edu.au/pub/TED-talks/911Mothers_2010W-480p.mp4"
+        source:"http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4"
+        //                source:"http://video.chinanews.com/flv/2019/04/23/400/111773_web.mp4"
+    }
+
+
+}
diff --git a/example/qml.qrc b/example/qml.qrc
index 434575ab..86581805 100644
--- a/example/qml.qrc
+++ b/example/qml.qrc
@@ -152,5 +152,6 @@
         <file>global/ItemsOriginal.qml</file>
         <file>global/qmldir</file>
         <file>global/ItemsFooter.qml</file>
+        <file>page/MediaPlayerPage.qml</file>
     </qresource>
 </RCC>
diff --git a/src/FluentUI.pro b/src/FluentUI.pro
index 598db5c3..6ae7580c 100644
--- a/src/FluentUI.pro
+++ b/src/FluentUI.pro
@@ -1,5 +1,5 @@
 QT          += qml quick svg
-CONFIG      += plugin c++11
+CONFIG      += plugin c++17
 TEMPLATE    = lib
 TARGET      = FluentUI
 TARGET      = $$qtLibraryTarget($$TARGET)
diff --git a/src/controls/FluMediaPlayer.qml b/src/controls/FluMediaPlayer.qml
index ed94ab0a..88cfcc9a 100644
--- a/src/controls/FluMediaPlayer.qml
+++ b/src/controls/FluMediaPlayer.qml
@@ -28,7 +28,10 @@ Rectangle {
         property bool autoSeek:true
         source: control.source
         videoOutput: video_output
-        audioOutput:audio_output
+        audioOutput: AudioOutput{
+            id:audio_output
+        }
+
         onErrorChanged:
             (error)=> {
                 console.debug(error)
@@ -53,10 +56,6 @@ Rectangle {
         slider.seek(0)
     }
 
-    AudioOutput{
-        id:audio_output
-    }
-
     VideoOutput {
         id:video_output
         anchors.fill: parent
@@ -170,11 +169,10 @@ Rectangle {
             }
         }
 
-
         FluIconButton{
             id:btn_volume
             iconSize: 17
-            iconSource:  audio_output.volume ?  FluentIcons.Volume :  FluentIcons.Mute
+            iconSource:  audio_output.muted ? FluentIcons.Mute  :  FluentIcons.Volume
             anchors{
                 left: parent.left
                 leftMargin: 5
@@ -182,7 +180,7 @@ Rectangle {
                 bottomMargin: 10
             }
             onClicked: {
-                audio_output.volume = !audio_output.volume
+                audio_output.muted = !audio_output.muted
             }
         }