update

Use more elegant singleton and fix spell bug.

.cmake/InstallerScript.iss.in

@@ -30,6 +30,7 @@ SolidCompression=yes
 WizardStyle=modern
 UninstallDisplayIcon={app}\{#MyAppExeName}
 SetupIconFile=.\..\favicon.ico
+MinVersion = 6.0
 
 [Languages]
 Name: "chinesesimplified"; MessagesFile: "compiler:Languages\ChineseSimplified.isl"

.cmake/QmlPlugin.cmake

@@ -58,8 +58,8 @@ if (${QMLPLUGIN_LIBTYPE} MATCHES "SHARED")
     set(INSTALL_QMLDIR_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_LIST_DIR}/Qt5/${QMLPLUGIN_QMLDIR}/qmldir ${QMLPLUGIN_BINARY_DIR}/qmldir)
     set(COPY_QMLTYPES_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_LIST_DIR}/Qt5/${QMLPLUGIN_QMLDIR}/plugins.qmltypes $<TARGET_FILE_DIR:${TARGET}>/${QMLPLUGIN_URI}/plugins.qmltypes)
     set(INSTALL_QMLTYPES_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_LIST_DIR}/Qt5/${QMLPLUGIN_QMLDIR}/plugins.qmltypes ${QMLPLUGIN_BINARY_DIR}/plugins.qmltypes)
-    set(COPY_LIBRARY_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_BINARY_DIR}/$<TARGET_FILE_NAME:${TARGET}> $<TARGET_FILE_DIR:${TARGET}>/${QMLPLUGIN_URI})
-    set(INSTALL_LIBRARY_COMMAND ${CMAKE_COMMAND} -E copy ${CMAKE_CURRENT_BINARY_DIR}/$<TARGET_FILE_NAME:${TARGET}> ${QMLPLUGIN_BINARY_DIR})
+    set(COPY_LIBRARY_COMMAND ${CMAKE_COMMAND} -E copy $<TARGET_FILE_DIR:${TARGET}>/$<TARGET_FILE_NAME:${TARGET}> $<TARGET_FILE_DIR:${TARGET}>/${QMLPLUGIN_URI})
+    set(INSTALL_LIBRARY_COMMAND ${CMAKE_COMMAND} -E copy $<TARGET_FILE_DIR:${TARGET}>/$<TARGET_FILE_NAME:${TARGET}> ${QMLPLUGIN_BINARY_DIR})
     if(QMLPLUGIN_QMLDIR)
         set(COPY_QMLFILES_COMMAND ${CMAKE_COMMAND} -E copy_directory ${CMAKE_CURRENT_LIST_DIR}/Qt5/${QMLPLUGIN_QMLDIR} $<TARGET_FILE_DIR:${TARGET}>/${QMLPLUGIN_URI})
     else()

.github/workflows/macos.yml

@@ -22,7 +22,7 @@ jobs:
     strategy:
       matrix:
         os: [macos-13]
-        qt_ver: [6.6.0]
+        qt_ver: [6.6.1]
         qt_arch: [clang_64]
     env:
       targetName: example
@@ -50,11 +50,13 @@ jobs:
           cmake --version
           mkdir build
           cd build
-          cmake -DCMAKE_MESSAGE_LOG_LEVEL=STATUS -DCMAKE_PREFIX_PATH=/Users/runner/work/FluentUI/Qt/6.6.0/macos -DCMAKE_C_COMPILER=clang -DCMAKE_CXX_COMPILER=clang++ -DCMAKE_BUILD_TYPE=Release -GNinja ..
+          cmake -DCMAKE_MESSAGE_LOG_LEVEL=STATUS -DCMAKE_PREFIX_PATH=/Users/runner/work/FluentUI/Qt/6.6.1/macos -DCMAKE_C_COMPILER=clang -DCMAKE_CXX_COMPILER=clang++ -DCMAKE_BUILD_TYPE=Release -GNinja ..
           cmake --build . --target all --config Release --parallel
           
       - name: package
         run: |
+          # 先删除所有dSYM文件，减少包的体积
+          sudo find /Users/runner/work/FluentUI/Qt/6.6.1/macos/qml -name "*.dSYM" | xargs rm -r
           # 拷贝依赖
           sudo macdeployqt bin/release/${targetName}.app -qmldir=. -dmg     
           

.github/workflows/ubuntu.yml

@@ -23,7 +23,7 @@ jobs:
     strategy:
       matrix:
         os: [ubuntu-20.04]
-        qt_ver: [6.6.0]
+        qt_ver: [6.6.1]
         qt_arch: [gcc_64]
     env:
       targetName: example
@@ -55,7 +55,7 @@ jobs:
           cmake --version
           mkdir build
           cd build
-          cmake -DCMAKE_MESSAGE_LOG_LEVEL=STATUS -DCMAKE_PREFIX_PATH=/home/runner/work/FluentUI/Qt/6.6.0/gcc_64 -DCMAKE_C_COMPILER=gcc -DCMAKE_CXX_COMPILER=g++ -DCMAKE_BUILD_TYPE=Release -GNinja ..
+          cmake -DCMAKE_MESSAGE_LOG_LEVEL=STATUS -DCMAKE_PREFIX_PATH=/home/runner/work/FluentUI/Qt/6.6.1/gcc_64 -DCMAKE_C_COMPILER=gcc -DCMAKE_CXX_COMPILER=g++ -DCMAKE_BUILD_TYPE=Release -GNinja ..
           cmake --build . --target all --config Release --parallel
           
       - name: install QT linux deploy

.github/workflows/windows-mingw.yml

@@ -24,7 +24,7 @@ jobs:
         os: [windows-2022]
         include:
           - qt_arch: win64_mingw
-            qt_ver: 6.6.0
+            qt_ver: 6.6.1
             qt_tools: "tools_mingw,9.0.0-1-202203221220,qt.tools.win64_mingw900"
             qt_tools_mingw_install: mingw900_64
     env:
@@ -69,7 +69,7 @@ jobs:
           mkdir build
           cd build
           ninja --version
-          cmake -DCMAKE_MESSAGE_LOG_LEVEL=STATUS -DCMAKE_PREFIX_PATH=D:\a\FluentUI\Qt\6.6.0\mingw_64 -DCMAKE_C_COMPILER=gcc -DCMAKE_CXX_COMPILER=g++ -DCMAKE_BUILD_TYPE=Release -GNinja ..
+          cmake -DCMAKE_MESSAGE_LOG_LEVEL=STATUS -DCMAKE_PREFIX_PATH=D:\a\FluentUI\Qt\6.6.1\mingw_64 -DCMAKE_C_COMPILER=gcc -DCMAKE_CXX_COMPILER=g++ -DCMAKE_BUILD_TYPE=Release -GNinja ..
           cmake --build . --target all --config Release --parallel
       
       - name: package

.github/workflows/windows.yml

@@ -23,7 +23,7 @@ jobs:
       matrix:
         os: [windows-2019]
         include:
-          - qt_ver: 6.6.0        
+          - qt_ver: 6.6.1        
             qt_arch: win64_msvc2019_64
             msvc_arch: x64
             qt_arch_install: msvc2019_64  
@@ -52,7 +52,7 @@ jobs:
           ninja --version
           mkdir build
           cd build
-          cmake -DCMAKE_MESSAGE_LOG_LEVEL=STATUS -DCMAKE_PREFIX_PATH=D:\a\FluentUI\Qt\6.6.0\msvc2019_64 -DCMAKE_C_COMPILER=cl -DCMAKE_CXX_COMPILER=cl -DCMAKE_BUILD_TYPE=Release -GNinja ..
+          cmake -DCMAKE_MESSAGE_LOG_LEVEL=STATUS -DCMAKE_PREFIX_PATH=D:\a\FluentUI\Qt\6.6.1\msvc2019_64 -DCMAKE_C_COMPILER=cl -DCMAKE_CXX_COMPILER=cl -DCMAKE_BUILD_TYPE=Release -GNinja ..
           cmake --build . --target all --config Release --parallel
           echo winSdkDir=%WindowsSdkDir% >> %GITHUB_ENV%
           echo winSdkVer=%WindowsSdkVersion% >> %GITHUB_ENV%

.gitmodules

@@ -1,6 +0,0 @@
-[submodule "framelesshelper"]
-	path = framelesshelper
-	url = https://github.com/zhuzichu520/framelesshelper.git
-[submodule "zxing-cpp"]
-	path = zxing-cpp
-	url = https://github.com/zhuzichu520/zxing-cpp.git

CMakeLists.txt

@@ -1,6 +1,12 @@
 cmake_minimum_required(VERSION 3.20)
 
-project(FluentUI VERSION 0.1 LANGUAGES CXX)
+project(FluentUI VERSION 1.0)
+
+if(MSVC)
+    #让Release也生成pdb文件
+    set(CMAKE_SHARED_LINKER_FLAGS_RELEASE "${CMAKE_SHARED_LINKER_FLAGS_RELEASE} /DEBUG /OPT:REF /OPT:ICF")
+    set(CMAKE_EXE_LINKER_FLAGS_RELEASE "${CMAKE_EXE_LINKER_FLAGS_RELEASE} /DEBUG /OPT:REF /OPT:ICF")
+endif()
 
 set(FLUENTUI_DIRECTORY ${CMAKE_CURRENT_LIST_DIR})
 list(APPEND CMAKE_MODULE_PATH ${FLUENTUI_DIRECTORY}/.cmake/)
@@ -25,17 +31,17 @@ if(NOT FLUENTUI_QML_PLUGIN_DIRECTORY)
 endif()
 
 add_subdirectory(src)
-add_subdirectory(zxing-cpp)
+
+#Release也支持日志打印代码位置
+target_compile_definitions(fluentuiplugin
+    PRIVATE
+    QT_MESSAGELOGCONTEXT
+)
 
 if (FLUENTUI_BUILD_EXAMPLES)
     add_subdirectory(example)
 endif ()
 
-set(FRAMELESSHELPER_BUILD_STATIC ON)
-set(FRAMELESSHELPER_NO_DEBUG_OUTPUT ON)
-set(FRAMELESSHELPER_BUILD_WIDGETS OFF)
-add_subdirectory(framelesshelper)
-
 message("------------------------ FluentUI ------------------------")
 message("Build FluentUI demo applications.: ${FLUENTUI_BUILD_EXAMPLES}")
 message("Build static library.: ${FLUENTUI_BUILD_STATIC_LIB}")

example/CMakeLists.txt

@@ -1,12 +1,10 @@
 cmake_minimum_required(VERSION 3.20)
 
-project(example VERSION 0.1 LANGUAGES CXX)
+project(example VERSION 1.0 LANGUAGES CXX)
 
 #配置通用编译
+set(CMAKE_CXX_STANDARD 17)
 set(CMAKE_CXX_STANDARD_REQUIRED ON)
-if(APPLE)
-    set(CMAKE_OSX_ARCHITECTURES "arm64;x86_64" CACHE STRING "" FORCE)
-endif()
 
 #导入exmaple的QML位置，不然import example有时候会爆红
 set(QML_IMPORT_PATH ${CMAKE_BINARY_DIR}/example CACHE STRING "Qt Creator extra QML import paths" FORCE)
@@ -18,14 +16,15 @@ endif()
 
 #设置可执行文件输出目录
 if(CMAKE_BUILD_TYPE STREQUAL "Debug")
-    set(CMAKE_RUNTIME_OUTPUT_DIRECTORY ${FLUENTUI_DIRECTORY}/bin/debug)
+    set(CMAKE_RUNTIME_OUTPUT_DIRECTORY $<1:${FLUENTUI_DIRECTORY}/bin/debug>)
 else()
-    set(CMAKE_RUNTIME_OUTPUT_DIRECTORY ${FLUENTUI_DIRECTORY}/bin/release)
+    set(CMAKE_RUNTIME_OUTPUT_DIRECTORY $<1:${FLUENTUI_DIRECTORY}/bin/release>)
 endif()
 
 #获取文件路径分隔符（解决执行命令的时候有些平台会报错）
 file(TO_CMAKE_PATH "/" PATH_SEPARATOR)
 
+#导入Qt相关依赖包
 find_package(QT NAMES Qt6 Qt5 REQUIRED COMPONENTS Quick Svg Network)
 find_package(Qt${QT_VERSION_MAJOR} REQUIRED COMPONENTS Quick Svg Network)
 
@@ -51,24 +50,33 @@ foreach(filepath ${CPP_FILES})
     list(APPEND sources_files ${filename})
 endforeach(filepath)
 
+if(WIN32)
+    list(APPEND sources_files "src/app_dmp.h")
+endif()
+
 if(QT_VERSION VERSION_GREATER_EQUAL "6.2")
     #遍历所有qml文件
-    file(GLOB_RECURSE QML_PATHS *.qml)
+    file(GLOB_RECURSE QML_PATHS *.qml qmldir)
     foreach(filepath ${QML_PATHS})
         string(REPLACE "${CMAKE_CURRENT_SOURCE_DIR}/" "" filename ${filepath})
-        if(${filepath} MATCHES "Qt${QT_VERSION_MAJOR}/")
-            string(REPLACE "qml-Qt${QT_VERSION_MAJOR}" "qml" filealias ${filename})
+        if(${filepath} MATCHES "qml-Qt6")
+            string(REPLACE "qml-Qt6" "qml" filealias ${filename})
             set_source_files_properties(${filename} PROPERTIES QT_RESOURCE_ALIAS ${filealias})
-            list(APPEND qml_files ${filename})
+            if(${filename} MATCHES "qmldir")
+                list(APPEND resource_files ${filename})
+            else()
+                list(APPEND qml_files ${filename})
+            endif()
         endif()
     endforeach(filepath)
 
     #遍历所有资源文件
-    file(GLOB_RECURSE RES_PATHS *.png *.jpg *.svg *.ico *.ttf *.webp *.obj qmldir)
+    file(GLOB_RECURSE RES_PATHS *.png *.jpg *.svg *.ico *.ttf *.webp *.obj)
     foreach(filepath ${RES_PATHS})
         string(REPLACE "${CMAKE_CURRENT_SOURCE_DIR}/" "" filename ${filepath})
         list(APPEND resource_files ${filename})
     endforeach(filepath)
+
 endif()
 
 #如果是Windows平台，则生成rc文件，还有inno setup脚本文件
@@ -79,10 +87,10 @@ if(WIN32)
         ${FLUENTUI_DIRECTORY}/.cmake/version_exe.rc.in
         ${EXAMPLE_VERSION_RC_PATH}
     )
-    configure_file(
-        ${FLUENTUI_DIRECTORY}/.cmake/InstallerScript.iss.in
-        ${FLUENTUI_DIRECTORY}/action-cli/InstallerScript.iss
-    )
+configure_file(
+    ${FLUENTUI_DIRECTORY}/.cmake/InstallerScript.iss.in
+    ${FLUENTUI_DIRECTORY}/action-cli/InstallerScript.iss
+)
 endif()
 
 #添加可执行文件
@@ -97,20 +105,19 @@ else ()
     )
 endif ()
 
+#复制程序运行所需要的动态库
 if(WIN32)
-    #复制动态库到可执行文件同级目录下
-    if(CMAKE_SIZEOF_VOID_P EQUAL 4)
-        set(3RDPARTY_ARCH_DIR ${CMAKE_SOURCE_DIR}/3rdparty/Win_x86)
-    elseif(CMAKE_SIZEOF_VOID_P EQUAL 8)
-        set(3RDPARTY_ARCH_DIR ${CMAKE_SOURCE_DIR}/3rdparty/Win_x64)
-    endif()
     if(MSVC)
-        set(DLLPATH ${3RDPARTY_ARCH_DIR}/msvc/*.dll)
+        if(CMAKE_SIZEOF_VOID_P EQUAL 4)
+            set(3RDPARTY_DLL_DIR ${CMAKE_SOURCE_DIR}/3rdparty/msvc/x86/*.dll)
+        elseif(CMAKE_SIZEOF_VOID_P EQUAL 8)
+            set(3RDPARTY_DLL_DIR ${CMAKE_SOURCE_DIR}/3rdparty/msvc/x64/*.dll)
+        endif()
     elseif(MINGW)
-        set(DLLPATH ${3RDPARTY_ARCH_DIR}/mingw/*.dll)
+        set(3RDPARTY_DLL_DIR ${CMAKE_SOURCE_DIR}/3rdparty/mingw/*.dll)
     endif()
-    string(REPLACE "/" ${PATH_SEPARATOR} DLLPATH "${DLLPATH}")
-    file(GLOB DLL_FILES ${DLLPATH})
+    string(REPLACE "/" ${PATH_SEPARATOR} 3RDPARTY_DLL_DIR "${3RDPARTY_DLL_DIR}")
+    file(GLOB DLL_FILES ${3RDPARTY_DLL_DIR})
     add_custom_command(TARGET ${PROJECT_NAME} POST_BUILD
         COMMAND ${CMAKE_COMMAND} -E copy
         ${DLL_FILES}
@@ -119,7 +126,7 @@ if(WIN32)
 endif()
 
 if(QT_VERSION VERSION_GREATER_EQUAL "6.2")
-    #添加qml模块
+    #如果是Qt6.2以上，则使用qt_add_qml_module添加资源文件
     qt_add_qml_module(example
         URI "example"
         VERSION 1.0
@@ -128,10 +135,11 @@ if(QT_VERSION VERSION_GREATER_EQUAL "6.2")
         RESOURCE_PREFIX "/"
     )
 else()
+    #如果是Qt6.2以下，则使用qrc添加资源文件
     target_include_directories(example PRIVATE
         ${CMAKE_CURRENT_SOURCE_DIR}
     )
-target_sources(example PRIVATE example.qrc)
+    target_sources(example PRIVATE example.qrc)
 endif()
 
 #导入component头文件,不然通过QML_NAMED_ELEMENT生成的c++类会找不到头文件报错
@@ -155,6 +163,13 @@ set_target_properties(example PROPERTIES
     WIN32_EXECUTABLE TRUE
 )
 
+#Release也支持日志打印代码位置
+target_compile_definitions(example
+    PRIVATE
+    QT_MESSAGELOGCONTEXT
+)
+
+#目标文件链接库
 target_link_libraries(example PRIVATE
     Qt${QT_VERSION_MAJOR}::Quick
     Qt${QT_VERSION_MAJOR}::Svg

example/example.qrc

@@ -134,7 +134,6 @@
         <file>qml/page/T_CalendarPicker.qml</file>
         <file>qml/page/T_Captcha.qml</file>
         <file>qml/page/T_Carousel.qml</file>
-        <file>qml/page/T_Chart.qml</file>
         <file>qml/page/T_CheckBox.qml</file>
         <file>qml/page/T_ColorPicker.qml</file>
         <file>qml/page/T_ComboBox.qml</file>
@@ -143,7 +142,6 @@
         <file>qml/page/T_Expander.qml</file>
         <file>qml/page/T_FlipView.qml</file>
         <file>qml/page/T_Home.qml</file>
-        <file>qml/page/T_Http.qml</file>
         <file>qml/page/T_Image.qml</file>
         <file>qml/page/T_InfoBar.qml</file>
         <file>qml/page/T_Menu.qml</file>
@@ -189,5 +187,16 @@
         <file>qml/page/T_Clip.qml</file>
         <file>qml/page/T_3D.qml</file>
         <file>qml/global/Lang.qml</file>
+        <file>qml/page/T_Network.qml</file>
+        <file>qml/page/T_ShortcutPicker.qml</file>
+        <file>qml/chart/T_BarChart.qml</file>
+        <file>qml/chart/T_LineChart.qml</file>
+        <file>qml/chart/T_PieChart.qml</file>
+        <file>qml/chart/T_RadarChart.qml</file>
+        <file>qml/chart/T_ScatterChart.qml</file>
+        <file>qml/chart/T_BubbleChart.qml</file>
+        <file>qml/chart/T_PolarAreaChart.qml</file>
+        <file>res/image/ic_crash.png</file>
+        <file>qml/window/CrashWindow.qml</file>
     </qresource>
 </RCC>

example/qml-Qt6/App.qml

@@ -16,30 +16,19 @@ Item {
 
     Connections{
         target: FluApp
-        function onVsyncChanged(){
-            SettingsHelper.saveVsync(FluApp.vsync)
-        }
-    }
-
-    FluHttpInterceptor{
-        id:interceptor
-        function onIntercept(request){
-            if(request.method === "get"){
-                request.params["method"] = "get"
-            }
-            if(request.method === "post"){
-                request.params["method"] = "post"
-            }
-            request.headers["token"] ="yyds"
-            request.headers["os"] ="pc"
-            console.debug(JSON.stringify(request))
-            return request
+        function onUseSystemAppBarChanged(){
+            SettingsHelper.saveUseSystemAppBar(FluApp.useSystemAppBar)
         }
     }
 
     Component.onCompleted: {
+        FluNetwork.openLog = false
+        FluNetwork.setInterceptor(function(param){
+            param.addHeader("Token","000000000000000000000")
+        })
         FluApp.init(app)
-        FluApp.vsync = SettingsHelper.getVsync()
+        FluApp.windowIcon = "qrc:/example/res/image/favicon.ico"
+        FluApp.useSystemAppBar = SettingsHelper.getUseSystemAppBar()
         FluTheme.darkMode = SettingsHelper.getDarkMode()
         FluTheme.enableAnimation = true
         FluApp.routes = {
@@ -47,13 +36,17 @@ Item {
             "/about":"qrc:/example/qml/window/AboutWindow.qml",
             "/login":"qrc:/example/qml/window/LoginWindow.qml",
             "/hotload":"qrc:/example/qml/window/HotloadWindow.qml",
+            "/crash":"qrc:/example/qml/window/CrashWindow.qml",
             "/singleTaskWindow":"qrc:/example/qml/window/SingleTaskWindow.qml",
             "/standardWindow":"qrc:/example/qml/window/StandardWindow.qml",
             "/singleInstanceWindow":"qrc:/example/qml/window/SingleInstanceWindow.qml",
             "/pageWindow":"qrc:/example/qml/window/PageWindow.qml"
         }
-        FluApp.initialRoute = "/"
-        FluApp.httpInterceptor = interceptor
-        FluApp.run()
+        var args = Qt.application.arguments
+        if(args.length>=2 && args[1].startsWith("-crashed=")){
+            FluApp.navigate("/crash",{crashFilePath:args[1].replace("-crashed=","")})
+        }else{
+            FluApp.navigate("/")
+        }
     }
 }

example/qml-Qt6/chart/T_BarChart.qml

@@ -0,0 +1,132 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+import FluentUI
+import "qrc:///example/qml/component"
+
+FluScrollablePage{
+
+    title:"Bar Chart"
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'bar'
+            chartData: { return {
+                    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [65, 59, 80, 81, 56, 55, 40],
+                            backgroundColor: [
+                                'rgba(255, 99, 132, 0.2)',
+                                'rgba(255, 159, 64, 0.2)',
+                                'rgba(255, 205, 86, 0.2)',
+                                'rgba(75, 192, 192, 0.2)',
+                                'rgba(54, 162, 235, 0.2)',
+                                'rgba(153, 102, 255, 0.2)',
+                                'rgba(201, 203, 207, 0.2)'
+                            ],
+                            borderColor: [
+                                'rgb(255, 99, 132)',
+                                'rgb(255, 159, 64)',
+                                'rgb(255, 205, 86)',
+                                'rgb(75, 192, 192)',
+                                'rgb(54, 162, 235)',
+                                'rgb(153, 102, 255)',
+                                'rgb(201, 203, 207)'
+                            ],
+                            borderWidth: 1
+                        }]
+                }
+            }
+
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Bar Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    },
+                    responsive: true,
+                    scales: {
+                        xAxes: [{
+                                stacked: true,
+                            }],
+                        yAxes: [{
+                                stacked: true
+                            }]
+                    }
+                }
+            }
+        }
+    }
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'horizontalBar'
+            chartData: { return {
+                    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [65, 59, 80, 81, 56, 55, 40],
+                            backgroundColor: [
+                                'rgba(255, 99, 132, 0.2)',
+                                'rgba(255, 159, 64, 0.2)',
+                                'rgba(255, 205, 86, 0.2)',
+                                'rgba(75, 192, 192, 0.2)',
+                                'rgba(54, 162, 235, 0.2)',
+                                'rgba(153, 102, 255, 0.2)',
+                                'rgba(201, 203, 207, 0.2)'
+                            ],
+                            borderColor: [
+                                'rgb(255, 99, 132)',
+                                'rgb(255, 159, 64)',
+                                'rgb(255, 205, 86)',
+                                'rgb(75, 192, 192)',
+                                'rgb(54, 162, 235)',
+                                'rgb(153, 102, 255)',
+                                'rgb(201, 203, 207)'
+                            ],
+                            borderWidth: 1
+                        }]
+                }
+            }
+
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js HorizontalBar Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    },
+                    responsive: true,
+                    scales: {
+                        xAxes: [{
+                                stacked: true,
+                            }],
+                        yAxes: [{
+                                stacked: true
+                            }]
+                    }
+                }
+            }
+        }
+    }
+
+}

example/qml-Qt6/chart/T_BubbleChart.qml

@@ -0,0 +1,74 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+import FluentUI
+import "qrc:///example/qml/component"
+
+FluScrollablePage{
+
+    title:"Bubble Chart"
+
+    function randomScalingFactor() {
+        return Math.random().toFixed(1);
+    }
+
+    FluArea{
+        height: 370
+        width: 500
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'bubble'
+            chartData: {
+                return {
+                    datasets: [{
+                            label: 'First Dataset',
+                            data: [{
+                                    x: 20,
+                                    y: 30,
+                                    r: 15
+                                }, {
+                                    x: 12,
+                                    y: 70,
+                                    r: 20
+                                }, {
+                                    x: 11,
+                                    y: 28,
+                                    r: 8
+                                }, {
+                                    x: 9,
+                                    y: 28,
+                                    r: 10
+                                }, {
+                                    x: 43,
+                                    y: 7,
+                                    r: 14
+                                }, {
+                                    x: 22,
+                                    y: 22,
+                                    r: 12
+                                }, {
+                                    x: 40,
+                                    y: 10,
+                                    r: 10
+                                }],
+                            backgroundColor: 'rgb(255, 99, 132)'
+                        }]
+                }}
+            chartOptions: {return {
+                    maintainAspectRatio: false,
+                    responsive: true,
+                    hoverMode: 'nearest',
+                    intersect: true,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Bubble Chart - Multi Axis'
+                    }
+                }
+            }
+        }
+    }
+
+}

example/qml-Qt6/chart/T_LineChart.qml

@@ -0,0 +1,45 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+import FluentUI
+import "qrc:///example/qml/component"
+
+FluScrollablePage{
+
+    title:"Line Chart"
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'line'
+            chartData: { return {
+                    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [65, 59, 80, 81, 56, 55, 40],
+                            fill: false,
+                            borderColor: 'rgb(75, 192, 192)',
+                            tension: 0.1
+                        }]
+                }
+            }
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Line Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    }
+                }
+            }
+        }
+    }
+}

example/qml-Qt6/chart/T_PieChart.qml

@@ -0,0 +1,93 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+import FluentUI
+import "qrc:///example/qml/component"
+
+FluScrollablePage{
+
+    title:"Doughnut and Pie Chart"
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: "doughnut"
+            chartData: { return {
+                    labels: [
+                        'Red',
+                        'Blue',
+                        'Yellow'
+                    ],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [300, 50, 100],
+                            backgroundColor: [
+                                'rgb(255, 99, 132)',
+                                'rgb(54, 162, 235)',
+                                'rgb(255, 205, 86)'
+                            ],
+                            hoverOffset: 4
+                        }]
+                }
+            }
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Doughnut Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    }
+                }
+            }
+        }
+    }
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: "pie"
+            chartData: { return {
+                    labels: [
+                        'Red',
+                        'Blue',
+                        'Yellow'
+                    ],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [300, 50, 100],
+                            backgroundColor: [
+                                'rgb(255, 99, 132)',
+                                'rgb(54, 162, 235)',
+                                'rgb(255, 205, 86)'
+                            ],
+                            hoverOffset: 4
+                        }]
+                }
+            }
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Pie Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    }
+                }
+            }
+        }
+    }
+}

example/qml-Qt6/chart/T_PolarAreaChart.qml

@@ -0,0 +1,57 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+import FluentUI
+import "qrc:///example/qml/component"
+
+FluScrollablePage{
+
+    title:"PolarArea Chart"
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'polarArea'
+            chartData: { return {
+                    labels: [
+                        'Red',
+                        'Green',
+                        'Yellow',
+                        'Grey',
+                        'Blue'
+                    ],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [11, 16, 7, 3, 14],
+                            backgroundColor: [
+                                'rgb(255, 99, 132)',
+                                'rgb(75, 192, 192)',
+                                'rgb(255, 205, 86)',
+                                'rgb(201, 203, 207)',
+                                'rgb(54, 162, 235)'
+                            ]
+                        }]
+                }
+            }
+
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js PolarArea Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    }
+                }
+            }
+        }
+    }
+
+}

example/qml-Qt6/chart/T_RadarChart.qml

@@ -0,0 +1,74 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+import FluentUI
+import "qrc:///example/qml/component"
+
+FluScrollablePage{
+
+    title:"Radar Chart"
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'radar'
+            chartData: { return {
+                    labels: [
+                        'Eating',
+                        'Drinking',
+                        'Sleeping',
+                        'Designing',
+                        'Coding',
+                        'Cycling',
+                        'Running'
+                    ],
+                    datasets:
+                        [{
+                            label: 'My First Dataset',
+                            data: [65, 59, 90, 81, 56, 55, 40],
+                            fill: true,
+                            backgroundColor: 'rgba(255, 99, 132, 0.2)',
+                            borderColor: 'rgb(255, 99, 132)',
+                            pointBackgroundColor: 'rgb(255, 99, 132)',
+                            pointBorderColor: '#fff',
+                            pointHoverBackgroundColor: '#fff',
+                            pointHoverBorderColor: 'rgb(255, 99, 132)'
+                        }, {
+                            label: 'My Second Dataset',
+                            data: [28, 48, 40, 19, 96, 27, 100],
+                            fill: true,
+                            backgroundColor: 'rgba(54, 162, 235, 0.2)',
+                            borderColor: 'rgb(54, 162, 235)',
+                            pointBackgroundColor: 'rgb(54, 162, 235)',
+                            pointBorderColor: '#fff',
+                            pointHoverBackgroundColor: '#fff',
+                            pointHoverBorderColor: 'rgb(54, 162, 235)'
+                        }]
+                }
+            }
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Radar Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    },
+                    elements: {
+                        line: {
+                            borderWidth: 3
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+}

example/qml-Qt6/chart/T_ScatterChart.qml

@@ -0,0 +1,123 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+import FluentUI
+import "qrc:///example/qml/component"
+
+FluScrollablePage{
+
+    title:"Scatter Chart"
+
+    function randomScalingFactor() {
+        return Math.random().toFixed(1);
+    }
+
+    FluArea{
+        height: 370
+        width: 500
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'scatter'
+            chartData: {
+                return {
+                    datasets: [{
+                            label: 'My First dataset',
+                            xAxisID: 'x-axis-1',
+                            yAxisID: 'y-axis-1',
+                            borderColor: '#ff5555',
+                            backgroundColor: 'rgba(255,192,192,0.3)',
+                            data: [{
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }]
+                        }, {
+                            label: 'My Second dataset',
+                            xAxisID: 'x-axis-1',
+                            yAxisID: 'y-axis-2',
+                            borderColor: '#5555ff',
+                            backgroundColor: 'rgba(192,192,255,0.3)',
+                            data: [{
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }]
+                        }]
+                }}
+            chartOptions: {return {
+                    maintainAspectRatio: false,
+                    responsive: true,
+                    hoverMode: 'nearest',
+                    intersect: true,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Scatter Chart - Multi Axis'
+                    },
+                    scales: {
+                        xAxes: [{
+                                position: 'bottom',
+                                gridLines: {
+                                    zeroLineColor: 'rgba(0,0,0,1)'
+                                }
+                            }],
+                        yAxes: [{
+                                type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
+                                display: true,
+                                position: 'left',
+                                id: 'y-axis-1',
+                            }, {
+                                type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
+                                display: true,
+                                position: 'right',
+                                reverse: true,
+                                id: 'y-axis-2',
+
+                                // grid line settings
+                                gridLines: {
+                                    drawOnChartArea: false, // only want the grid lines for one axis to show up
+                                },
+                            }],
+                    }
+                }
+            }
+        }
+    }
+
+}

example/qml-Qt6/component/CodeExpander.qml

@@ -130,7 +130,6 @@ FluExpander{
                     "FluRadioButtons",
                     "FluImage",
                     "FluSpinBox",
-                    "FluHttp",
                     "FluWatermark",
                     "FluTour",
                     "FluQRCode",
@@ -140,7 +139,9 @@ FluExpander{
                     "FluStaggeredView",
                     "FluProgressButton",
                     "FluLoadingButton",
-                    "FluClip"
+                    "FluClip",
+                    "FluNetwork",
+                    "FluShortcutPicker"
                 ];
         code = code.replace(/\n/g, "<br>");
         code = code.replace(/ /g, "&nbsp;");

example/qml-Qt6/global/ItemsOriginal.qml

@@ -50,9 +50,7 @@ FluObject{
             }
             title:"Buttons"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/Button.png"
-            recentlyUpdated:true
-            desc:"A control that responds to user input and raisesa Click event."
+            extra:({image:"qrc:/example/res/image/control/Button.png",recentlyUpdated:true,desc:"A control that responds to user input and raisesa Click event."})
             url:"qrc:/example/qml/page/T_Buttons.qml"
             onTap:{
                 item_buttons.count = 0
@@ -83,18 +81,14 @@ FluObject{
         FluPaneItem{
             title:"Slider"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/Slider.png"
-            recentlyUpdated:true
-            desc:"A control that lets the user select from a rangeof values by moving a Thumb control along atrack."
+            extra:({image:"qrc:/example/res/image/control/Slider.png",recentlyUpdated:true,desc:"A control that lets the user select from a rangeof values by moving a Thumb control along atrack."})
             url:"qrc:/example/qml/page/T_Slider.qml"
             onTap:{ navigationView.push(url) }
         }
         FluPaneItem{
             title:"CheckBox"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/Checkbox.png"
-            recentlyUpdated:true
-            desc:"A control that a user can select or clear."
+            extra:({image:"qrc:/example/res/image/control/Checkbox.png",recentlyUpdated:true,desc:"A control that a user can select or clear."})
             url:"qrc:/example/qml/page/T_CheckBox.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -150,6 +144,12 @@ FluObject{
             url:"qrc:/example/qml/page/T_ColorPicker.qml"
             onTap:{ navigationView.push(url) }
         }
+        FluPaneItem{
+            title:"ShortcutPicker"
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/page/T_ShortcutPicker.qml"
+            onTap:{ navigationView.push(url) }
+        }
     }
 
     FluPaneItemExpander{
@@ -158,9 +158,7 @@ FluObject{
         FluPaneItem{
             title:"InfoBar"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/InfoBar.png"
-            recentlyUpdated:true
-            desc:"An inline message to display app-wide statuschange information."
+            extra:({image:"qrc:/example/res/image/control/InfoBar.png",recentlyUpdated:true,desc:"An inline message to display app-wide statuschange information."})
             url:"qrc:/example/qml/page/T_InfoBar.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -270,10 +268,7 @@ FluObject{
         FluPaneItem{
             title:"Pivot"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/Pivot.png"
-            recentlyAdded:true
-            order:3
-            desc:"Presents information from different sources in atabbed view."
+            extra:({image:"qrc:/example/res/image/control/Pivot.png",order:3,recentlyAdded:true,desc:"Presents information from different sources in atabbed view."})
             url:"qrc:/example/qml/page/T_Pivot.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -286,10 +281,7 @@ FluObject{
         FluPaneItem{
             title:"TabView"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/TabView.png"
-            recentlyAdded:true
-            order:1
-            desc:"A control that displays a collection of tabs thatcan be used to display several documents."
+            extra:({image:"qrc:/example/res/image/control/TabView.png",order:1,recentlyAdded:true,desc:"A control that displays a collection of tabs thatcan be used to display several documents."})
             url:"qrc:/example/qml/page/T_TabView.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -302,10 +294,7 @@ FluObject{
         FluPaneItem{
             title:"TableView"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/DataGrid.png"
-            recentlyAdded:true
-            order:4
-            desc:"The TableView control provides a flexible way to display a collection of data in rows and columns"
+            extra:({image:"qrc:/example/res/image/control/DataGrid.png",order:4,recentlyAdded:true,desc:"The TableView control provides a flexible way to display a collection of data in rows and columns"})
             url:"qrc:/example/qml/page/T_TableView.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -324,10 +313,7 @@ FluObject{
         FluPaneItem{
             title:"FlipView"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/FlipView.png"
-            recentlyAdded:true
-            order:2
-            desc:"Presents a collection of items that the user canflip through, one item at a time."
+            extra:({image:"qrc:/example/res/image/control/FlipView.png",order:2,recentlyAdded:true,desc:"Presents a collection of items that the user canflip through, one item at a time."})
             url:"qrc:/example/qml/page/T_FlipView.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -362,6 +348,53 @@ FluObject{
         }
     }
 
+    FluPaneItemExpander{
+        title: Lang.chart
+        icon:FluentIcons.AreaChart
+        FluPaneItem{
+            title:Lang.bar_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_BarChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.line_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_LineChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.pie_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_PieChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.polar_area_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_PolarAreaChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.bubble_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_BubbleChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.scatter_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_ScatterChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.radar_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_RadarChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+    }
+
     FluPaneItemSeparator{
         spacing:10
         size:1
@@ -401,15 +434,9 @@ FluObject{
             onTap:{ navigationView.push(url) }
         }
         FluPaneItem{
-            title:"Chart"
+            title:"Network"
             menuDelegate: paneItemMenu
-            url:"qrc:/example/qml/page/T_Chart.qml"
-            onTap:{ navigationView.push(url) }
-        }
-        FluPaneItem{
-            title:"Http"
-            menuDelegate: paneItemMenu
-            url:"qrc:/example/qml/page/T_Http.qml"
+            url:"qrc:/example/qml/page/T_Network.qml"
             onTap:{ navigationView.push(url) }
         }
         FluPaneItem{
@@ -439,25 +466,25 @@ FluObject{
             url:"qrc:/example/qml/page/T_3D.qml"
             onTap:{ navigationView.push(url) }
         }
+        FluPaneItem{
+            title:"Test Crash"
+            visible: FluTools.isWin()
+            onTapListener: function(){
+                AppInfo.testCrash()
+            }
+        }
     }
 
     function getRecentlyAddedData(){
         var arr = []
-        for(var i=0;i<children.length;i++){
-            var item = children[i]
-            if(item instanceof FluPaneItem && item.recentlyAdded){
+        var items = navigationView.getItems();
+        for(var i=0;i<items.length;i++){
+            var item = items[i]
+            if(item instanceof FluPaneItem && item.extra && item.extra.recentlyAdded){
                 arr.push(item)
             }
-            if(item instanceof FluPaneItemExpander){
-                for(var j=0;j<item.children.length;j++){
-                    var itemChild = item.children[j]
-                    if(itemChild instanceof FluPaneItem && itemChild.recentlyAdded){
-                        arr.push(itemChild)
-                    }
-                }
-            }
         }
-        arr.sort(function(o1,o2){ return o2.order-o1.order })
+        arr.sort(function(o1,o2){ return o2.extra.order-o1.extra.order })
         return arr
     }
 
@@ -466,7 +493,7 @@ FluObject{
         var items = navigationView.getItems();
         for(var i=0;i<items.length;i++){
             var item = items[i]
-            if(item instanceof FluPaneItem && item.recentlyUpdated){
+            if(item instanceof FluPaneItem && item.extra && item.extra.recentlyUpdated){
                 arr.push(item)
             }
         }

example/qml-Qt6/global/Lang.qml

@@ -20,6 +20,14 @@ QtObject {
     property string locale
     property string navigation_view_display_mode
     property string other
+    property string chart
+    property string bar_chart
+    property string line_chart
+    property string pie_chart
+    property string polar_area_chart
+    property string bubble_chart
+    property string scatter_chart
+    property string radar_chart
 
     function zh(){
         home="首页"
@@ -38,6 +46,14 @@ QtObject {
         locale="语言环境"
         navigation_view_display_mode="导航视图显示模式"
         other="其他"
+        chart="表格"
+        bar_chart="条形图"
+        line_chart="折线图"
+        pie_chart="饼图"
+        polar_area_chart="极坐标区域图"
+        bubble_chart="气泡图"
+        scatter_chart="散点图"
+        radar_chart="雷达图"
     }
 
     function en(){
@@ -57,6 +73,14 @@ QtObject {
         locale="Locale"
         navigation_view_display_mode="NavigationView Display Mode"
         other="Other"
+        chart="Chart"
+        bar_chart="Bar Chart"
+        line_chart="Line Chart"
+        pie_chart="Pie Chart"
+        polar_area_chart="Polar Area Chart"
+        bubble_chart="Bubble Chart"
+        scatter_chart="Scatter Chart"
+        radar_chart="Radar Chart"
     }
 
     property string __locale

example/qml-Qt6/page/T_Captcha.qml

@@ -43,6 +43,7 @@ FluScrollablePage{
         FluTextBox{
             id:text_box
             placeholderText: "请输入验证码"
+            Layout.preferredWidth: 240
         }
         FluButton{
             text:"verify"

example/qml-Qt6/page/T_Chart.qml

@@ -1,331 +0,0 @@
-import QtQuick
-import QtQuick.Layouts
-import QtQuick.Window
-import QtQuick.Controls
-import FluentUI
-import "qrc:///example/qml/component"
-
-FluScrollablePage{
-
-    title:"Chart"
-
-    function randomScalingFactor() {
-        return Math.random().toFixed(1);
-    }
-
-    FluArea{
-        height: 370
-        width: 500
-        paddings: 10
-        Layout.topMargin: 20
-        FluChart{
-            anchors.fill: parent
-            chartType: 'scatter'
-            chartData: {
-                return {
-                    datasets: [{
-                            label: 'My First dataset',
-                            xAxisID: 'x-axis-1',
-                            yAxisID: 'y-axis-1',
-                            borderColor: '#ff5555',
-                            backgroundColor: 'rgba(255,192,192,0.3)',
-                            data: [{
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }]
-                        }, {
-                            label: 'My Second dataset',
-                            xAxisID: 'x-axis-1',
-                            yAxisID: 'y-axis-2',
-                            borderColor: '#5555ff',
-                            backgroundColor: 'rgba(192,192,255,0.3)',
-                            data: [{
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }]
-                        }]
-                }}
-            chartOptions: {return {
-                    maintainAspectRatio: false,
-                    responsive: true,
-                    hoverMode: 'nearest',
-                    intersect: true,
-                    title: {
-                        display: true,
-                        text: 'Chart.js Scatter Chart - Multi Axis'
-                    },
-                    scales: {
-                        xAxes: [{
-                                position: 'bottom',
-                                gridLines: {
-                                    zeroLineColor: 'rgba(0,0,0,1)'
-                                }
-                            }],
-                        yAxes: [{
-                                type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
-                                display: true,
-                                position: 'left',
-                                id: 'y-axis-1',
-                            }, {
-                                type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
-                                display: true,
-                                position: 'right',
-                                reverse: true,
-                                id: 'y-axis-2',
-
-                                // grid line settings
-                                gridLines: {
-                                    drawOnChartArea: false, // only want the grid lines for one axis to show up
-                                },
-                            }],
-                    }
-                }
-            }
-        }
-    }
-
-    FluArea{
-        width: 500
-        height: 370
-        paddings: 10
-        Layout.topMargin: 20
-        FluChart{
-            anchors.fill: parent
-            chartType: 'bar'
-            chartData: { return {
-                    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
-                    datasets: [{
-                            label: 'Dataset 1',
-                            backgroundColor: '#ff9999',
-                            stack: 'Stack 0',
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ]
-                        }, {
-                            label: 'Dataset 2',
-                            backgroundColor: '#9999ff',
-                            stack: 'Stack 0',
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ]
-                        }, {
-                            label: 'Dataset 3',
-                            backgroundColor: '#99ff99',
-                            stack: 'Stack 1',
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ]
-                        }]
-                }
-            }
-
-            chartOptions: { return {
-                    maintainAspectRatio: false,
-                    title: {
-                        display: true,
-                        text: 'Chart.js Bar Chart - Stacked'
-                    },
-                    tooltips: {
-                        mode: 'index',
-                        intersect: false
-                    },
-                    responsive: true,
-                    scales: {
-                        xAxes: [{
-                                stacked: true,
-                            }],
-                        yAxes: [{
-                                stacked: true
-                            }]
-                    }
-                }
-            }
-        }
-    }
-
-    FluArea{
-        width: 500
-        height: 370
-        paddings: 10
-        Layout.topMargin: 20
-        FluChart{
-            anchors.fill: parent
-            chartType: 'pie'
-            chartData: {return {
-                    datasets: [{
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                            ],
-                            backgroundColor: [
-                                '#ffbbbb',
-                                '#ffddaa',
-                                '#ffffbb',
-                                '#bbffbb',
-                                '#bbbbff'
-                            ],
-                            label: 'Dataset 1'
-                        }],
-                    labels: [
-                        'Red',
-                        'Orange',
-                        'Yellow',
-                        'Green',
-                        'Blue'
-                    ]
-                }}
-            chartOptions: {return {maintainAspectRatio: false, responsive: true}}
-        }
-    }
-
-    FluArea{
-        width: 500
-        height: 370
-        paddings: 10
-        Layout.topMargin: 20
-        FluChart{
-            anchors.fill: parent
-            chartType: 'line'
-            chartData: { return {
-                    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
-                    datasets: [{
-                            label: 'Filled',
-                            fill: true,
-                            backgroundColor: 'rgba(192,222,255,0.3)',
-                            borderColor: 'rgba(128,192,255,255)',
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ],
-                        }, {
-                            label: 'Dashed',
-                            fill: false,
-                            backgroundColor: 'rgba(0,0,0,0)',
-                            borderColor: '#009900',
-                            borderDash: [5, 5],
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ],
-                        }, {
-                            label: 'Filled',
-                            backgroundColor: 'rgba(0,0,0,0)',
-                            borderColor: '#990000',
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ],
-                            fill: false,
-                        }]
-                }
-            }
-
-            chartOptions: {return {
-                    maintainAspectRatio: false,
-                    responsive: true,
-                    title: {
-                        display: true,
-                        text: 'Chart.js Line Chart'
-                    },
-                    tooltips: {
-                        mode: 'index',
-                        intersect: false,
-                    },
-                    hover: {
-                        mode: 'nearest',
-                        intersect: true
-                    },
-                    scales: {
-                        xAxes: [{
-                                display: true,
-                                scaleLabel: {
-                                    display: true,
-                                    labelString: 'Month'
-                                }
-                            }],
-                        yAxes: [{
-                                display: true,
-                                scaleLabel: {
-                                    display: true,
-                                    labelString: 'Value'
-                                }
-                            }]
-                    }
-                }
-            }
-        }
-    }
-
-}

example/qml-Qt6/page/T_Dialog.qml

@@ -115,4 +115,68 @@ FluScrollablePage{
             showSuccess("点击最小化按钮")
         }
     }
+
+    FluArea{
+        Layout.fillWidth: true
+        height: 68
+        paddings: 10
+        Layout.topMargin: 20
+        FluButton{
+            anchors.verticalCenter: parent.verticalCenter
+            Layout.topMargin: 20
+            text:"Custom Content Dialog"
+            onClicked: {
+                custom_btn_dialog.open()
+            }
+        }
+    }
+    CodeExpander{
+        Layout.fillWidth: true
+        Layout.topMargin: -1
+        code:'FluContentDialog{
+    id:dialog
+    title:"友情提示"
+    message:"数据正在加载中，请稍等..."
+    negativeText:"取消加载"
+    contentDelegate: Component{
+        Item{
+            width: parent.width
+            height: 80
+            FluProgressRing{
+                anchors.centerIn: parent
+            }
+        }
+    }
+    onNegativeClicked:{
+        showSuccess("点击取消按钮")
+    }
+    positiveText:"确定"
+    onPositiveClicked:{
+        showSuccess("点击确定按钮")
+    }
+    dialog.open()'
+    }
+
+    FluContentDialog{
+        id:custom_btn_dialog
+        title:"友情提示"
+        message:"数据正在加载中，请稍等..."
+        negativeText:"取消加载"
+        contentDelegate: Component{
+            Item{
+                width: parent.width
+                height: 80
+                FluProgressRing{
+                    anchors.centerIn: parent
+                }
+            }
+        }
+        onNegativeClicked:{
+            showSuccess("点击取消按钮")
+        }
+        positiveText:"确定"
+        onPositiveClicked:{
+            showSuccess("点击确定按钮")
+        }
+    }
 }

example/qml-Qt6/page/T_Home.qml

@@ -27,7 +27,6 @@ FluScrollablePage{
             id: bg
             fillMode:Image.PreserveAspectCrop
             anchors.fill: parent
-            asynchronous: true
             verticalAlignment: Qt.AlignTop
             sourceSize: Qt.size(960,640)
             source: "qrc:/example/res/image/bg_home_header.png"
@@ -160,7 +159,7 @@ FluScrollablePage{
     Component{
         id:com_item
         Item{
-            property string desc: modelData.desc
+            property string desc: modelData.extra.desc
             width: 320
             height: 120
             FluArea{
@@ -182,7 +181,7 @@ FluScrollablePage{
                     id:item_icon
                     height: 40
                     width: 40
-                    source: modelData.image
+                    source: modelData.extra.image
                     anchors{
                         left: parent.left
                         leftMargin: 20

example/qml-Qt6/page/T_Http.qml

@@ -1,405 +0,0 @@
-import QtQuick
-import Qt.labs.platform
-import QtQuick.Layouts
-import QtQuick.Window
-import QtQuick.Controls
-import QtQuick.Dialogs
-import FluentUI
-import "qrc:///example/qml/component"
-
-FluContentPage{
-
-    title:"Http"
-    property string cacheDirPath: StandardPaths.writableLocation(StandardPaths.AppLocalDataLocation) + "/cache/http"
-    property bool isDownCompleted: false
-
-    FluHttp{
-        id:http
-        cacheDir:cacheDirPath
-    }
-
-    FluHttp{
-        id:http_breakpoint_download
-        cacheDir:cacheDirPath
-        breakPointDownload: true
-    }
-
-    FluHttp{
-        id:http_cache_ifnonecacherequest
-        cacheMode:FluHttpType.IfNoneCacheRequest
-        cacheDir:cacheDirPath
-    }
-
-    FluHttp{
-        id:http_cache_requestfailedreadcache
-        cacheMode:FluHttpType.RequestFailedReadCache
-        cacheDir:cacheDirPath
-    }
-
-    FluHttp{
-        id:http_cache_firstcachethenrequest
-        cacheMode:FluHttpType.FirstCacheThenRequest
-        cacheDir:cacheDirPath
-    }
-
-    HttpCallable{
-        id:callable
-        onStart: {
-            showLoading()
-        }
-        onFinish: {
-            hideLoading()
-        }
-        onError:
-            (status,errorString,result)=>{
-                console.debug(status+";"+errorString+";"+result)
-            }
-        onSuccess:
-            (result)=>{
-                text_info.text = result
-            }
-        onCache:
-            (result)=>{
-                text_info.text = result
-            }
-    }
-
-    Flickable{
-        id:layout_flick
-        width: 200
-        clip: true
-        anchors{
-            top: parent.top
-            topMargin: 20
-            bottom: parent.bottom
-            left: parent.left
-        }
-        ScrollBar.vertical: FluScrollBar {}
-        contentHeight:layout_column.height
-        Column{
-            spacing: 2
-            id:layout_column
-            width: parent.width
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "Get请求"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/get")
-                    http.get(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "Post表单请求"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    var params = {}
-                    params.custname = "朱子楚"
-                    params.custtel = "1234567890"
-                    params.custemail = "zhuzichu520@gmail.com"
-                    request.params = params
-                    var headers = {}
-                    headers.test = "123456789456465321354"
-                    request.headers = headers
-                    http.post(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "Post Json请求"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    var params = {}
-                    params.custname = "朱子楚"
-                    params.custtel = "1234567890"
-                    params.custemail = "zhuzichu520@gmail.com"
-                    request.params = params
-                    http.postJson(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "Post String请求"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    request.params = "我命由我不由天"
-                    http.postString(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "Delete请求"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/delete")
-                    http.deleteResource(request,callable)
-                }
-            }
-            FluProgressButton{
-                id:btn_download
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "下载文件"
-                onClicked: {
-                    folder_dialog.open()
-                }
-            }
-            FluProgressButton{
-                property bool downloading: false
-                id:btn_breakpoint_download
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: {
-                    if(downloading){
-                        return "暂停下载"
-                    }
-                    if(progress === 0){
-                        return "断点下载文件"
-                    }else if(progress === 1){
-                        return "打开文件"
-                    }else{
-                        return "继续下载"
-                    }
-                }
-                HttpRequest{
-                    id:request_breakpoint_download
-                    url: "http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4"
-                    downloadSavePath: FluTools.getApplicationDirPath()+ "/download/big_buck_bunny.mp4"
-                }
-                HttpCallable{
-                    id:callable_breakpoint_download
-                    onStart: {
-                        btn_breakpoint_download.downloading = true
-                    }
-                    onFinish: {
-                        btn_breakpoint_download.downloading = false
-                    }
-                    onError:
-                        (status,errorString,result)=>{
-                            console.debug(status+";"+errorString+";"+result)
-                        }
-                    onSuccess:
-                        (result)=>{
-                            if(!isDownCompleted){
-                                tour.open()
-                                isDownCompleted = true
-                            }
-                            showSuccess(result)
-                        }
-                    onDownloadProgress:
-                        (recv,total)=>{
-                            btn_breakpoint_download.progress = recv/total
-                        }
-                }
-                Component.onCompleted: {
-                    progress = http_breakpoint_download.getBreakPointProgress(request_breakpoint_download)
-                }
-                onClicked: {
-                    if(downloading){
-                        http_breakpoint_download.cancel()
-                        return
-                    }
-                    if(progress === 1){
-                        FluTools.showFileInFolder(request_breakpoint_download.downloadSavePath)
-                    }else{
-                        http_breakpoint_download.download(request_breakpoint_download,callable_breakpoint_download)
-                    }
-                }
-                FluMenu{
-                    id:menu_breakpoint_download
-                    width: 120
-                    FluMenuItem{
-                        text: "删除文件"
-                        onClicked: {
-                            if(FluTools.removeFile(request_breakpoint_download.downloadSavePath)){
-                                btn_breakpoint_download.progress = 0
-                            }
-                        }
-                    }
-                }
-                MouseArea {
-                    anchors.fill: parent
-                    acceptedButtons: Qt.RightButton
-                    onClicked: {
-                        if(btn_breakpoint_download.progress === 1){
-                            menu_breakpoint_download.popup()
-                        }
-                    }
-                }
-            }
-            FluProgressButton{
-                id:btn_upload
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "文件上传"
-                onClicked: {
-                    file_dialog.open()
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "FirstCacheThenRequest缓存"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    request.params = {cacheMode:"FirstCacheThenRequest"}
-                    http_cache_firstcachethenrequest.post(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "RequestFailedReadCache缓存"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    request.params = {cacheMode:"RequestFailedReadCache"}
-                    http_cache_requestfailedreadcache.post(request,callable)
-                }
-            }
-
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "IfNoneCacheRequest缓存"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    request.params = {cacheMode:"IfNoneCacheRequest"}
-                    http_cache_ifnonecacherequest.post(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "打开缓存路径"
-                onClicked: {
-                    Qt.openUrlExternally(cacheDirPath)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "删除缓存"
-                onClicked: {
-                    console.debug(FluTools.removeDir(cacheDirPath))
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "清空右边数据"
-                onClicked: {
-                    text_info.text = ""
-                }
-            }
-        }
-    }
-
-    FluTour{
-        id:tour
-        steps:[
-            {title:"友情提示",description: "下载已完成，左击这里可以打开文件所在路径，右击可以弹出菜单删除文件！",target:()=>btn_breakpoint_download}
-        ]
-    }
-
-    HttpCallable{
-        id:callable_upload
-        onStart: {
-            btn_upload.disabled = true
-        }
-        onFinish: {
-            btn_upload.disabled = false
-        }
-        onError:
-            (status,errorString,result)=>{
-                btn_upload.progress = 0
-                text_info.text = result
-                console.debug(result)
-            }
-        onSuccess:
-            (result)=>{
-                text_info.text = result
-            }
-        onUploadProgress:
-            (sent,total)=>{
-                btn_upload.progress = sent/total
-            }
-    }
-    FileDialog {
-        id: file_dialog
-        onAccepted: {
-            var request = http.newRequest("https://httpbingo.org/post")
-            var params = {}
-            for(var i=0;i<selectedFiles.length;i++){
-                var fileUrl = selectedFiles[i]
-                var fileName = FluTools.getFileNameByUrl(fileUrl)
-                var filePath = FluTools.toLocalPath(fileUrl)
-                params[fileName] = filePath
-            }
-            request.params = params
-            http.upload(request,callable_upload)
-        }
-    }
-
-    HttpCallable{
-        id:callable_download
-        onStart: {
-            btn_download.progress = 0
-            btn_download.disabled = true
-        }
-        onFinish: {
-            btn_download.disabled = false
-        }
-        onError:
-            (status,errorString,result)=>{
-                btn_download.progress = 0
-                showError(errorString)
-                console.debug(status+";"+errorString+";"+result)
-            }
-        onSuccess:
-            (result)=>{
-                showSuccess(result)
-            }
-        onDownloadProgress:
-            (recv,total)=>{
-                btn_download.progress = recv/total
-            }
-    }
-    FolderDialog {
-        id: folder_dialog
-        currentFolder: StandardPaths.standardLocations(StandardPaths.DownloadLocation)[0]
-        onAccepted: {
-            var request = http.newRequest("http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4")
-            request.downloadSavePath = FluTools.toLocalPath(currentFolder)+ "/big_buck_bunny.mp4"
-            http.download(request,callable_download)
-        }
-    }
-    FluArea{
-        anchors{
-            top: layout_flick.top
-            bottom: layout_flick.bottom
-            left: layout_flick.right
-            right: parent.right
-            leftMargin: 8
-        }
-        Flickable{
-            clip: true
-            id:scrollview
-            boundsBehavior:Flickable.StopAtBounds
-            width: parent.width
-            height: parent.height
-            contentWidth: width
-            contentHeight: text_info.height
-            ScrollBar.vertical: FluScrollBar {}
-            FluText{
-                id:text_info
-                width: scrollview.width
-                wrapMode: Text.WrapAnywhere
-                padding: 14
-            }
-        }
-    }
-}

example/qml-Qt6/page/T_Network.qml

@@ -0,0 +1,560 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Window
+import QtQuick.Controls
+import FluentUI
+import Qt.labs.platform
+import "qrc:///example/qml/component"
+
+FluContentPage{
+
+    id:root
+    title:"Network"
+
+    FluNetworkCallable{
+        id:callable
+        onStart: {
+            showLoading()
+        }
+        onFinish: {
+            hideLoading()
+        }
+        onError:
+            (status,errorString,result)=>{
+                console.debug(status+";"+errorString+";"+result)
+            }
+        onCache:
+            (result)=>{
+                text_info.text = result
+            }
+        onSuccess:
+            (result)=>{
+                text_info.text = result
+            }
+    }
+
+    Flickable{
+        id:layout_flick
+        width: 200
+        clip: true
+        anchors{
+            top: parent.top
+            topMargin: 20
+            bottom: parent.bottom
+            left: parent.left
+        }
+        boundsBehavior: Flickable.StopAtBounds
+        ScrollBar.vertical: FluScrollBar {}
+        contentHeight:layout_column.height
+        Column{
+            spacing: 2
+            id:layout_column
+            width: parent.width
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Get"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.get("https://httpbingo.org/get")
+                    .addQuery("name","孙悟空")
+                    .addQuery("age",500)
+                    .addQuery("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Head"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.head("https://httpbingo.org/head")
+                    .addQuery("name","孙悟空")
+                    .addQuery("age",500)
+                    .addQuery("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Post Body"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postBody("https://httpbingo.org/post")
+                    .setBody("花果山水帘洞美猴王齐天大圣孙悟空")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Post Form"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postForm("https://httpbingo.org/post")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Post JSON"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Post JSON Array"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJsonArray("https://httpbingo.org/post")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Put Body"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.putBody("https://httpbingo.org/put")
+                    .setBody("花果山水帘洞美猴王齐天大圣孙悟空")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Put Form"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.putForm("https://httpbingo.org/put")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Put JSON"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.putJson("https://httpbingo.org/put")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Put JSON Array"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.putJsonArray("https://httpbingo.org/put")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Patch Body"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.patchBody("https://httpbingo.org/patch")
+                    .setBody("花果山水帘洞美猴王齐天大圣孙悟空")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Patch Form"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.patchForm("https://httpbingo.org/patch")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Patch JSON"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.patchJson("https://httpbingo.org/patch")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Patch JSON Array"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.patchJsonArray("https://httpbingo.org/patch")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Delete Body"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.deleteBody("https://httpbingo.org/delete")
+                    .setBody("花果山水帘洞美猴王齐天大圣孙悟空")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Delete Form"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.deleteForm("https://httpbingo.org/delete")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Delete JSON"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.deleteJson("https://httpbingo.org/delete")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Delete JSON Array"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.deleteJsonArray("https://httpbingo.org/delete")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Open Log"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .openLog(true)
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Custom Header"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .addHeader("os","PC")
+                    .addHeader("version","1.0.0")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "RequestFailedReadCache"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .setCacheMode(FluNetworkType.RequestFailedReadCache)
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .add("cacheMode","RequestFailedReadCache")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "IfNoneCacheRequest"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .setCacheMode(FluNetworkType.IfNoneCacheRequest)
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .add("cacheMode","IfNoneCacheRequest")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "FirstCacheThenRequest"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .setCacheMode(FluNetworkType.FirstCacheThenRequest)
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .add("cacheMode","FirstCacheThenRequest")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Timeout And Retry"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .setTimeout(5000)
+                    .setRetry(3)
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .add("timeout","5000")
+                    .add("retry","3")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluProgressButton{
+                id:btn_upload
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Upload File"
+                onClicked: {
+                    file_dialog.open()
+                }
+            }
+            FluProgressButton{
+                id:btn_download
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Download File"
+                onClicked: {
+                    folder_dialog.showDialog(function(path){
+                        FluNetwork.get("http://vjs.zencdn.net/v/oceans.mp4")
+                        .toDownload(path)
+                        .bind(root)
+                        .go(callable_download_file)
+                    })
+                }
+            }
+            FluProgressButton{
+                id:btn_download_breakpoint
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Breakpoint Download File"
+                onClicked: {
+                    folder_dialog.showDialog(function(path){
+                        FluNetwork.get("http://vjs.zencdn.net/v/oceans.mp4")
+                        .toDownload(path,true)
+                        .bind(root)
+                        .go(callable_breakpoint_download_file)
+                    })
+                }
+            }
+        }
+    }
+
+    FluNetworkCallable{
+        id:callable_upload_file
+        onStart: {
+            btn_upload.disabled = true
+        }
+        onFinish: {
+            btn_upload.disabled = false
+        }
+        onError:
+            (status,errorString,result)=>{
+                btn_upload.progress = 0
+                text_info.text = result
+                console.debug(status+";"+errorString+";"+result)
+            }
+        onSuccess:
+            (result)=>{
+                text_info.text = result
+            }
+        onUploadProgress:
+            (sent,total)=>{
+                btn_upload.progress = sent/total
+            }
+    }
+
+    FluNetworkCallable{
+        id:callable_download_file
+        onStart: {
+            btn_download.progress = 0
+            btn_download.disabled = true
+        }
+        onFinish: {
+            btn_download.disabled = false
+        }
+        onError:
+            (status,errorString,result)=>{
+                btn_download.progress = 0
+                showError(errorString)
+                console.debug(status+";"+errorString+";"+result)
+            }
+        onSuccess:
+            (result)=>{
+                showSuccess(result)
+            }
+        onDownloadProgress:
+            (recv,total)=>{
+                btn_download.progress = recv/total
+            }
+    }
+
+    FluNetworkCallable{
+        id:callable_breakpoint_download_file
+        onStart: {
+            btn_download_breakpoint.progress = 0
+            btn_download_breakpoint.disabled = true
+        }
+        onFinish: {
+            btn_download_breakpoint.disabled = false
+        }
+        onError:
+            (status,errorString,result)=>{
+                btn_download_breakpoint.progress = 0
+                showError(errorString)
+                console.debug(status+";"+errorString+";"+result)
+            }
+        onSuccess:
+            (result)=>{
+                showSuccess(result)
+            }
+        onDownloadProgress:
+            (recv,total)=>{
+                btn_download_breakpoint.progress = recv/total
+            }
+    }
+
+    FileDialog {
+        id: file_dialog
+        onAccepted: {
+            FluNetwork.postForm("https://httpbingo.org/post")
+            .setRetry(1)//只请求一次
+            .add("accessToken","12345678")
+            .addFile("file",FluTools.toLocalPath(file_dialog.currentFile))
+            .bind(root)
+            .go(callable_upload_file)
+        }
+    }
+
+    FileDialog {
+        property var onSelectListener
+        id: folder_dialog
+        folder: StandardPaths.standardLocations(StandardPaths.DownloadLocation)[0]
+        currentFile: StandardPaths.standardLocations(StandardPaths.DownloadLocation)[0]+"/oceans.mp4"
+        fileMode: FileDialog.SaveFile
+        onAccepted: {
+            folder_dialog.onSelectListener(FluTools.toLocalPath(folder_dialog.currentFile))
+        }
+        function showDialog(listener){
+            folder_dialog.onSelectListener = listener
+            folder_dialog.open()
+        }
+    }
+
+    FluArea{
+        anchors{
+            top: layout_flick.top
+            bottom: layout_flick.bottom
+            left: layout_flick.right
+            right: parent.right
+            leftMargin: 8
+        }
+        Flickable{
+            clip: true
+            id:scrollview
+            boundsBehavior:Flickable.StopAtBounds
+            width: parent.width
+            height: parent.height
+            contentWidth: width
+            contentHeight: text_info.height
+            ScrollBar.vertical: FluScrollBar {}
+            FluText{
+                id:text_info
+                width: scrollview.width
+                wrapMode: Text.WrapAnywhere
+                padding: 14
+            }
+        }
+    }
+}

example/qml-Qt6/page/T_QRCode.qml

@@ -31,6 +31,7 @@ FluScrollablePage{
         FluTextBox{
             id:text_box
             text:"会磨刀的小猪"
+            Layout.preferredWidth: 240
         }
     }
 

example/qml-Qt6/page/T_Settings.qml

@@ -62,33 +62,27 @@ FluScrollablePage{
         height: 50
         paddings: 10
         FluCheckBox{
-            text:"V-Sync"
-            checked: FluApp.vsync
+            text:"Use System AppBar"
+            checked: FluApp.useSystemAppBar
             anchors.verticalCenter: parent.verticalCenter
             onClicked: {
-                FluApp.vsync = !FluApp.vsync
+                FluApp.useSystemAppBar = !FluApp.useSystemAppBar
                 dialog_restart.open()
             }
         }
     }
 
-
     FluArea{
         Layout.fillWidth: true
         Layout.topMargin: 20
         height: 50
         paddings: 10
         FluCheckBox{
-            text:"Software Render"
-            checked: SettingsHelper.getRender() === "software"
+            text:"fitsAppBarWindows"
+            checked: window.fitsAppBarWindows
             anchors.verticalCenter: parent.verticalCenter
             onClicked: {
-                if(SettingsHelper.getRender() === "software"){
-                    SettingsHelper.saveRender("")
-                }else{
-                    SettingsHelper.saveRender("software")
-                }
-                dialog_restart.open()
+                window.fitsAppBarWindows = !window.fitsAppBarWindows
             }
         }
     }
@@ -199,5 +193,4 @@ FluScrollablePage{
             }
         }
     }
-
 }

example/qml-Qt6/page/T_ShortcutPicker.qml

@@ -0,0 +1,30 @@
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import QtQuick.Window
+import FluentUI
+import "qrc:///example/qml/component"
+
+FluScrollablePage{
+
+    title:"ShortcutPicker"
+
+    FluArea{
+        Layout.fillWidth: true
+        Layout.topMargin: 20
+        height: 100
+        paddings: 10
+        FluShortcutPicker{
+            anchors.verticalCenter: parent.verticalCenter
+        }
+    }
+    CodeExpander{
+        Layout.fillWidth: true
+        Layout.topMargin: -1
+        code:'FluShortcutPicker{
+
+}'
+    }
+
+}
+

example/qml-Qt6/page/T_TabView.qml

@@ -67,10 +67,10 @@ FluScrollablePage{
                 text:"Always"
                 Layout.preferredWidth: 120
                 FluMenuItem{
-                    text:"Nerver"
+                    text:"Never"
                     onClicked: {
                         btn_close_button_visibility.text = text
-                        tab_view.closeButtonVisibility = FluTabViewType.Nerver
+                        tab_view.closeButtonVisibility = FluTabViewType.Never
                     }
                 }
                 FluMenuItem{

example/qml-Qt6/page/T_TableView.qml

@@ -29,6 +29,43 @@ FluContentPage{
         }
     }
 
+    FluContentDialog{
+        id:custom_update_dialog
+        signal showDialog(string text,var callback)
+        property var _textBox
+        property var onAccpetListener
+        title:"修改列名"
+        negativeText:"取消"
+        contentDelegate: Component{
+            Item{
+                width: parent.width
+                height: 60
+                FluTextBox{
+                    id:textbox_text
+                    anchors.centerIn: parent
+                }
+                Connections{
+                    target: custom_update_dialog
+                    function onShowDialog(text,callback){
+                        custom_update_dialog._textBox = textbox_text
+                        custom_update_dialog.onAccpetListener = callback
+                        textbox_text.text = text
+                        textbox_text.forceActiveFocus()
+                        custom_update_dialog.open()
+                    }
+                }
+            }
+        }
+        onNegativeClicked:{
+        }
+        positiveText:"确定"
+        onPositiveClicked:{
+            if(custom_update_dialog.onAccpetListener && custom_update_dialog._textBox){
+                custom_update_dialog.onAccpetListener(custom_update_dialog._textBox.text)
+            }
+        }
+    }
+
     Component{
         id:com_checbox
         Item{
@@ -158,6 +195,34 @@ FluContentPage{
         }
     }
 
+    Component{
+        id:com_column_update_title
+        Item{
+            FluText{
+                id:text_title
+                text: {
+                    if(options.title){
+                        return options.title
+                    }
+                    return ""
+                }
+                anchors.fill: parent
+                verticalAlignment: Qt.AlignVCenter
+                horizontalAlignment: Qt.AlignHCenter
+                elide: Text.ElideRight
+            }
+            MouseArea{
+                anchors.fill: parent
+                cursorShape: Qt.PointingHandCursor
+                onClicked: {
+                    custom_update_dialog.showDialog(options.title,function(text){
+                        itemModel.display = table_view.customItem(com_column_update_title,{"title":text})
+                    })
+                }
+            }
+        }
+    }
+
     Component{
         id:com_column_sort_age
         Item{
@@ -236,7 +301,7 @@ FluContentPage{
                 maximumWidth:80,
             },
             {
-                title: '头像',
+                title: table_view.customItem(com_column_update_title,{title:'头像'}),
                 dataIndex: 'avatar',
                 width:100,
                 minimumWidth:100,

example/qml-Qt6/page/T_Timeline.qml

@@ -110,6 +110,7 @@ FluScrollablePage{
         FluTextBox{
             id:text_box
             text:"Technical testing 2015-09-01"
+            Layout.preferredWidth: 240
         }
         FluFilledButton{
             text:"Append"

example/qml-Qt6/page/T_Watermark.qml

@@ -29,6 +29,7 @@ FluContentPage{
                 FluTextBox{
                     id:text_box
                     text:"会磨刀的小猪"
+                    Layout.preferredWidth: 240
                 }
             }
 

example/qml-Qt6/window/AboutWindow.qml

@@ -9,7 +9,7 @@ FluWindow {
     id:window
     title:"关于"
     width: 600
-    height: 600
+    height: 580
     fixSize: true
     launchMode: FluWindowType.SingleTask
 

example/qml-Qt6/window/CrashWindow.qml

@@ -0,0 +1,72 @@
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import FluentUI
+import Qt.labs.platform
+import "qrc:///example/qml/component"
+
+FluWindow {
+
+    id:window
+    title:"友情提示"
+    width: 300
+    height: 400
+    fixSize: true
+    showMinimize: false
+    showStayTop: false
+
+    property string crashFilePath
+
+    onInitArgument:
+        (argument)=>{
+            crashFilePath = argument.crashFilePath
+        }
+
+    Image{
+        width: 540/2
+        height: 285/2
+        anchors{
+            horizontalCenter: parent.horizontalCenter
+            top: parent.top
+            topMargin: 40
+        }
+        source: "qrc:/example/res/image/ic_crash.png"
+    }
+
+    FluText{
+        id:text_info
+        anchors{
+            horizontalCenter: parent.horizontalCenter
+            top: parent.top
+            topMargin: 240
+        }
+        text:"发生意外错误\n给您带来的不便，我们深表歉意"
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+    }
+
+    RowLayout{
+        anchors{
+            horizontalCenter: parent.horizontalCenter
+            bottom: parent.bottom
+            bottomMargin: 20
+        }
+        FluButton{
+            text:"日志上报"
+            onClicked: {
+                FluTools.showFileInFolder(crashFilePath)
+            }
+        }
+        Item{
+            width: 30
+            height: 1
+        }
+        FluFilledButton{
+            text:"重启程序"
+            onClicked: {
+                FluApp.exit(931)
+            }
+        }
+    }
+
+}

example/qml-Qt6/window/MainWindow.qml

@@ -13,12 +13,20 @@ FluWindow {
 
     id:window
     title: "FluentUI"
-    width: 1000
-    height: 640
+    width: 960
+    height: 600
     minimumWidth: 520
     minimumHeight: 200
     launchMode: FluWindowType.SingleTask
-    appBar: undefined
+    fitsAppBarWindows: true
+    appBar: FluAppBar {
+        height: 30
+        darkText: Lang.dark_mode
+        showDark: true
+        darkClickListener:(button)=>handleDarkChanged(button)
+        closeClickListener: ()=>{dialog_close.open()}
+        z:7
+    }
 
     SettingsViewModel{
         id:viewmodel_settings
@@ -32,8 +40,19 @@ FluWindow {
         }
     }
 
+    onFirstVisible: {
+        timer_tour_delay.restart()
+    }
+
+    Timer{
+        id:timer_tour_delay
+        interval: 200
+        onTriggered: {
+            tour.open()
+        }
+    }
+
     Component.onCompleted: {
-        tour.open()
         checkUpdate(true)
         FluEventBus.registerEvent(event_checkupdate)
     }
@@ -65,15 +84,23 @@ FluWindow {
             }
     }
 
+    Timer{
+        id:timer_window_hide_delay
+        interval: 150
+        onTriggered: {
+            window.hide()
+        }
+    }
+
     FluContentDialog{
         id:dialog_close
         title:"退出"
         message:"确定要退出程序吗？"
         negativeText:"最小化"
         buttonFlags: FluContentDialogType.NegativeButton | FluContentDialogType.NeutralButton | FluContentDialogType.PositiveButton
-        onNegativeClicked:{
-            window.hide()
+        onNegativeClicked: {
             system_tray.showMessage("友情提示","FluentUI已隐藏至托盘,点击托盘可再次激活窗口");
+            timer_window_hide_delay.restart()
         }
         positiveText:"退出"
         neutralText:"取消"
@@ -120,19 +147,8 @@ FluWindow {
         back: Item{
             anchors.fill: flipable
             visible: flipable.flipAngle !== 0
-            FluAppBar {
-                anchors {
-                    top: parent.top
-                    left: parent.left
-                    right: parent.right
-                }
-                darkText: Lang.dark_mode
-                showDark: true
-                z:7
-                darkClickListener:(button)=>handleDarkChanged(button)
-                closeClickListener: ()=>{dialog_close.open()}
-            }
             Row{
+                id:layout_back_buttons
                 z:8
                 anchors{
                     top: parent.top
@@ -163,26 +179,13 @@ FluWindow {
                 id:loader
                 lazy: true
                 anchors.fill: parent
-                source: "https://zhu-zichu.gitee.io/Qt5_156_LieflatPage.qml"
+                source: "https://zhu-zichu.gitee.io/Qt_163_LieflatPage.qml"
             }
         }
         front: Item{
             id:page_front
             visible: flipable.flipAngle !== 180
             anchors.fill: flipable
-            FluAppBar {
-                id:app_bar_front
-                anchors {
-                    top: parent.top
-                    left: parent.left
-                    right: parent.right
-                }
-                darkText: Lang.dark_mode
-                showDark: true
-                darkClickListener:(button)=>handleDarkChanged(button)
-                closeClickListener: ()=>{dialog_close.open()}
-                z:7
-            }
             FluNavigationView{
                 property int clickCount: 0
                 id:nav_view
@@ -195,7 +198,12 @@ FluWindow {
                 pageMode: FluNavigationViewType.NoStack
                 items: ItemsOriginal
                 footerItems:ItemsFooter
-                topPadding:FluTools.isMacos() ? 20 : 0
+                topPadding:{
+                    if(window.useSystemAppBar){
+                        return 0
+                    }
+                    return FluTools.isMacos() ? 20 : 0
+                }
                 displayMode:viewmodel_settings.displayMode
                 logo: "qrc:/example/res/image/favicon.ico"
                 title:"FluentUI"
@@ -232,7 +240,7 @@ FluWindow {
         id:com_reveal
         CircularReveal{
             id:reveal
-            target:window.contentItem
+            target:window.layoutContainer()
             anchors.fill: parent
             onAnimationFinished:{
                 //动画结束后释放资源
@@ -254,11 +262,14 @@ FluWindow {
     }
 
     function handleDarkChanged(button){
-        if(!FluTheme.enableAnimation){
+        if(!FluTheme.enableAnimation || window.fitsAppBarWindows === false){
             changeDark()
         }else{
+            if(loader_reveal.sourceComponent){
+                return
+            }
             loader_reveal.sourceComponent = com_reveal
-            var target = window.contentItem
+            var target = window.layoutContainer()
             var pos = button.mapToItem(target,0,0)
             var mouseX = pos.x
             var mouseY = pos.y
@@ -296,14 +307,14 @@ FluWindow {
 
     FluTour{
         id:tour
-        steps:[
-            {title:"夜间模式",description: "这里可以切换夜间模式.",target:()=>app_bar_front.darkButton()},
-            {title:"隐藏彩蛋",description: "多点几下试试！！",target:()=>nav_view.logoButton()}
-        ]
-    }
-
-    FluHttp{
-        id:http
+        steps:{
+            var data = []
+            if(!window.useSystemAppBar){
+                data.push({title:"夜间模式",description: "这里可以切换夜间模式.",target:()=>appBar.darkButton()})
+            }
+            data.push({title:"隐藏彩蛋",description: "多点几下试试！！",target:()=>nav_view.logoButton()})
+            return data
+        }
     }
 
     FpsItem{
@@ -335,7 +346,7 @@ FluWindow {
         }
     }
 
-    HttpCallable{
+    FluNetworkCallable{
         id:callable
         property bool silent: true
         onStart: {
@@ -371,8 +382,8 @@ FluWindow {
 
     function checkUpdate(silent){
         callable.silent = silent
-        var request = http.newRequest("https://api.github.com/repos/zhuzichu520/FluentUI/releases/latest")
-        http.get(request,callable);
+        FluNetwork.get("https://api.github.com/repos/zhuzichu520/FluentUI/releases/latest")
+        .go(callable)
     }
 
 }

example/qml/App.qml

@@ -16,30 +16,19 @@ Item {
 
     Connections{
         target: FluApp
-        function onVsyncChanged(){
-            SettingsHelper.saveVsync(FluApp.vsync)
-        }
-    }
-
-    FluHttpInterceptor{
-        id:interceptor
-        function onIntercept(request){
-            if(request.method === "get"){
-                request.params["method"] = "get"
-            }
-            if(request.method === "post"){
-                request.params["method"] = "post"
-            }
-            request.headers["token"] ="yyds"
-            request.headers["os"] ="pc"
-            console.debug(JSON.stringify(request))
-            return request
+        function onUseSystemAppBarChanged(){
+            SettingsHelper.saveUseSystemAppBar(FluApp.useSystemAppBar)
         }
     }
 
     Component.onCompleted: {
+        FluNetwork.openLog = false
+        FluNetwork.setInterceptor(function(param){
+            param.addHeader("Token","000000000000000000000")
+        })
         FluApp.init(app)
-        FluApp.vsync = SettingsHelper.getVsync()
+        FluApp.windowIcon = "qrc:/example/res/image/favicon.ico"
+        FluApp.useSystemAppBar = SettingsHelper.getUseSystemAppBar()
         FluTheme.darkMode = SettingsHelper.getDarkMode()
         FluTheme.enableAnimation = true
         FluApp.routes = {
@@ -47,13 +36,17 @@ Item {
             "/about":"qrc:/example/qml/window/AboutWindow.qml",
             "/login":"qrc:/example/qml/window/LoginWindow.qml",
             "/hotload":"qrc:/example/qml/window/HotloadWindow.qml",
+            "/crash":"qrc:/example/qml/window/CrashWindow.qml",
             "/singleTaskWindow":"qrc:/example/qml/window/SingleTaskWindow.qml",
             "/standardWindow":"qrc:/example/qml/window/StandardWindow.qml",
             "/singleInstanceWindow":"qrc:/example/qml/window/SingleInstanceWindow.qml",
             "/pageWindow":"qrc:/example/qml/window/PageWindow.qml"
         }
-        FluApp.initialRoute = "/"
-        FluApp.httpInterceptor = interceptor
-        FluApp.run()
+        var args = Qt.application.arguments
+        if(args.length>=2 && args[1].startsWith("-crashed=")){
+            FluApp.navigate("/crash",{crashFilePath:args[1].replace("-crashed=","")})
+        }else{
+            FluApp.navigate("/")
+        }
     }
 }

example/qml/chart/T_BarChart.qml

@@ -0,0 +1,133 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import FluentUI 1.0
+import "qrc:///example/qml/component"
+import "../component"
+
+FluScrollablePage{
+
+    title:"Bar Chart"
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'bar'
+            chartData: { return {
+                    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [65, 59, 80, 81, 56, 55, 40],
+                            backgroundColor: [
+                                'rgba(255, 99, 132, 0.2)',
+                                'rgba(255, 159, 64, 0.2)',
+                                'rgba(255, 205, 86, 0.2)',
+                                'rgba(75, 192, 192, 0.2)',
+                                'rgba(54, 162, 235, 0.2)',
+                                'rgba(153, 102, 255, 0.2)',
+                                'rgba(201, 203, 207, 0.2)'
+                            ],
+                            borderColor: [
+                                'rgb(255, 99, 132)',
+                                'rgb(255, 159, 64)',
+                                'rgb(255, 205, 86)',
+                                'rgb(75, 192, 192)',
+                                'rgb(54, 162, 235)',
+                                'rgb(153, 102, 255)',
+                                'rgb(201, 203, 207)'
+                            ],
+                            borderWidth: 1
+                        }]
+                }
+            }
+
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Bar Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    },
+                    responsive: true,
+                    scales: {
+                        xAxes: [{
+                                stacked: true,
+                            }],
+                        yAxes: [{
+                                stacked: true
+                            }]
+                    }
+                }
+            }
+        }
+    }
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'horizontalBar'
+            chartData: { return {
+                    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [65, 59, 80, 81, 56, 55, 40],
+                            backgroundColor: [
+                                'rgba(255, 99, 132, 0.2)',
+                                'rgba(255, 159, 64, 0.2)',
+                                'rgba(255, 205, 86, 0.2)',
+                                'rgba(75, 192, 192, 0.2)',
+                                'rgba(54, 162, 235, 0.2)',
+                                'rgba(153, 102, 255, 0.2)',
+                                'rgba(201, 203, 207, 0.2)'
+                            ],
+                            borderColor: [
+                                'rgb(255, 99, 132)',
+                                'rgb(255, 159, 64)',
+                                'rgb(255, 205, 86)',
+                                'rgb(75, 192, 192)',
+                                'rgb(54, 162, 235)',
+                                'rgb(153, 102, 255)',
+                                'rgb(201, 203, 207)'
+                            ],
+                            borderWidth: 1
+                        }]
+                }
+            }
+
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js HorizontalBar Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    },
+                    responsive: true,
+                    scales: {
+                        xAxes: [{
+                                stacked: true,
+                            }],
+                        yAxes: [{
+                                stacked: true
+                            }]
+                    }
+                }
+            }
+        }
+    }
+
+}

example/qml/chart/T_BubbleChart.qml

@@ -0,0 +1,75 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import FluentUI 1.0
+import "qrc:///example/qml/component"
+import "../component"
+
+FluScrollablePage{
+
+    title:"Bubble Chart"
+
+    function randomScalingFactor() {
+        return Math.random().toFixed(1);
+    }
+
+    FluArea{
+        height: 370
+        width: 500
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'bubble'
+            chartData: {
+                return {
+                    datasets: [{
+                            label: 'First Dataset',
+                            data: [{
+                                    x: 20,
+                                    y: 30,
+                                    r: 15
+                                }, {
+                                    x: 12,
+                                    y: 70,
+                                    r: 20
+                                }, {
+                                    x: 11,
+                                    y: 28,
+                                    r: 8
+                                }, {
+                                    x: 9,
+                                    y: 28,
+                                    r: 10
+                                }, {
+                                    x: 43,
+                                    y: 7,
+                                    r: 14
+                                }, {
+                                    x: 22,
+                                    y: 22,
+                                    r: 12
+                                }, {
+                                    x: 40,
+                                    y: 10,
+                                    r: 10
+                                }],
+                            backgroundColor: 'rgb(255, 99, 132)'
+                        }]
+                }}
+            chartOptions: {return {
+                    maintainAspectRatio: false,
+                    responsive: true,
+                    hoverMode: 'nearest',
+                    intersect: true,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Bubble Chart - Multi Axis'
+                    }
+                }
+            }
+        }
+    }
+
+}

example/qml/chart/T_LineChart.qml

@@ -0,0 +1,46 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import FluentUI 1.0
+import "qrc:///example/qml/component"
+import "../component"
+
+FluScrollablePage{
+
+    title:"Line Chart"
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'line'
+            chartData: { return {
+                    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [65, 59, 80, 81, 56, 55, 40],
+                            fill: false,
+                            borderColor: 'rgb(75, 192, 192)',
+                            tension: 0.1
+                        }]
+                }
+            }
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Line Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    }
+                }
+            }
+        }
+    }
+}

example/qml/chart/T_PieChart.qml

@@ -0,0 +1,94 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import FluentUI 1.0
+import "qrc:///example/qml/component"
+import "../component"
+
+FluScrollablePage{
+
+    title:"Doughnut and Pie Chart"
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: "doughnut"
+            chartData: { return {
+                    labels: [
+                        'Red',
+                        'Blue',
+                        'Yellow'
+                    ],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [300, 50, 100],
+                            backgroundColor: [
+                                'rgb(255, 99, 132)',
+                                'rgb(54, 162, 235)',
+                                'rgb(255, 205, 86)'
+                            ],
+                            hoverOffset: 4
+                        }]
+                }
+            }
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Doughnut Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    }
+                }
+            }
+        }
+    }
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: "pie"
+            chartData: { return {
+                    labels: [
+                        'Red',
+                        'Blue',
+                        'Yellow'
+                    ],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [300, 50, 100],
+                            backgroundColor: [
+                                'rgb(255, 99, 132)',
+                                'rgb(54, 162, 235)',
+                                'rgb(255, 205, 86)'
+                            ],
+                            hoverOffset: 4
+                        }]
+                }
+            }
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Pie Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    }
+                }
+            }
+        }
+    }
+}

example/qml/chart/T_PolarAreaChart.qml

@@ -0,0 +1,58 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import FluentUI 1.0
+import "qrc:///example/qml/component"
+import "../component"
+
+FluScrollablePage{
+
+    title:"PolarArea Chart"
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'polarArea'
+            chartData: { return {
+                    labels: [
+                        'Red',
+                        'Green',
+                        'Yellow',
+                        'Grey',
+                        'Blue'
+                    ],
+                    datasets: [{
+                            label: 'My First Dataset',
+                            data: [11, 16, 7, 3, 14],
+                            backgroundColor: [
+                                'rgb(255, 99, 132)',
+                                'rgb(75, 192, 192)',
+                                'rgb(255, 205, 86)',
+                                'rgb(201, 203, 207)',
+                                'rgb(54, 162, 235)'
+                            ]
+                        }]
+                }
+            }
+
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js PolarArea Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    }
+                }
+            }
+        }
+    }
+
+}

example/qml/chart/T_RadarChart.qml

@@ -0,0 +1,75 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import FluentUI 1.0
+import "qrc:///example/qml/component"
+import "../component"
+
+FluScrollablePage{
+
+    title:"Radar Chart"
+
+    FluArea{
+        width: 500
+        height: 370
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'radar'
+            chartData: { return {
+                    labels: [
+                        'Eating',
+                        'Drinking',
+                        'Sleeping',
+                        'Designing',
+                        'Coding',
+                        'Cycling',
+                        'Running'
+                    ],
+                    datasets:
+                        [{
+                            label: 'My First Dataset',
+                            data: [65, 59, 90, 81, 56, 55, 40],
+                            fill: true,
+                            backgroundColor: 'rgba(255, 99, 132, 0.2)',
+                            borderColor: 'rgb(255, 99, 132)',
+                            pointBackgroundColor: 'rgb(255, 99, 132)',
+                            pointBorderColor: '#fff',
+                            pointHoverBackgroundColor: '#fff',
+                            pointHoverBorderColor: 'rgb(255, 99, 132)'
+                        }, {
+                            label: 'My Second Dataset',
+                            data: [28, 48, 40, 19, 96, 27, 100],
+                            fill: true,
+                            backgroundColor: 'rgba(54, 162, 235, 0.2)',
+                            borderColor: 'rgb(54, 162, 235)',
+                            pointBackgroundColor: 'rgb(54, 162, 235)',
+                            pointBorderColor: '#fff',
+                            pointHoverBackgroundColor: '#fff',
+                            pointHoverBorderColor: 'rgb(54, 162, 235)'
+                        }]
+                }
+            }
+            chartOptions: { return {
+                    maintainAspectRatio: false,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Radar Chart - Stacked'
+                    },
+                    tooltips: {
+                        mode: 'index',
+                        intersect: false
+                    },
+                    elements: {
+                        line: {
+                            borderWidth: 3
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+}

example/qml/chart/T_ScatterChart.qml

@@ -0,0 +1,124 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import FluentUI 1.0
+import "qrc:///example/qml/component"
+import "../component"
+
+FluScrollablePage{
+
+    title:"Scatter Chart"
+
+    function randomScalingFactor() {
+        return Math.random().toFixed(1);
+    }
+
+    FluArea{
+        height: 370
+        width: 500
+        paddings: 10
+        Layout.topMargin: 20
+        FluChart{
+            anchors.fill: parent
+            chartType: 'scatter'
+            chartData: {
+                return {
+                    datasets: [{
+                            label: 'My First dataset',
+                            xAxisID: 'x-axis-1',
+                            yAxisID: 'y-axis-1',
+                            borderColor: '#ff5555',
+                            backgroundColor: 'rgba(255,192,192,0.3)',
+                            data: [{
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }]
+                        }, {
+                            label: 'My Second dataset',
+                            xAxisID: 'x-axis-1',
+                            yAxisID: 'y-axis-2',
+                            borderColor: '#5555ff',
+                            backgroundColor: 'rgba(192,192,255,0.3)',
+                            data: [{
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }, {
+                                    x: randomScalingFactor(),
+                                    y: randomScalingFactor(),
+                                }]
+                        }]
+                }}
+            chartOptions: {return {
+                    maintainAspectRatio: false,
+                    responsive: true,
+                    hoverMode: 'nearest',
+                    intersect: true,
+                    title: {
+                        display: true,
+                        text: 'Chart.js Scatter Chart - Multi Axis'
+                    },
+                    scales: {
+                        xAxes: [{
+                                position: 'bottom',
+                                gridLines: {
+                                    zeroLineColor: 'rgba(0,0,0,1)'
+                                }
+                            }],
+                        yAxes: [{
+                                type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
+                                display: true,
+                                position: 'left',
+                                id: 'y-axis-1',
+                            }, {
+                                type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
+                                display: true,
+                                position: 'right',
+                                reverse: true,
+                                id: 'y-axis-2',
+
+                                // grid line settings
+                                gridLines: {
+                                    drawOnChartArea: false, // only want the grid lines for one axis to show up
+                                },
+                            }],
+                    }
+                }
+            }
+        }
+    }
+
+}

example/qml/component/CodeExpander.qml

@@ -130,7 +130,6 @@ FluExpander{
                     "FluRadioButtons",
                     "FluImage",
                     "FluSpinBox",
-                    "FluHttp",
                     "FluWatermark",
                     "FluTour",
                     "FluQRCode",
@@ -140,7 +139,9 @@ FluExpander{
                     "FluStaggeredView",
                     "FluProgressButton",
                     "FluLoadingButton",
-                    "FluClip"
+                    "FluClip",
+                    "FluNetwork",
+                    "FluShortcutPicker"
                 ];
         code = code.replace(/\n/g, "<br>");
         code = code.replace(/ /g, "&nbsp;");

example/qml/global/ItemsOriginal.qml

@@ -50,9 +50,7 @@ FluObject{
             }
             title:"Buttons"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/Button.png"
-            recentlyUpdated:true
-            desc:"A control that responds to user input and raisesa Click event."
+            extra:({image:"qrc:/example/res/image/control/Button.png",recentlyUpdated:true,desc:"A control that responds to user input and raisesa Click event."})
             url:"qrc:/example/qml/page/T_Buttons.qml"
             onTap:{
                 item_buttons.count = 0
@@ -83,18 +81,14 @@ FluObject{
         FluPaneItem{
             title:"Slider"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/Slider.png"
-            recentlyUpdated:true
-            desc:"A control that lets the user select from a rangeof values by moving a Thumb control along atrack."
+            extra:({image:"qrc:/example/res/image/control/Slider.png",recentlyUpdated:true,desc:"A control that lets the user select from a rangeof values by moving a Thumb control along atrack."})
             url:"qrc:/example/qml/page/T_Slider.qml"
             onTap:{ navigationView.push(url) }
         }
         FluPaneItem{
             title:"CheckBox"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/Checkbox.png"
-            recentlyUpdated:true
-            desc:"A control that a user can select or clear."
+            extra:({image:"qrc:/example/res/image/control/Checkbox.png",recentlyUpdated:true,desc:"A control that a user can select or clear."})
             url:"qrc:/example/qml/page/T_CheckBox.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -150,6 +144,12 @@ FluObject{
             url:"qrc:/example/qml/page/T_ColorPicker.qml"
             onTap:{ navigationView.push(url) }
         }
+        FluPaneItem{
+            title:"ShortcutPicker"
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/page/T_ShortcutPicker.qml"
+            onTap:{ navigationView.push(url) }
+        }
     }
 
     FluPaneItemExpander{
@@ -158,9 +158,7 @@ FluObject{
         FluPaneItem{
             title:"InfoBar"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/InfoBar.png"
-            recentlyUpdated:true
-            desc:"An inline message to display app-wide statuschange information."
+            extra:({image:"qrc:/example/res/image/control/InfoBar.png",recentlyUpdated:true,desc:"An inline message to display app-wide statuschange information."})
             url:"qrc:/example/qml/page/T_InfoBar.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -270,10 +268,7 @@ FluObject{
         FluPaneItem{
             title:"Pivot"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/Pivot.png"
-            recentlyAdded:true
-            order:3
-            desc:"Presents information from different sources in atabbed view."
+            extra:({image:"qrc:/example/res/image/control/Pivot.png",order:3,recentlyAdded:true,desc:"Presents information from different sources in atabbed view."})
             url:"qrc:/example/qml/page/T_Pivot.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -286,10 +281,7 @@ FluObject{
         FluPaneItem{
             title:"TabView"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/TabView.png"
-            recentlyAdded:true
-            order:1
-            desc:"A control that displays a collection of tabs thatcan be used to display several documents."
+            extra:({image:"qrc:/example/res/image/control/TabView.png",order:1,recentlyAdded:true,desc:"A control that displays a collection of tabs thatcan be used to display several documents."})
             url:"qrc:/example/qml/page/T_TabView.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -302,10 +294,7 @@ FluObject{
         FluPaneItem{
             title:"TableView"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/DataGrid.png"
-            recentlyAdded:true
-            order:4
-            desc:"The TableView control provides a flexible way to display a collection of data in rows and columns"
+            extra:({image:"qrc:/example/res/image/control/DataGrid.png",order:4,recentlyAdded:true,desc:"The TableView control provides a flexible way to display a collection of data in rows and columns"})
             url:"qrc:/example/qml/page/T_TableView.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -324,10 +313,7 @@ FluObject{
         FluPaneItem{
             title:"FlipView"
             menuDelegate: paneItemMenu
-            image:"qrc:/example/res/image/control/FlipView.png"
-            recentlyAdded:true
-            order:2
-            desc:"Presents a collection of items that the user canflip through, one item at a time."
+            extra:({image:"qrc:/example/res/image/control/FlipView.png",order:2,recentlyAdded:true,desc:"Presents a collection of items that the user canflip through, one item at a time."})
             url:"qrc:/example/qml/page/T_FlipView.qml"
             onTap:{ navigationView.push(url) }
         }
@@ -362,6 +348,53 @@ FluObject{
         }
     }
 
+    FluPaneItemExpander{
+        title: Lang.chart
+        icon:FluentIcons.AreaChart
+        FluPaneItem{
+            title:Lang.bar_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_BarChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.line_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_LineChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.pie_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_PieChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.polar_area_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_PolarAreaChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.bubble_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_BubbleChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.scatter_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_ScatterChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+        FluPaneItem{
+            title:Lang.radar_chart
+            menuDelegate: paneItemMenu
+            url:"qrc:/example/qml/chart/T_RadarChart.qml"
+            onTap:{ navigationView.push(url) }
+        }
+    }
+
     FluPaneItemSeparator{
         spacing:10
         size:1
@@ -401,15 +434,9 @@ FluObject{
             onTap:{ navigationView.push(url) }
         }
         FluPaneItem{
-            title:"Chart"
+            title:"Network"
             menuDelegate: paneItemMenu
-            url:"qrc:/example/qml/page/T_Chart.qml"
-            onTap:{ navigationView.push(url) }
-        }
-        FluPaneItem{
-            title:"Http"
-            menuDelegate: paneItemMenu
-            url:"qrc:/example/qml/page/T_Http.qml"
+            url:"qrc:/example/qml/page/T_Network.qml"
             onTap:{ navigationView.push(url) }
         }
         FluPaneItem{
@@ -439,25 +466,25 @@ FluObject{
             url:"qrc:/example/qml/page/T_3D.qml"
             onTap:{ navigationView.push(url) }
         }
+        FluPaneItem{
+            title:"Test Crash"
+            visible: FluTools.isWin()
+            onTapListener: function(){
+                AppInfo.testCrash()
+            }
+        }
     }
 
     function getRecentlyAddedData(){
         var arr = []
-        for(var i=0;i<children.length;i++){
-            var item = children[i]
-            if(item instanceof FluPaneItem && item.recentlyAdded){
+        var items = navigationView.getItems();
+        for(var i=0;i<items.length;i++){
+            var item = items[i]
+            if(item instanceof FluPaneItem && item.extra && item.extra.recentlyAdded){
                 arr.push(item)
             }
-            if(item instanceof FluPaneItemExpander){
-                for(var j=0;j<item.children.length;j++){
-                    var itemChild = item.children[j]
-                    if(itemChild instanceof FluPaneItem && itemChild.recentlyAdded){
-                        arr.push(itemChild)
-                    }
-                }
-            }
         }
-        arr.sort(function(o1,o2){ return o2.order-o1.order })
+        arr.sort(function(o1,o2){ return o2.extra.order-o1.extra.order })
         return arr
     }
 
@@ -466,7 +493,7 @@ FluObject{
         var items = navigationView.getItems();
         for(var i=0;i<items.length;i++){
             var item = items[i]
-            if(item instanceof FluPaneItem && item.recentlyUpdated){
+            if(item instanceof FluPaneItem && item.extra && item.extra.recentlyUpdated){
                 arr.push(item)
             }
         }

example/qml/global/Lang.qml

@@ -20,6 +20,14 @@ QtObject {
     property string locale
     property string navigation_view_display_mode
     property string other
+    property string chart
+    property string bar_chart
+    property string line_chart
+    property string pie_chart
+    property string polar_area_chart
+    property string bubble_chart
+    property string scatter_chart
+    property string radar_chart
 
     function zh(){
         home="首页"
@@ -38,6 +46,14 @@ QtObject {
         locale="语言环境"
         navigation_view_display_mode="导航视图显示模式"
         other="其他"
+        chart="表格"
+        bar_chart="条形图"
+        line_chart="折线图"
+        pie_chart="饼图"
+        polar_area_chart="极坐标区域图"
+        bubble_chart="气泡图"
+        scatter_chart="散点图"
+        radar_chart="雷达图"
     }
 
     function en(){
@@ -57,6 +73,14 @@ QtObject {
         locale="Locale"
         navigation_view_display_mode="NavigationView Display Mode"
         other="Other"
+        chart="Chart"
+        bar_chart="Bar Chart"
+        line_chart="Line Chart"
+        pie_chart="Pie Chart"
+        polar_area_chart="Polar Area Chart"
+        bubble_chart="Bubble Chart"
+        scatter_chart="Scatter Chart"
+        radar_chart="Radar Chart"
     }
 
     property string __locale

example/qml/page/T_Captcha.qml

@@ -44,6 +44,7 @@ FluScrollablePage{
         FluTextBox{
             id:text_box
             placeholderText: "请输入验证码"
+            Layout.preferredWidth: 240
         }
         FluButton{
             text:"verify"

example/qml/page/T_Chart.qml

@@ -1,332 +0,0 @@
-import QtQuick 2.15
-import QtQuick.Layouts 1.15
-import QtQuick.Window 2.15
-import QtQuick.Controls 2.15
-import FluentUI 1.0
-import "qrc:///example/qml/component"
-import "../component"
-
-FluScrollablePage{
-
-    title:"Chart"
-
-    function randomScalingFactor() {
-        return Math.random().toFixed(1);
-    }
-
-    FluArea{
-        height: 370
-        width: 500
-        paddings: 10
-        Layout.topMargin: 20
-        FluChart{
-            anchors.fill: parent
-            chartType: 'scatter'
-            chartData: {
-                return {
-                    datasets: [{
-                            label: 'My First dataset',
-                            xAxisID: 'x-axis-1',
-                            yAxisID: 'y-axis-1',
-                            borderColor: '#ff5555',
-                            backgroundColor: 'rgba(255,192,192,0.3)',
-                            data: [{
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }]
-                        }, {
-                            label: 'My Second dataset',
-                            xAxisID: 'x-axis-1',
-                            yAxisID: 'y-axis-2',
-                            borderColor: '#5555ff',
-                            backgroundColor: 'rgba(192,192,255,0.3)',
-                            data: [{
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }, {
-                                    x: randomScalingFactor(),
-                                    y: randomScalingFactor(),
-                                }]
-                        }]
-                }}
-            chartOptions: {return {
-                    maintainAspectRatio: false,
-                    responsive: true,
-                    hoverMode: 'nearest',
-                    intersect: true,
-                    title: {
-                        display: true,
-                        text: 'Chart.js Scatter Chart - Multi Axis'
-                    },
-                    scales: {
-                        xAxes: [{
-                                position: 'bottom',
-                                gridLines: {
-                                    zeroLineColor: 'rgba(0,0,0,1)'
-                                }
-                            }],
-                        yAxes: [{
-                                type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
-                                display: true,
-                                position: 'left',
-                                id: 'y-axis-1',
-                            }, {
-                                type: 'linear', // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
-                                display: true,
-                                position: 'right',
-                                reverse: true,
-                                id: 'y-axis-2',
-
-                                // grid line settings
-                                gridLines: {
-                                    drawOnChartArea: false, // only want the grid lines for one axis to show up
-                                },
-                            }],
-                    }
-                }
-            }
-        }
-    }
-
-    FluArea{
-        width: 500
-        height: 370
-        paddings: 10
-        Layout.topMargin: 20
-        FluChart{
-            anchors.fill: parent
-            chartType: 'bar'
-            chartData: { return {
-                    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
-                    datasets: [{
-                            label: 'Dataset 1',
-                            backgroundColor: '#ff9999',
-                            stack: 'Stack 0',
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ]
-                        }, {
-                            label: 'Dataset 2',
-                            backgroundColor: '#9999ff',
-                            stack: 'Stack 0',
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ]
-                        }, {
-                            label: 'Dataset 3',
-                            backgroundColor: '#99ff99',
-                            stack: 'Stack 1',
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ]
-                        }]
-                }
-            }
-
-            chartOptions: { return {
-                    maintainAspectRatio: false,
-                    title: {
-                        display: true,
-                        text: 'Chart.js Bar Chart - Stacked'
-                    },
-                    tooltips: {
-                        mode: 'index',
-                        intersect: false
-                    },
-                    responsive: true,
-                    scales: {
-                        xAxes: [{
-                                stacked: true,
-                            }],
-                        yAxes: [{
-                                stacked: true
-                            }]
-                    }
-                }
-            }
-        }
-    }
-
-    FluArea{
-        width: 500
-        height: 370
-        paddings: 10
-        Layout.topMargin: 20
-        FluChart{
-            anchors.fill: parent
-            chartType: 'pie'
-            chartData: {return {
-                    datasets: [{
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                            ],
-                            backgroundColor: [
-                                '#ffbbbb',
-                                '#ffddaa',
-                                '#ffffbb',
-                                '#bbffbb',
-                                '#bbbbff'
-                            ],
-                            label: 'Dataset 1'
-                        }],
-                    labels: [
-                        'Red',
-                        'Orange',
-                        'Yellow',
-                        'Green',
-                        'Blue'
-                    ]
-                }}
-            chartOptions: {return {maintainAspectRatio: false, responsive: true}}
-        }
-    }
-
-    FluArea{
-        width: 500
-        height: 370
-        paddings: 10
-        Layout.topMargin: 20
-        FluChart{
-            anchors.fill: parent
-            chartType: 'line'
-            chartData: { return {
-                    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
-                    datasets: [{
-                            label: 'Filled',
-                            fill: true,
-                            backgroundColor: 'rgba(192,222,255,0.3)',
-                            borderColor: 'rgba(128,192,255,255)',
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ],
-                        }, {
-                            label: 'Dashed',
-                            fill: false,
-                            backgroundColor: 'rgba(0,0,0,0)',
-                            borderColor: '#009900',
-                            borderDash: [5, 5],
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ],
-                        }, {
-                            label: 'Filled',
-                            backgroundColor: 'rgba(0,0,0,0)',
-                            borderColor: '#990000',
-                            data: [
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor(),
-                                randomScalingFactor()
-                            ],
-                            fill: false,
-                        }]
-                }
-            }
-
-            chartOptions: {return {
-                    maintainAspectRatio: false,
-                    responsive: true,
-                    title: {
-                        display: true,
-                        text: 'Chart.js Line Chart'
-                    },
-                    tooltips: {
-                        mode: 'index',
-                        intersect: false,
-                    },
-                    hover: {
-                        mode: 'nearest',
-                        intersect: true
-                    },
-                    scales: {
-                        xAxes: [{
-                                display: true,
-                                scaleLabel: {
-                                    display: true,
-                                    labelString: 'Month'
-                                }
-                            }],
-                        yAxes: [{
-                                display: true,
-                                scaleLabel: {
-                                    display: true,
-                                    labelString: 'Value'
-                                }
-                            }]
-                    }
-                }
-            }
-        }
-    }
-
-}

example/qml/page/T_Dialog.qml

@@ -116,4 +116,68 @@ FluScrollablePage{
             showSuccess("点击最小化按钮")
         }
     }
+
+    FluArea{
+        Layout.fillWidth: true
+        height: 68
+        paddings: 10
+        Layout.topMargin: 20
+        FluButton{
+            anchors.verticalCenter: parent.verticalCenter
+            Layout.topMargin: 20
+            text:"Custom Content Dialog"
+            onClicked: {
+                custom_btn_dialog.open()
+            }
+        }
+    }
+    CodeExpander{
+        Layout.fillWidth: true
+        Layout.topMargin: -1
+        code:'FluContentDialog{
+    id:dialog
+    title:"友情提示"
+    message:"数据正在加载中，请稍等..."
+    negativeText:"取消加载"
+    contentDelegate: Component{
+        Item{
+            width: parent.width
+            height: 80
+            FluProgressRing{
+                anchors.centerIn: parent
+            }
+        }
+    }
+    onNegativeClicked:{
+        showSuccess("点击取消按钮")
+    }
+    positiveText:"确定"
+    onPositiveClicked:{
+        showSuccess("点击确定按钮")
+    }
+    dialog.open()'
+    }
+
+    FluContentDialog{
+        id:custom_btn_dialog
+        title:"友情提示"
+        message:"数据正在加载中，请稍等..."
+        negativeText:"取消加载"
+        contentDelegate: Component{
+            Item{
+                width: parent.width
+                height: 80
+                FluProgressRing{
+                    anchors.centerIn: parent
+                }
+            }
+        }
+        onNegativeClicked:{
+            showSuccess("点击取消按钮")
+        }
+        positiveText:"确定"
+        onPositiveClicked:{
+            showSuccess("点击确定按钮")
+        }
+    }
 }

example/qml/page/T_Home.qml

@@ -27,7 +27,6 @@ FluScrollablePage{
             id: bg
             fillMode:Image.PreserveAspectCrop
             anchors.fill: parent
-            asynchronous: true
             verticalAlignment: Qt.AlignTop
             sourceSize: Qt.size(960,640)
             source: "qrc:/example/res/image/bg_home_header.png"
@@ -160,7 +159,7 @@ FluScrollablePage{
     Component{
         id:com_item
         Item{
-            property string desc: modelData.desc
+            property string desc: modelData.extra.desc
             width: 320
             height: 120
             FluArea{
@@ -182,7 +181,7 @@ FluScrollablePage{
                     id:item_icon
                     height: 40
                     width: 40
-                    source: modelData.image
+                    source: modelData.extra.image
                     anchors{
                         left: parent.left
                         leftMargin: 20

example/qml/page/T_Http.qml

@@ -1,406 +0,0 @@
-import QtQuick 2.15
-import Qt.labs.platform 1.1
-import QtQuick.Layouts 1.15
-import QtQuick.Window 2.15
-import QtQuick.Controls 2.15
-import QtQuick.Dialogs 1.3
-import FluentUI 1.0
-import "qrc:///example/qml/component"
-import "../component"
-
-FluContentPage{
-
-    title:"Http"
-    property string cacheDirPath: StandardPaths.writableLocation(StandardPaths.AppLocalDataLocation) + "/cache/http"
-    property bool isDownCompleted: false
-
-    FluHttp{
-        id:http
-        cacheDir:cacheDirPath
-    }
-
-    FluHttp{
-        id:http_breakpoint_download
-        cacheDir:cacheDirPath
-        breakPointDownload: true
-    }
-
-    FluHttp{
-        id:http_cache_ifnonecacherequest
-        cacheMode:FluHttpType.IfNoneCacheRequest
-        cacheDir:cacheDirPath
-    }
-
-    FluHttp{
-        id:http_cache_requestfailedreadcache
-        cacheMode:FluHttpType.RequestFailedReadCache
-        cacheDir:cacheDirPath
-    }
-
-    FluHttp{
-        id:http_cache_firstcachethenrequest
-        cacheMode:FluHttpType.FirstCacheThenRequest
-        cacheDir:cacheDirPath
-    }
-
-    HttpCallable{
-        id:callable
-        onStart: {
-            showLoading()
-        }
-        onFinish: {
-            hideLoading()
-        }
-        onError:
-            (status,errorString,result)=>{
-                console.debug(status+";"+errorString+";"+result)
-            }
-        onSuccess:
-            (result)=>{
-                text_info.text = result
-            }
-        onCache:
-            (result)=>{
-                text_info.text = result
-            }
-    }
-
-    Flickable{
-        id:layout_flick
-        width: 200
-        clip: true
-        anchors{
-            top: parent.top
-            topMargin: 20
-            bottom: parent.bottom
-            left: parent.left
-        }
-        ScrollBar.vertical: FluScrollBar {}
-        contentHeight:layout_column.height
-        Column{
-            spacing: 2
-            id:layout_column
-            width: parent.width
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "Get请求"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/get")
-                    http.get(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "Post表单请求"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    var params = {}
-                    params.custname = "朱子楚"
-                    params.custtel = "1234567890"
-                    params.custemail = "zhuzichu520@gmail.com"
-                    request.params = params
-                    var headers = {}
-                    headers.test = "123456789456465321354"
-                    request.headers = headers
-                    http.post(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "Post Json请求"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    var params = {}
-                    params.custname = "朱子楚"
-                    params.custtel = "1234567890"
-                    params.custemail = "zhuzichu520@gmail.com"
-                    request.params = params
-                    http.postJson(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "Post String请求"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    request.params = "我命由我不由天"
-                    http.postString(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "Delete请求"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/delete")
-                    http.deleteResource(request,callable)
-                }
-            }
-            FluProgressButton{
-                id:btn_download
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "下载文件"
-                onClicked: {
-                    folder_dialog.open()
-                }
-            }
-            FluProgressButton{
-                property bool downloading: false
-                id:btn_breakpoint_download
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: {
-                    if(downloading){
-                        return "暂停下载"
-                    }
-                    if(progress === 0){
-                        return "断点下载文件"
-                    }else if(progress === 1){
-                        return "打开文件"
-                    }else{
-                        return "继续下载"
-                    }
-                }
-                HttpRequest{
-                    id:request_breakpoint_download
-                    url: "http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4"
-                    downloadSavePath: FluTools.getApplicationDirPath()+ "/download/big_buck_bunny.mp4"
-                }
-                HttpCallable{
-                    id:callable_breakpoint_download
-                    onStart: {
-                        btn_breakpoint_download.downloading = true
-                    }
-                    onFinish: {
-                        btn_breakpoint_download.downloading = false
-                    }
-                    onError:
-                        (status,errorString,result)=>{
-                            console.debug(status+";"+errorString+";"+result)
-                        }
-                    onSuccess:
-                        (result)=>{
-                            if(!isDownCompleted){
-                                tour.open()
-                                isDownCompleted = true
-                            }
-                            showSuccess(result)
-                        }
-                    onDownloadProgress:
-                        (recv,total)=>{
-                            btn_breakpoint_download.progress = recv/total
-                        }
-                }
-                Component.onCompleted: {
-                    progress = http_breakpoint_download.getBreakPointProgress(request_breakpoint_download)
-                }
-                onClicked: {
-                    if(downloading){
-                        http_breakpoint_download.cancel()
-                        return
-                    }
-                    if(progress === 1){
-                        FluTools.showFileInFolder(request_breakpoint_download.downloadSavePath)
-                    }else{
-                        http_breakpoint_download.download(request_breakpoint_download,callable_breakpoint_download)
-                    }
-                }
-                FluMenu{
-                    id:menu_breakpoint_download
-                    width: 120
-                    FluMenuItem{
-                        text: "删除文件"
-                        onClicked: {
-                            if(FluTools.removeFile(request_breakpoint_download.downloadSavePath)){
-                                btn_breakpoint_download.progress = 0
-                            }
-                        }
-                    }
-                }
-                MouseArea {
-                    anchors.fill: parent
-                    acceptedButtons: Qt.RightButton
-                    onClicked: {
-                        if(btn_breakpoint_download.progress === 1){
-                            menu_breakpoint_download.popup()
-                        }
-                    }
-                }
-            }
-            FluProgressButton{
-                id:btn_upload
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "文件上传"
-                onClicked: {
-                    file_dialog.open()
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "FirstCacheThenRequest缓存"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    request.params = {cacheMode:"FirstCacheThenRequest"}
-                    http_cache_firstcachethenrequest.post(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "RequestFailedReadCache缓存"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    request.params = {cacheMode:"RequestFailedReadCache"}
-                    http_cache_requestfailedreadcache.post(request,callable)
-                }
-            }
-
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "IfNoneCacheRequest缓存"
-                onClicked: {
-                    var request = http.newRequest("https://httpbingo.org/post")
-                    request.params = {cacheMode:"IfNoneCacheRequest"}
-                    http_cache_ifnonecacherequest.post(request,callable)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "打开缓存路径"
-                onClicked: {
-                    Qt.openUrlExternally(cacheDirPath)
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "删除缓存"
-                onClicked: {
-                    console.debug(FluTools.removeDir(cacheDirPath))
-                }
-            }
-            FluButton{
-                implicitWidth: parent.width
-                implicitHeight: 36
-                text: "清空右边数据"
-                onClicked: {
-                    text_info.text = ""
-                }
-            }
-        }
-    }
-
-    FluTour{
-        id:tour
-        steps:[
-            {title:"友情提示",description: "下载已完成，左击这里可以打开文件所在路径，右击可以弹出菜单删除文件！",target:()=>btn_breakpoint_download}
-        ]
-    }
-
-    HttpCallable{
-        id:callable_upload
-        onStart: {
-            btn_upload.disabled = true
-        }
-        onFinish: {
-            btn_upload.disabled = false
-        }
-        onError:
-            (status,errorString,result)=>{
-                btn_upload.progress = 0
-                text_info.text = result
-                console.debug(result)
-            }
-        onSuccess:
-            (result)=>{
-                text_info.text = result
-            }
-        onUploadProgress:
-            (sent,total)=>{
-                btn_upload.progress = sent/total
-            }
-    }
-    FileDialog {
-        id: file_dialog
-        onAccepted: {
-            var request = http.newRequest("https://httpbingo.org/post")
-            var params = {}
-            for(var i=0;i<selectedFiles.length;i++){
-                var fileUrl = selectedFiles[i]
-                var fileName = FluTools.getFileNameByUrl(fileUrl)
-                var filePath = FluTools.toLocalPath(fileUrl)
-                params[fileName] = filePath
-            }
-            request.params = params
-            http.upload(request,callable_upload)
-        }
-    }
-
-    HttpCallable{
-        id:callable_download
-        onStart: {
-            btn_download.progress = 0
-            btn_download.disabled = true
-        }
-        onFinish: {
-            btn_download.disabled = false
-        }
-        onError:
-            (status,errorString,result)=>{
-                btn_download.progress = 0
-                showError(errorString)
-                console.debug(status+";"+errorString+";"+result)
-            }
-        onSuccess:
-            (result)=>{
-                showSuccess(result)
-            }
-        onDownloadProgress:
-            (recv,total)=>{
-                btn_download.progress = recv/total
-            }
-    }
-    FolderDialog {
-        id: folder_dialog
-        currentFolder: StandardPaths.standardLocations(StandardPaths.DownloadLocation)[0]
-        onAccepted: {
-            var request = http.newRequest("http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4")
-            request.downloadSavePath = FluTools.toLocalPath(currentFolder)+ "/big_buck_bunny.mp4"
-            http.download(request,callable_download)
-        }
-    }
-    FluArea{
-        anchors{
-            top: layout_flick.top
-            bottom: layout_flick.bottom
-            left: layout_flick.right
-            right: parent.right
-            leftMargin: 8
-        }
-        Flickable{
-            clip: true
-            id:scrollview
-            boundsBehavior:Flickable.StopAtBounds
-            width: parent.width
-            height: parent.height
-            contentWidth: width
-            contentHeight: text_info.height
-            ScrollBar.vertical: FluScrollBar {}
-            FluText{
-                id:text_info
-                width: scrollview.width
-                wrapMode: Text.WrapAnywhere
-                padding: 14
-            }
-        }
-    }
-}

example/qml/page/T_Network.qml

@@ -0,0 +1,561 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import FluentUI 1.0
+import Qt.labs.platform 1.0
+import "qrc:///example/qml/component"
+import "../component"
+
+FluContentPage{
+
+    id:root
+    title:"Network"
+
+    FluNetworkCallable{
+        id:callable
+        onStart: {
+            showLoading()
+        }
+        onFinish: {
+            hideLoading()
+        }
+        onError:
+            (status,errorString,result)=>{
+                console.debug(status+";"+errorString+";"+result)
+            }
+        onCache:
+            (result)=>{
+                text_info.text = result
+            }
+        onSuccess:
+            (result)=>{
+                text_info.text = result
+            }
+    }
+
+    Flickable{
+        id:layout_flick
+        width: 200
+        clip: true
+        anchors{
+            top: parent.top
+            topMargin: 20
+            bottom: parent.bottom
+            left: parent.left
+        }
+        boundsBehavior: Flickable.StopAtBounds
+        ScrollBar.vertical: FluScrollBar {}
+        contentHeight:layout_column.height
+        Column{
+            spacing: 2
+            id:layout_column
+            width: parent.width
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Get"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.get("https://httpbingo.org/get")
+                    .addQuery("name","孙悟空")
+                    .addQuery("age",500)
+                    .addQuery("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Head"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.head("https://httpbingo.org/head")
+                    .addQuery("name","孙悟空")
+                    .addQuery("age",500)
+                    .addQuery("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Post Body"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postBody("https://httpbingo.org/post")
+                    .setBody("花果山水帘洞美猴王齐天大圣孙悟空")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Post Form"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postForm("https://httpbingo.org/post")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Post JSON"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Post JSON Array"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJsonArray("https://httpbingo.org/post")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Put Body"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.putBody("https://httpbingo.org/put")
+                    .setBody("花果山水帘洞美猴王齐天大圣孙悟空")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Put Form"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.putForm("https://httpbingo.org/put")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Put JSON"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.putJson("https://httpbingo.org/put")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Put JSON Array"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.putJsonArray("https://httpbingo.org/put")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Patch Body"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.patchBody("https://httpbingo.org/patch")
+                    .setBody("花果山水帘洞美猴王齐天大圣孙悟空")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Patch Form"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.patchForm("https://httpbingo.org/patch")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Patch JSON"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.patchJson("https://httpbingo.org/patch")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Patch JSON Array"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.patchJsonArray("https://httpbingo.org/patch")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Delete Body"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.deleteBody("https://httpbingo.org/delete")
+                    .setBody("花果山水帘洞美猴王齐天大圣孙悟空")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Delete Form"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.deleteForm("https://httpbingo.org/delete")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Delete JSON"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.deleteJson("https://httpbingo.org/delete")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Delete JSON Array"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.deleteJsonArray("https://httpbingo.org/delete")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Open Log"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .openLog(true)
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Custom Header"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .addHeader("os","PC")
+                    .addHeader("version","1.0.0")
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "RequestFailedReadCache"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .setCacheMode(FluNetworkType.RequestFailedReadCache)
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .add("cacheMode","RequestFailedReadCache")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "IfNoneCacheRequest"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .setCacheMode(FluNetworkType.IfNoneCacheRequest)
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .add("cacheMode","IfNoneCacheRequest")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "FirstCacheThenRequest"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .setCacheMode(FluNetworkType.FirstCacheThenRequest)
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .add("cacheMode","FirstCacheThenRequest")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluButton{
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Timeout And Retry"
+                onClicked: {
+                    text_info.text = ""
+                    FluNetwork.postJson("https://httpbingo.org/post")
+                    .setTimeout(5000)
+                    .setRetry(3)
+                    .add("name","孙悟空")
+                    .add("age",500)
+                    .add("address","花果山水帘洞")
+                    .add("timeout","5000")
+                    .add("retry","3")
+                    .bind(root)
+                    .go(callable)
+                }
+            }
+            FluProgressButton{
+                id:btn_upload
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Upload File"
+                onClicked: {
+                    file_dialog.open()
+                }
+            }
+            FluProgressButton{
+                id:btn_download
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Download File"
+                onClicked: {
+                    folder_dialog.showDialog(function(path){
+                        FluNetwork.get("http://vjs.zencdn.net/v/oceans.mp4")
+                        .toDownload(path)
+                        .bind(root)
+                        .go(callable_download_file)
+                    })
+                }
+            }
+            FluProgressButton{
+                id:btn_download_breakpoint
+                implicitWidth: parent.width
+                implicitHeight: 36
+                text: "Breakpoint Download File"
+                onClicked: {
+                    folder_dialog.showDialog(function(path){
+                        FluNetwork.get("http://vjs.zencdn.net/v/oceans.mp4")
+                        .toDownload(path,true)
+                        .bind(root)
+                        .go(callable_breakpoint_download_file)
+                    })
+                }
+            }
+        }
+    }
+
+    FluNetworkCallable{
+        id:callable_upload_file
+        onStart: {
+            btn_upload.disabled = true
+        }
+        onFinish: {
+            btn_upload.disabled = false
+        }
+        onError:
+            (status,errorString,result)=>{
+                btn_upload.progress = 0
+                text_info.text = result
+                console.debug(status+";"+errorString+";"+result)
+            }
+        onSuccess:
+            (result)=>{
+                text_info.text = result
+            }
+        onUploadProgress:
+            (sent,total)=>{
+                btn_upload.progress = sent/total
+            }
+    }
+
+    FluNetworkCallable{
+        id:callable_download_file
+        onStart: {
+            btn_download.progress = 0
+            btn_download.disabled = true
+        }
+        onFinish: {
+            btn_download.disabled = false
+        }
+        onError:
+            (status,errorString,result)=>{
+                btn_download.progress = 0
+                showError(errorString)
+                console.debug(status+";"+errorString+";"+result)
+            }
+        onSuccess:
+            (result)=>{
+                showSuccess(result)
+            }
+        onDownloadProgress:
+            (recv,total)=>{
+                btn_download.progress = recv/total
+            }
+    }
+
+    FluNetworkCallable{
+        id:callable_breakpoint_download_file
+        onStart: {
+            btn_download_breakpoint.progress = 0
+            btn_download_breakpoint.disabled = true
+        }
+        onFinish: {
+            btn_download_breakpoint.disabled = false
+        }
+        onError:
+            (status,errorString,result)=>{
+                btn_download_breakpoint.progress = 0
+                showError(errorString)
+                console.debug(status+";"+errorString+";"+result)
+            }
+        onSuccess:
+            (result)=>{
+                showSuccess(result)
+            }
+        onDownloadProgress:
+            (recv,total)=>{
+                btn_download_breakpoint.progress = recv/total
+            }
+    }
+
+    FileDialog {
+        id: file_dialog
+        onAccepted: {
+            FluNetwork.postForm("https://httpbingo.org/post")
+            .setRetry(1)//只请求一次
+            .add("accessToken","12345678")
+            .addFile("file",FluTools.toLocalPath(file_dialog.currentFile))
+            .bind(root)
+            .go(callable_upload_file)
+        }
+    }
+
+    FileDialog {
+        property var onSelectListener
+        id: folder_dialog
+        folder: StandardPaths.standardLocations(StandardPaths.DownloadLocation)[0]
+        currentFile: StandardPaths.standardLocations(StandardPaths.DownloadLocation)[0]+"/oceans.mp4"
+        fileMode: FileDialog.SaveFile
+        onAccepted: {
+            folder_dialog.onSelectListener(FluTools.toLocalPath(folder_dialog.currentFile))
+        }
+        function showDialog(listener){
+            folder_dialog.onSelectListener = listener
+            folder_dialog.open()
+        }
+    }
+
+    FluArea{
+        anchors{
+            top: layout_flick.top
+            bottom: layout_flick.bottom
+            left: layout_flick.right
+            right: parent.right
+            leftMargin: 8
+        }
+        Flickable{
+            clip: true
+            id:scrollview
+            boundsBehavior:Flickable.StopAtBounds
+            width: parent.width
+            height: parent.height
+            contentWidth: width
+            contentHeight: text_info.height
+            ScrollBar.vertical: FluScrollBar {}
+            FluText{
+                id:text_info
+                width: scrollview.width
+                wrapMode: Text.WrapAnywhere
+                padding: 14
+            }
+        }
+    }
+}

example/qml/page/T_QRCode.qml

@@ -32,6 +32,7 @@ FluScrollablePage{
         FluTextBox{
             id:text_box
             text:"会磨刀的小猪"
+            Layout.preferredWidth: 240
         }
     }
 

example/qml/page/T_Settings.qml

@@ -65,33 +65,27 @@ FluScrollablePage{
         height: 50
         paddings: 10
         FluCheckBox{
-            text:"V-Sync"
-            checked: FluApp.vsync
+            text:"Use System AppBar"
+            checked: FluApp.useSystemAppBar
             anchors.verticalCenter: parent.verticalCenter
             onClicked: {
-                FluApp.vsync = !FluApp.vsync
+                FluApp.useSystemAppBar = !FluApp.useSystemAppBar
                 dialog_restart.open()
             }
         }
     }
 
-
     FluArea{
         Layout.fillWidth: true
         Layout.topMargin: 20
         height: 50
         paddings: 10
         FluCheckBox{
-            text:"Software Render"
-            checked: SettingsHelper.getRender() === "software"
+            text:"fitsAppBarWindows"
+            checked: window.fitsAppBarWindows
             anchors.verticalCenter: parent.verticalCenter
             onClicked: {
-                if(SettingsHelper.getRender() === "software"){
-                    SettingsHelper.saveRender("")
-                }else{
-                    SettingsHelper.saveRender("software")
-                }
-                dialog_restart.open()
+                window.fitsAppBarWindows = !window.fitsAppBarWindows
             }
         }
     }
@@ -202,5 +196,4 @@ FluScrollablePage{
             }
         }
     }
-
 }

example/qml/page/T_ShortcutPicker.qml

@@ -0,0 +1,30 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import FluentUI 1.0
+import "qrc:///example/qml/component"
+
+FluScrollablePage{
+
+    title:"ShortcutPicker"
+
+    FluArea{
+        Layout.fillWidth: true
+        Layout.topMargin: 20
+        height: 100
+        paddings: 10
+        FluShortcutPicker{
+            anchors.verticalCenter: parent.verticalCenter
+        }
+    }
+    CodeExpander{
+        Layout.fillWidth: true
+        Layout.topMargin: -1
+        code:'FluShortcutPicker{
+
+}'
+    }
+
+}
+

example/qml/page/T_TabView.qml

@@ -68,10 +68,10 @@ FluScrollablePage{
                 text:"Always"
                 Layout.preferredWidth: 120
                 FluMenuItem{
-                    text:"Nerver"
+                    text:"Never"
                     onClicked: {
                         btn_close_button_visibility.text = text
-                        tab_view.closeButtonVisibility = FluTabViewType.Nerver
+                        tab_view.closeButtonVisibility = FluTabViewType.Never
                     }
                 }
                 FluMenuItem{

example/qml/page/T_TableView.qml

@@ -30,6 +30,43 @@ FluContentPage{
         }
     }
 
+    FluContentDialog{
+        id:custom_update_dialog
+        signal showDialog(string text,var callback)
+        property var _textBox
+        property var onAccpetListener
+        title:"修改列名"
+        negativeText:"取消"
+        contentDelegate: Component{
+            Item{
+                width: parent.width
+                height: 60
+                FluTextBox{
+                    id:textbox_text
+                    anchors.centerIn: parent
+                }
+                Connections{
+                    target: custom_update_dialog
+                    function onShowDialog(text,callback){
+                        custom_update_dialog._textBox = textbox_text
+                        custom_update_dialog.onAccpetListener = callback
+                        textbox_text.text = text
+                        textbox_text.forceActiveFocus()
+                        custom_update_dialog.open()
+                    }
+                }
+            }
+        }
+        onNegativeClicked:{
+        }
+        positiveText:"确定"
+        onPositiveClicked:{
+            if(custom_update_dialog.onAccpetListener && custom_update_dialog._textBox){
+                custom_update_dialog.onAccpetListener(custom_update_dialog._textBox.text)
+            }
+        }
+    }
+
     Component{
         id:com_checbox
         Item{
@@ -159,6 +196,34 @@ FluContentPage{
         }
     }
 
+    Component{
+        id:com_column_update_title
+        Item{
+            FluText{
+                id:text_title
+                text: {
+                    if(options.title){
+                        return options.title
+                    }
+                    return ""
+                }
+                anchors.fill: parent
+                verticalAlignment: Qt.AlignVCenter
+                horizontalAlignment: Qt.AlignHCenter
+                elide: Text.ElideRight
+            }
+            MouseArea{
+                anchors.fill: parent
+                cursorShape: Qt.PointingHandCursor
+                onClicked: {
+                    custom_update_dialog.showDialog(options.title,function(text){
+                        itemModel.display = table_view.customItem(com_column_update_title,{"title":text})
+                    })
+                }
+            }
+        }
+    }
+
     Component{
         id:com_column_sort_age
         Item{
@@ -237,7 +302,7 @@ FluContentPage{
                 maximumWidth:80,
             },
             {
-                title: '头像',
+                title: table_view.customItem(com_column_update_title,{title:'头像'}),
                 dataIndex: 'avatar',
                 width:100,
                 minimumWidth:100,

example/qml/page/T_Timeline.qml

@@ -111,6 +111,7 @@ FluScrollablePage{
         FluTextBox{
             id:text_box
             text:"Technical testing 2015-09-01"
+            Layout.preferredWidth: 240
         }
         FluFilledButton{
             text:"Append"

example/qml/page/T_Watermark.qml

@@ -30,6 +30,7 @@ FluContentPage{
                 FluTextBox{
                     id:text_box
                     text:"会磨刀的小猪"
+                    Layout.preferredWidth: 240
                 }
             }
 

example/qml/window/AboutWindow.qml

@@ -10,7 +10,7 @@ FluWindow {
     id:window
     title:"关于"
     width: 600
-    height: 600
+    height: 580
     fixSize: true
     launchMode: FluWindowType.SingleTask
 

example/qml/window/CrashWindow.qml

@@ -0,0 +1,72 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.15
+import FluentUI 1.0
+import Qt.labs.platform 1.0
+import "qrc:///example/qml/component"
+
+FluWindow {
+
+    id:window
+    title:"友情提示"
+    width: 300
+    height: 400
+    fixSize: true
+    showMinimize: false
+    showStayTop: false
+
+    property string crashFilePath
+
+    onInitArgument:
+        (argument)=>{
+            crashFilePath = argument.crashFilePath
+        }
+
+    Image{
+        width: 540/2
+        height: 285/2
+        anchors{
+            horizontalCenter: parent.horizontalCenter
+            top: parent.top
+            topMargin: 40
+        }
+        source: "qrc:/example/res/image/ic_crash.png"
+    }
+
+    FluText{
+        id:text_info
+        anchors{
+            horizontalCenter: parent.horizontalCenter
+            top: parent.top
+            topMargin: 240
+        }
+        text:"发生意外错误\n给您带来的不便，我们深表歉意"
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+    }
+
+    RowLayout{
+        anchors{
+            horizontalCenter: parent.horizontalCenter
+            bottom: parent.bottom
+            bottomMargin: 20
+        }
+        FluButton{
+            text:"日志上报"
+            onClicked: {
+                FluTools.showFileInFolder(crashFilePath)
+            }
+        }
+        Item{
+            width: 30
+            height: 1
+        }
+        FluFilledButton{
+            text:"重启程序"
+            onClicked: {
+                FluApp.exit(931)
+            }
+        }
+    }
+
+}

example/qml/window/MainWindow.qml

@@ -16,12 +16,20 @@ FluWindow {
 
     id:window
     title: "FluentUI"
-    width: 1000
-    height: 640
+    width: 960
+    height: 600
     minimumWidth: 520
     minimumHeight: 200
     launchMode: FluWindowType.SingleTask
-    appBar: undefined
+    fitsAppBarWindows: true
+    appBar: FluAppBar {
+        height: 30
+        darkText: Lang.dark_mode
+        showDark: true
+        darkClickListener:(button)=>handleDarkChanged(button)
+        closeClickListener: ()=>{dialog_close.open()}
+        z:7
+    }
 
     SettingsViewModel{
         id:viewmodel_settings
@@ -35,8 +43,19 @@ FluWindow {
         }
     }
 
+    onFirstVisible: {
+        timer_tour_delay.restart()
+    }
+
+    Timer{
+        id:timer_tour_delay
+        interval: 200
+        onTriggered: {
+            tour.open()
+        }
+    }
+
     Component.onCompleted: {
-        tour.open()
         checkUpdate(true)
         FluEventBus.registerEvent(event_checkupdate)
     }
@@ -68,15 +87,23 @@ FluWindow {
             }
     }
 
+    Timer{
+        id:timer_window_hide_delay
+        interval: 150
+        onTriggered: {
+            window.hide()
+        }
+    }
+
     FluContentDialog{
         id:dialog_close
         title:"退出"
         message:"确定要退出程序吗？"
         negativeText:"最小化"
         buttonFlags: FluContentDialogType.NegativeButton | FluContentDialogType.NeutralButton | FluContentDialogType.PositiveButton
-        onNegativeClicked:{
-            window.hide()
+        onNegativeClicked: {
             system_tray.showMessage("友情提示","FluentUI已隐藏至托盘,点击托盘可再次激活窗口");
+            timer_window_hide_delay.restart()
         }
         positiveText:"退出"
         neutralText:"取消"
@@ -123,19 +150,8 @@ FluWindow {
         back: Item{
             anchors.fill: flipable
             visible: flipable.flipAngle !== 0
-            FluAppBar {
-                anchors {
-                    top: parent.top
-                    left: parent.left
-                    right: parent.right
-                }
-                darkText: Lang.dark_mode
-                showDark: true
-                z:7
-                darkClickListener:(button)=>handleDarkChanged(button)
-                closeClickListener: ()=>{dialog_close.open()}
-            }
             Row{
+                id:layout_back_buttons
                 z:8
                 anchors{
                     top: parent.top
@@ -166,26 +182,13 @@ FluWindow {
                 id:loader
                 lazy: true
                 anchors.fill: parent
-                source: "https://zhu-zichu.gitee.io/Qt5_156_LieflatPage.qml"
+                source: "https://zhu-zichu.gitee.io/Qt_163_LieflatPage.qml"
             }
         }
         front: Item{
             id:page_front
             visible: flipable.flipAngle !== 180
             anchors.fill: flipable
-            FluAppBar {
-                id:app_bar_front
-                anchors {
-                    top: parent.top
-                    left: parent.left
-                    right: parent.right
-                }
-                darkText: Lang.dark_mode
-                showDark: true
-                darkClickListener:(button)=>handleDarkChanged(button)
-                closeClickListener: ()=>{dialog_close.open()}
-                z:7
-            }
             FluNavigationView{
                 property int clickCount: 0
                 id:nav_view
@@ -198,7 +201,12 @@ FluWindow {
                 pageMode: FluNavigationViewType.NoStack
                 items: ItemsOriginal
                 footerItems:ItemsFooter
-                topPadding:FluTools.isMacos() ? 20 : 0
+                topPadding:{
+                    if(window.useSystemAppBar){
+                        return 0
+                    }
+                    return FluTools.isMacos() ? 20 : 0
+                }
                 displayMode:viewmodel_settings.displayMode
                 logo: "qrc:/example/res/image/favicon.ico"
                 title:"FluentUI"
@@ -235,7 +243,7 @@ FluWindow {
         id:com_reveal
         CircularReveal{
             id:reveal
-            target:window.contentItem
+            target:window.layoutContainer()
             anchors.fill: parent
             onAnimationFinished:{
                 //动画结束后释放资源
@@ -257,11 +265,14 @@ FluWindow {
     }
 
     function handleDarkChanged(button){
-        if(!FluTheme.enableAnimation){
+        if(!FluTheme.enableAnimation || window.fitsAppBarWindows === false){
             changeDark()
         }else{
+            if(loader_reveal.sourceComponent){
+                return
+            }
             loader_reveal.sourceComponent = com_reveal
-            var target = window.contentItem
+            var target = window.layoutContainer()
             var pos = button.mapToItem(target,0,0)
             var mouseX = pos.x
             var mouseY = pos.y
@@ -299,14 +310,14 @@ FluWindow {
 
     FluTour{
         id:tour
-        steps:[
-            {title:"夜间模式",description: "这里可以切换夜间模式.",target:()=>app_bar_front.darkButton()},
-            {title:"隐藏彩蛋",description: "多点几下试试！！",target:()=>nav_view.logoButton()}
-        ]
-    }
-
-    FluHttp{
-        id:http
+        steps:{
+            var data = []
+            if(!window.useSystemAppBar){
+                data.push({title:"夜间模式",description: "这里可以切换夜间模式.",target:()=>appBar.darkButton()})
+            }
+            data.push({title:"隐藏彩蛋",description: "多点几下试试！！",target:()=>nav_view.logoButton()})
+            return data
+        }
     }
 
     FpsItem{
@@ -338,7 +349,7 @@ FluWindow {
         }
     }
 
-    HttpCallable{
+    FluNetworkCallable{
         id:callable
         property bool silent: true
         onStart: {
@@ -374,8 +385,8 @@ FluWindow {
 
     function checkUpdate(silent){
         callable.silent = silent
-        var request = http.newRequest("https://api.github.com/repos/zhuzichu520/FluentUI/releases/latest")
-        http.get(request,callable);
+        FluNetwork.get("https://api.github.com/repos/zhuzichu520/FluentUI/releases/latest")
+        .go(callable)
     }
 
 }

example/src/AppInfo.cpp

@@ -11,6 +11,7 @@ AppInfo::AppInfo(QObject *parent)
     version(APPLICATION_VERSION);
 }
 
-void AppInfo::init(QQmlApplicationEngine *engine){
-    engine->rootContext();
+void AppInfo::testCrash(){
+    auto *crash = reinterpret_cast<volatile int *>(0);
+    *crash = 0;
 }

example/src/AppInfo.h

@@ -13,8 +13,8 @@ class AppInfo : public QObject
 private:
     explicit AppInfo(QObject *parent = nullptr);
 public:
-    SINGLETONG(AppInfo)
-    void init(QQmlApplicationEngine *engine);
+    SINGLETON(AppInfo)
+    Q_INVOKABLE void testCrash();
 };
 
 #endif // APPINFO_H

example/src/app_dmp.h

@@ -0,0 +1,82 @@
+#ifndef APP_DUMP_H
+#define APP_DUMP_H
+
+#include <Windows.h>
+#include <DbgHelp.h>
+#include <QDateTime>
+#include <QDir>
+#include <QGuiApplication>
+#include <QProcess>
+#include <QStandardPaths>
+#include <QString>
+
+#pragma comment(lib, "Dbghelp.lib")
+
+static void miniDumpWriteDump(HANDLE hProcess,DWORD ProcessId,HANDLE hFile,MINIDUMP_TYPE DumpType,CONST PMINIDUMP_EXCEPTION_INFORMATION ExceptionParam,CONST PMINIDUMP_USER_STREAM_INFORMATION UserStreamParam,CONST PMINIDUMP_CALLBACK_INFORMATION CallbackParam){
+    typedef HRESULT (WINAPI* MiniDumpWriteDumpPtr)(HANDLE hProcess,DWORD ProcessId,HANDLE hFile,MINIDUMP_TYPE DumpType,CONST PMINIDUMP_EXCEPTION_INFORMATION ExceptionParam,CONST PMINIDUMP_USER_STREAM_INFORMATION UserStreamParam,CONST PMINIDUMP_CALLBACK_INFORMATION CallbackParam);
+    HMODULE module = LoadLibraryW(L"Dbghelp.dll");
+    if (module)
+    {
+        MiniDumpWriteDumpPtr mini_dump_write_dump;
+        mini_dump_write_dump= reinterpret_cast<MiniDumpWriteDumpPtr>(GetProcAddress(module, "MiniDumpWriteDump"));
+        if (mini_dump_write_dump)
+        {
+            mini_dump_write_dump(hProcess,ProcessId,hFile,DumpType,ExceptionParam,UserStreamParam,CallbackParam);
+        }
+    }
+}
+
+BOOL CALLBACK MyMiniDumpCallback(PVOID, const PMINIDUMP_CALLBACK_INPUT input, PMINIDUMP_CALLBACK_OUTPUT output) {
+    if (input == NULL || output == NULL)
+        return FALSE;
+
+    BOOL ret = FALSE;
+    switch (input->CallbackType) {
+    case IncludeModuleCallback:
+    case IncludeThreadCallback:
+    case ThreadCallback:
+    case ThreadExCallback:
+        ret = TRUE;
+        break;
+    case ModuleCallback: {
+        if (!(output->ModuleWriteFlags & ModuleReferencedByMemory)) {
+            output->ModuleWriteFlags &= ~ModuleWriteModule;
+        }
+        ret = TRUE;
+    } break;
+    default:
+        break;
+    }
+    return ret;
+}
+
+void WriteDump(EXCEPTION_POINTERS* exp, const std::wstring& path) {
+    HANDLE h = ::CreateFileW(path.c_str(), GENERIC_WRITE | GENERIC_READ, FILE_SHARE_WRITE | FILE_SHARE_READ, NULL, CREATE_ALWAYS, FILE_ATTRIBUTE_NORMAL, NULL);
+    MINIDUMP_EXCEPTION_INFORMATION info;
+    info.ThreadId = ::GetCurrentThreadId();
+    info.ExceptionPointers = exp;
+    info.ClientPointers = FALSE;
+    MINIDUMP_CALLBACK_INFORMATION mci;
+    mci.CallbackRoutine = (MINIDUMP_CALLBACK_ROUTINE)MyMiniDumpCallback;
+    mci.CallbackParam = 0;
+    MINIDUMP_TYPE mdt = (MINIDUMP_TYPE)(MiniDumpWithIndirectlyReferencedMemory | MiniDumpScanMemory);
+    miniDumpWriteDump(GetCurrentProcess(), GetCurrentProcessId(), h, mdt, &info, NULL, &mci);
+    ::CloseHandle(h);
+}
+
+LONG WINAPI MyUnhandledExceptionFilter(EXCEPTION_POINTERS* exp) {
+    const QString dumpFileName = QString("%1_%2.dmp").arg("crash",QDateTime::currentDateTime().toString("yyyyMMdd_hhmmss"));
+    const QString dumpDirPath = QStandardPaths::writableLocation(QStandardPaths::AppLocalDataLocation)+"/dmp";
+    const QDir dumpDir(dumpDirPath);
+    if(!dumpDir.exists()){
+        dumpDir.mkpath(dumpDirPath);
+    }
+    QString dumpFilePath = dumpDir.filePath(dumpFileName);
+    WriteDump(exp, dumpFilePath.toStdWString());
+    QStringList arguments;
+    arguments << "-crashed=" + dumpFilePath;
+    QProcess::startDetached(qApp->applicationFilePath(), arguments);
+    return EXCEPTION_EXECUTE_HANDLER;
+}
+
+#endif // APP_DUMP_H

example/src/component/CircularReveal.cpp

@@ -5,10 +5,11 @@
 
 CircularReveal::CircularReveal(QQuickItem* parent) : QQuickPaintedItem(parent)
 {
+    _anim = new QPropertyAnimation(this, "radius", this);
     setVisible(false);
-    _anim.setDuration(333);
-    _anim.setEasingCurve(QEasingCurve::OutCubic);
-    connect(&_anim, &QPropertyAnimation::finished,this,[=](){
+    _anim->setDuration(333);
+    _anim->setEasingCurve(QEasingCurve::OutCubic);
+    connect(_anim, &QPropertyAnimation::finished,this,[=](){
         update();
         setVisible(false);
         Q_EMIT animationFinished();
@@ -31,8 +32,8 @@ void CircularReveal::paint(QPainter* painter)
 }
 
 void CircularReveal::start(int w,int h,const QPoint& center,int radius){
-    _anim.setStartValue(0);
-    _anim.setEndValue(radius);
+    _anim->setStartValue(0);
+    _anim->setEndValue(radius);
     _center = center;
     _grabResult = _target->grabToImage(QSize(w,h));
     connect(_grabResult.data(), &QQuickItemGrabResult::ready, this, &CircularReveal::handleGrabResult);
@@ -43,5 +44,5 @@ void CircularReveal::handleGrabResult(){
     update();
     setVisible(true);
     Q_EMIT imageChanged();
-    _anim.start();
+    _anim->start();
 }

example/src/component/CircularReveal.h

@@ -20,8 +20,8 @@ public:
     Q_SIGNAL void animationFinished();
     Q_SLOT void handleGrabResult();
 private:
+    QPropertyAnimation* _anim = nullptr;
     QImage _source;
-    QPropertyAnimation _anim = QPropertyAnimation(this, "radius", this);
     QPoint _center;
     QSharedPointer<QQuickItemGrabResult>  _grabResult;
 };

example/src/helper/Log.cpp

@@ -0,0 +1,208 @@
+#include "Log.h"
+#include <QtCore/qdebug.h>
+#include <QtCore/qfile.h>
+#include <QtCore/qtextstream.h>
+#include <QGuiApplication>
+#include <iostream>
+#include <QDateTime>
+#include <QStandardPaths>
+#include <QDir>
+#include <QThread>
+#include <QSettings>
+#include <QRegularExpression>
+#include "Version.h"
+#ifdef WIN32
+#include <process.h>
+#else
+#include <unistd.h>
+#endif
+
+#ifndef QT_ENDL
+#  if (QT_VERSION >= QT_VERSION_CHECK(5, 14, 0))
+#    define QT_ENDL Qt::endl
+#  else
+#    define QT_ENDL endl
+#  endif
+#endif
+
+static QString g_app = {};
+static QString g_file_path= {};
+static bool g_logError = false;
+
+static std::unique_ptr<QFile> g_logFile = nullptr;
+static std::unique_ptr<QTextStream> g_logStream = nullptr;
+
+static int g_logLevel = 4;
+
+std::map<QtMsgType, int> logLevelMap = {
+    {QtFatalMsg,0},
+    {QtCriticalMsg,1},
+    {QtWarningMsg,2},
+    {QtInfoMsg,3},
+    {QtDebugMsg,4}
+};
+
+QString Log::prettyProductInfoWrapper()
+{
+    auto productName = QSysInfo::prettyProductName();
+#if QT_VERSION < QT_VERSION_CHECK(6, 5, 0)
+#if defined(Q_OS_MACOS)
+    auto macosVersionFile = QString::fromUtf8("/System/Library/CoreServices/.SystemVersionPlatform.plist");
+    auto fi = QFileInfo (macosVersionFile);
+    if (fi.exists() && fi.isReadable()) {
+        auto plistFile = QFile(macosVersionFile);
+        plistFile.open(QIODevice::ReadOnly);
+        while (!plistFile.atEnd()) {
+            auto line = plistFile.readLine();
+            if (line.contains("ProductUserVisibleVersion")) {
+                auto nextLine = plistFile.readLine();
+                if (nextLine.contains("<string>")) {
+                    QRegularExpression re(QString::fromUtf8("\\s*<string>(.*)</string>"));
+                    auto matches = re.match(QString::fromUtf8(nextLine));
+                    if (matches.hasMatch()) {
+                        productName = QString::fromUtf8("macOS ") + matches.captured(1);
+                        break;
+                    }
+                }
+            }
+        }
+    }
+#endif
+#endif
+#if defined(Q_OS_WIN)
+    QSettings regKey {QString::fromUtf8("HKEY_LOCAL_MACHINE\\SOFTWARE\\Microsoft\\Windows NT\\CurrentVersion"), QSettings::NativeFormat};
+    if (regKey.contains(QString::fromUtf8("CurrentBuildNumber"))) {
+        auto buildNumber = regKey.value(QString::fromUtf8("CurrentBuildNumber")).toInt();
+        if (buildNumber > 0) {
+            if (buildNumber < 9200) {
+                productName = QString::fromUtf8("Windows 7 build %1").arg(buildNumber);
+            }
+            else if (buildNumber < 10240) {
+                productName = QString::fromUtf8("Windows 8 build %1").arg(buildNumber);
+            }
+            else if (buildNumber < 22000) {
+                productName = QString::fromUtf8("Windows 10 build %1").arg(buildNumber);
+            }
+            else {
+                productName = QString::fromUtf8("Windows 11 build %1").arg(buildNumber);
+            }
+        }
+    }
+#endif
+    return productName;
+}
+
+static inline void messageHandler(const QtMsgType type, const QMessageLogContext &context, const QString &message)
+{
+    if(message == "Could not get the INetworkConnection instance for the adapter GUID."){
+        return;
+    }
+    if(logLevelMap[type]>g_logLevel){
+        return;
+    }
+    if (!message.isEmpty()) {
+        QString levelName;
+        switch (type) {
+        case QtDebugMsg:
+            levelName = QStringLiteral("Debug");
+            break;
+        case QtInfoMsg:
+            levelName = QStringLiteral("Info");
+            break;
+        case QtWarningMsg:
+            levelName = QStringLiteral("Warning");
+            break;
+        case QtCriticalMsg:
+            levelName = QStringLiteral("Critical");
+            break;
+        case QtFatalMsg:
+            levelName = QStringLiteral("Fatal");
+            break;
+        }
+        QString fileAndLineLogStr;
+        if(context.file){
+            std::string strFileTmp = context.file;
+            const char* ptr = strrchr(strFileTmp.c_str(), '/');
+            if (nullptr != ptr) {
+                char fn[512] = {0};
+                sprintf(fn, "%s", ptr + 1);
+                strFileTmp = fn;
+            }
+            const char* ptrTmp = strrchr(strFileTmp.c_str(), '\\');
+            if (nullptr != ptrTmp) {
+                char fn[512] = {0};
+                sprintf(fn, "%s", ptrTmp + 1);
+                strFileTmp = fn;
+            }
+            fileAndLineLogStr = QString::fromStdString("[%1:%2]").arg(QString::fromStdString(strFileTmp),QString::number(context.line));
+        }
+        const QString finalMessage = QString::fromStdString("%1[%2]%3[%4]:%5").arg(
+            QDateTime::currentDateTime().toString("yyyy/MM/dd hh:mm:ss.zzz"),
+            levelName,
+            fileAndLineLogStr,
+            QString::number(reinterpret_cast<quintptr>(QThread::currentThreadId())),
+            message);
+        if ((type == QtInfoMsg) || (type == QtDebugMsg)) {
+            std::cout << qPrintable(finalMessage) << std::endl;
+        } else {
+            std::cerr << qPrintable(finalMessage) << std::endl;
+        }
+        if (g_logError) {
+            return;
+        }
+        if (!g_logFile) {
+            g_logFile = std::make_unique<QFile>(g_file_path);
+            if (!g_logFile->open(QFile::WriteOnly | QFile::Text | QFile::Append)) {
+                std::cerr << "Can't open file to write: " << qPrintable(g_logFile->errorString()) << std::endl;
+                g_logFile.reset();
+                g_logError = true;
+                return;
+            }
+        }
+        if (!g_logStream) {
+            g_logStream = std::make_unique<QTextStream>();
+            g_logStream->setDevice(g_logFile.get());
+        }
+        (*g_logStream) << finalMessage << QT_ENDL;
+        g_logStream->flush();
+    }
+}
+
+void Log::setup(const QString &app,int level)
+{
+    Q_ASSERT(!app.isEmpty());
+    if (app.isEmpty()) {
+        return;
+    }
+    g_logLevel = level;
+    static bool once = false;
+    if (once) {
+        return;
+    }
+    once = true;
+    g_app = app;
+    const QString logFileName = QString("%1_%2.log").arg(g_app,QDateTime::currentDateTime().toString("yyyyMMdd"));
+    const QString logDirPath = QStandardPaths::writableLocation(QStandardPaths::AppLocalDataLocation)+"/log";
+    const QDir logDir(logDirPath);
+    if(!logDir.exists()){
+        logDir.mkpath(logDirPath);
+    }
+    g_file_path = logDir.filePath(logFileName);
+    qInstallMessageHandler(messageHandler);
+    qInfo()<<"===================================================";
+    qInfo()<<"[AppName]"<<g_app;
+    qInfo()<<"[AppVersion]"<<APPLICATION_VERSION;
+#ifdef WIN32
+    qInfo()<<"[ProcessId]"<<QString::number(_getpid());
+#else
+    qInfo()<<"[ProcessId]"<<QString::number(getpid());
+#endif
+    qInfo()<<"[GitHashCode]"<<COMMIT_HASH;
+    qInfo()<<"[DeviceInfo]";
+    qInfo()<<"  [DeviceId]"<<QSysInfo::machineUniqueId();
+    qInfo()<<"  [Manufacturer]"<<prettyProductInfoWrapper();
+    qInfo()<<"  [CPU_ABI]"<<QSysInfo::currentCpuArchitecture();
+    qInfo()<<"[LOG_LEVEL]"<<g_logLevel;
+    qInfo()<<"[LOG_PATH]"<<g_file_path;
+    qInfo()<<"===================================================";
+}

example/src/helper/Log.h

@@ -0,0 +1,11 @@
+#ifndef LOG_H
+#define LOG_H
+#include <QtCore/qstring.h>
+
+namespace Log
+{
+    QString prettyProductInfoWrapper();
+    void setup(const QString &app,int level = 4);
+}
+
+#endif // LOG_H

example/src/helper/SettingsHelper.cpp

@@ -12,23 +12,15 @@ SettingsHelper::~SettingsHelper() = default;
 
 void SettingsHelper::save(const QString& key,QVariant val)
 {
-    QByteArray data = {};
-    QDataStream stream(&data, QIODevice::WriteOnly);
-    stream.setVersion(QDataStream::Qt_5_6);
-    stream << val;
-    m_settings->setValue(key, data);
+    m_settings->setValue(key, val);
 }
 
 QVariant SettingsHelper::get(const QString& key,QVariant def){
-    const QByteArray data = m_settings->value(key).toByteArray();
-    if (data.isEmpty()) {
-        return def;
+    QVariant data = m_settings->value(key);
+    if (!data.isNull() && data.isValid()) {
+        return data;
     }
-    QDataStream stream(data);
-    stream.setVersion(QDataStream::Qt_5_6);
-    QVariant val;
-    stream >> val;
-    return val;
+    return def;
 }
 
 void SettingsHelper::init(char *argv[]){
@@ -36,6 +28,5 @@ void SettingsHelper::init(char *argv[]){
     const QFileInfo fileInfo(applicationPath);
     const QString iniFileName = fileInfo.completeBaseName() + ".ini";
     const QString iniFilePath = QStandardPaths::writableLocation(QStandardPaths::AppLocalDataLocation) + "/" + iniFileName;
-    qDebug()<<"Application configuration file path->"<<iniFilePath;
     m_settings.reset(new QSettings(iniFilePath, QSettings::IniFormat));
 }

example/src/helper/SettingsHelper.h

@@ -16,15 +16,13 @@ class SettingsHelper : public QObject
 private:
     explicit SettingsHelper(QObject* parent = nullptr);
 public:
-    SINGLETONG(SettingsHelper)
+    SINGLETON(SettingsHelper)
     ~SettingsHelper() override;
     void init(char *argv[]);
-    Q_INVOKABLE void saveRender(const QVariant& render){save("render",render);}
-    Q_INVOKABLE QVariant getRender(){return get("render");}
     Q_INVOKABLE void saveDarkMode(int darkModel){save("darkMode",darkModel);}
-    Q_INVOKABLE QVariant getDarkMode(){return get("darkMode",QVariant(0));}
-    Q_INVOKABLE void saveVsync(bool vsync){save("vsync",vsync);}
-    Q_INVOKABLE QVariant getVsync(){return get("vsync",QVariant(true));}
+    Q_INVOKABLE int getDarkMode(){return get("darkMode",QVariant(0)).toInt();}
+    Q_INVOKABLE void saveUseSystemAppBar(bool useSystemAppBar){save("useSystemAppBar",useSystemAppBar);}
+    Q_INVOKABLE bool getUseSystemAppBar(){return get("useSystemAppBar",QVariant(false)).toBool();}
 private:
     void save(const QString& key,QVariant val);
     QVariant get(const QString& key,QVariant def={});

example/src/main.cpp

@@ -8,7 +8,9 @@
 #include <QProcess>
 #include <QtQml/qqmlextensionplugin.h>
 #include <QLoggingCategory>
+#include "Version.h"
 #include "AppInfo.h"
+#include "helper/Log.h"
 #include "src/component/CircularReveal.h"
 #include "src/component/FileWatcher.h"
 #include "src/component/FpsItem.h"
@@ -21,9 +23,37 @@ Q_IMPORT_QML_PLUGIN(FluentUIPlugin)
 #include <FluentUI.h>
 #endif
 
+#ifdef WIN32
+#include "app_dmp.h"
+#endif
+
 int main(int argc, char *argv[])
 {
-    QNetworkProxy::setApplicationProxy(QNetworkProxy::NoProxy);
+#ifdef WIN32
+    ::SetUnhandledExceptionFilter(MyUnhandledExceptionFilter);
+    qputenv("QT_QPA_PLATFORM","windows:darkmode=2");
+#endif
+#if (QT_VERSION >= QT_VERSION_CHECK(6, 0, 0))
+    qputenv("QT_QUICK_CONTROLS_STYLE","Basic");
+#else
+    qputenv("QT_QUICK_CONTROLS_STYLE","Default");
+#endif
+#ifdef Q_OS_LINUX
+    //fix bug UOSv20 does not print logs
+    qputenv("QT_LOGGING_RULES","");
+    //fix bug UOSv20 v-sync does not work
+    qputenv("QSG_RENDER_LOOP","basic");
+#endif
+    QGuiApplication::setOrganizationName("ZhuZiChu");
+    QGuiApplication::setOrganizationDomain("https://zhuzichu520.github.io");
+    QGuiApplication::setApplicationName("FluentUI");
+    QGuiApplication::setApplicationDisplayName("FluentUI Exmaple");
+    QGuiApplication::setApplicationVersion(APPLICATION_VERSION);
+    SettingsHelper::getInstance()->init(argv);
+    Log::setup("example");
+#if (QT_VERSION >= QT_VERSION_CHECK(6, 5, 0))
+    QQuickWindow::setGraphicsApi(QSGRendererInterface::OpenGL);
+#endif
 #if (QT_VERSION < QT_VERSION_CHECK(6, 0, 0))
     QGuiApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
     QGuiApplication::setAttribute(Qt::AA_UseHighDpiPixmaps);
@@ -31,29 +61,13 @@ int main(int argc, char *argv[])
     QGuiApplication::setHighDpiScaleFactorRoundingPolicy(Qt::HighDpiScaleFactorRoundingPolicy::PassThrough);
 #endif
 #endif
-    qputenv("QT_QUICK_CONTROLS_STYLE","Basic");
-    QGuiApplication::setOrganizationName("ZhuZiChu");
-    QGuiApplication::setOrganizationDomain("https://zhuzichu520.github.io");
-    QGuiApplication::setApplicationName("FluentUI");
-    SettingsHelper::getInstance()->init(argv);
-    if(SettingsHelper::getInstance()->getRender()=="software"){
-#if (QT_VERSION >= QT_VERSION_CHECK(6, 0, 0))
-        QQuickWindow::setGraphicsApi(QSGRendererInterface::Software);
-#elif (QT_VERSION >= QT_VERSION_CHECK(5, 14, 0))
-        QQuickWindow::setSceneGraphBackend(QSGRendererInterface::Software);
-#endif
-    }
     QGuiApplication app(argc, argv);
-    //    QLoggingCategory::setFilterRules(QStringLiteral("qt.scenegraph.general=true"));
-    //    qSetMessagePattern("%{category}: %{message}");
     QQmlApplicationEngine engine;
-    AppInfo::getInstance()->init(&engine);
     engine.rootContext()->setContextProperty("AppInfo",AppInfo::getInstance());
     engine.rootContext()->setContextProperty("SettingsHelper",SettingsHelper::getInstance());
 #ifdef FLUENTUI_BUILD_STATIC_LIB
     FluentUI::getInstance()->registerTypes(&engine);
 #endif
-    qDebug()<<engine.importPathList();
     qmlRegisterType<CircularReveal>("example", 1, 0, "CircularReveal");
     qmlRegisterType<FileWatcher>("example", 1, 0, "FileWatcher");
     qmlRegisterType<FpsItem>("example", 1, 0, "FpsItem");

example/src/singleton.h

@@ -2,46 +2,39 @@
 #define SINGLETON_H
 
 #include <QMutex>
-#include <QScopedPointer>
-#include <memory>
-#include <mutex>
 
 template <typename T>
 class Singleton {
 public:
     static T* getInstance();
 
-    Singleton(const Singleton& other) = delete;
-    Singleton<T>& operator=(const Singleton& other) = delete;
-
 private:
-    static std::mutex mutex;
-    static T* instance;
+    Q_DISABLE_COPY_MOVE(Singleton)
 };
 
-template <typename T>
-std::mutex Singleton<T>::mutex;
-template <typename T>
-T* Singleton<T>::instance;
 template <typename T>
 T* Singleton<T>::getInstance() {
+    static QMutex mutex;
+    QMutexLocker locker(&mutex);
+    static T* instance = nullptr;
     if (instance == nullptr) {
-        std::lock_guard<std::mutex> locker(mutex);
-        if (instance == nullptr) {
-            instance = new T();
-        }
+        instance = new T();
     }
     return instance;
 }
 
-#define SINGLETONG(Class)                              \
-private:                                               \
+#define SINGLETON(Class)                        \
+private:                                        \
     friend class Singleton<Class>;              \
-    friend struct QScopedPointerDeleter<Class>;        \
-                                                       \
-    public:                                                \
-    static Class* getInstance() {                      \
+    public:                                     \
+    static Class* getInstance() {               \
         return Singleton<Class>::getInstance(); \
 }
 
+#define HIDE_CONSTRUCTOR(Class)         \
+private:                                \
+    Class() = default;                  \
+    Class(const Class& other) = delete; \
+    Q_DISABLE_COPY_MOVE(Class);
+
 #endif // SINGLETON_H

example/src/stdafx.h

@@ -2,20 +2,36 @@
 #define STDAFX_H
 
 #define Q_PROPERTY_AUTO(TYPE, M)                                                                                       \
-  Q_PROPERTY(TYPE M MEMBER _##M NOTIFY M##Changed)                                                                     \
-public:                                                                                                                \
-  Q_SIGNAL void M##Changed();                                                                                          \
-  void M(TYPE in_##M)                                                                                                  \
-  {                                                                                                                    \
-    _##M = in_##M;                                                                                                     \
-    Q_EMIT M##Changed();                                                                                               \
-  }                                                                                                                    \
-  TYPE M()                                                                                                             \
-  {                                                                                                                    \
-    return _##M;                                                                                                       \
-  }                                                                                                                    \
-                                                                                                                       \
-private:                                                                                                               \
-  TYPE _##M;
+Q_PROPERTY(TYPE M MEMBER _##M NOTIFY M##Changed)                                                                     \
+    public:                                                                                                                \
+    Q_SIGNAL void M##Changed();                                                                                          \
+    void M(TYPE in_##M)                                                                                                  \
+{                                                                                                                    \
+        _##M = in_##M;                                                                                                     \
+        Q_EMIT M##Changed();                                                                                               \
+}                                                                                                                    \
+    TYPE M()                                                                                                             \
+{                                                                                                                    \
+        return _##M;                                                                                                       \
+}                                                                                                                    \
+    private:                                                                                                               \
+    TYPE _##M;                                                                                                           \
+
+
+#define Q_PROPERTY_READONLY_AUTO(TYPE, M)                                                                              \
+Q_PROPERTY(TYPE M READ M NOTIFY M##Changed FINAL)                                                                    \
+    public:                                                                                                                \
+    Q_SIGNAL void M##Changed();                                                                                          \
+    void M(TYPE in_##M)                                                                                                  \
+{                                                                                                                    \
+        _##M = in_##M;                                                                                                     \
+        Q_EMIT M##Changed();                                                                                               \
+}                                                                                                                    \
+    TYPE M()                                                                                                             \
+{                                                                                                                    \
+        return _##M;                                                                                                       \
+}                                                                                                                    \
+    private:                                                                                                               \
+    TYPE _##M;                                                                                                           \
 
 #endif  // STDAFX_H

src/CMakeLists.txt

@@ -1,21 +1,20 @@
 cmake_minimum_required(VERSION 3.20)
 
 if (FLUENTUI_BUILD_STATIC_LIB AND (QT_VERSION VERSION_GREATER_EQUAL "6.2"))
-    project(fluentui LANGUAGES CXX)
+    project(fluentui VERSION 1.0)
 else()
-    project(fluentuiplugin LANGUAGES CXX)
+    project(fluentuiplugin VERSION 1.0)
 endif()
 
 #配置通用编译
+set(CMAKE_CXX_STANDARD 17)
 set(CMAKE_CXX_STANDARD_REQUIRED ON)
-if(APPLE)
-    set(CMAKE_OSX_ARCHITECTURES "arm64;x86_64" CACHE STRING "" FORCE)
-endif()
 
 if (FLUENTUI_BUILD_STATIC_LIB)
     add_definitions(-DFLUENTUI_BUILD_STATIC_LIB)
 endif()
 
+#导入Qt相关依赖包
 find_package(QT NAMES Qt6 Qt5 REQUIRED COMPONENTS Core Quick Qml)
 find_package(Qt${QT_VERSION_MAJOR} REQUIRED COMPONENTS Core Quick Qml)
 
@@ -66,7 +65,6 @@ if(QT_VERSION VERSION_GREATER_EQUAL "6.2")
     endforeach()
 endif()
 
-#添加qml模块
 if (FLUENTUI_BUILD_STATIC_LIB)
     set(LIB_TYPE "STATIC")
 else()
@@ -91,6 +89,7 @@ if(WIN32)
 endif()
 
 if(QT_VERSION VERSION_GREATER_EQUAL "6.2")
+    #如果是Qt6.2版本以上，则使用qt_add_library，qt_add_qml_module函数添加资源文件
     if(FLUENTUI_BUILD_STATIC_LIB)
         set(FLUENTUI_QML_PLUGIN_DIRECTORY ${CMAKE_BINARY_DIR}/FluentUI)
     endif()
@@ -108,6 +107,7 @@ if(QT_VERSION VERSION_GREATER_EQUAL "6.2")
         RESOURCE_PREFIX "/qt/qml"
     )
 else()
+    #如果是Qt6.2版本以下，则使用add_qmlplugin函数添加资源文件，这是个自定义的函数，详情见.cmake/QmlPlugin.cmake
     include(QmlPlugin)
     add_qmlplugin(${PROJECT_NAME}
         URI "FluentUI"
@@ -120,11 +120,15 @@ else()
     )
 endif()
 
+target_compile_definitions(${PROJECT_NAME}
+    PRIVATE
+    #导入qrcode配置文件
+    HAVE_CONFIG_H
+)
 
 #去掉mingw生成的动态库libxxx前缀lib，不去掉前缀会导致 module "FluentUI" plugin "fluentuiplugin" not found
 if(MINGW)
     set_target_properties(${PROJECT_NAME} PROPERTIES PREFIX "")
-    set_target_properties(${PROJECT_NAME} PROPERTIES DEBUG_POSTFIX ".debug")
 endif()
 
 #MSVC Debug 添加后缀d，与Qt插件风格保持一致
@@ -137,9 +141,6 @@ target_link_libraries(${PROJECT_NAME} PUBLIC
     Qt${QT_VERSION_MAJOR}::CorePrivate
     Qt${QT_VERSION_MAJOR}::QuickPrivate
     Qt${QT_VERSION_MAJOR}::QmlPrivate
-    ZXing
-    FramelessHelper::Core
-    FramelessHelper::Quick
 )
 
 #安装

src/Def.h

@@ -14,7 +14,7 @@ Q_ENUM_NS(Scope)
 QML_NAMED_ELEMENT(FluViewModelType)
 }
 
-namespace FluHttpType {
+namespace FluNetworkType {
 Q_NAMESPACE
 enum CacheMode {
     NoCache = 0x0000,
@@ -23,7 +23,7 @@ enum CacheMode {
     FirstCacheThenRequest = 0x0004,
 };
 Q_ENUM_NS(CacheMode)
-QML_NAMED_ELEMENT(FluHttpType)
+QML_NAMED_ELEMENT(FluNetworkType)
 }
 
 namespace FluScreenshotType {
@@ -145,7 +145,7 @@ enum TabWidthBehavior {
 };
 Q_ENUM_NS(TabWidthBehavior)
 enum CloseButtonVisibility {
-    Nerver = 0x0000,
+    Never = 0x0000,
     Always = 0x0001,
     OnHover = 0x0002
 };

src/FluApp.cpp

@@ -8,14 +8,10 @@
 #include <QUuid>
 #include <QFontDatabase>
 #include <QClipboard>
-#include <FramelessHelper/Quick/framelessquickmodule.h>
-#include <FramelessHelper/Core/private/framelessconfig_p.h>
-
-FRAMELESSHELPER_USE_NAMESPACE
 
 FluApp::FluApp(QObject *parent):QObject{parent}{
     vsync(true);
-    httpInterceptor(nullptr);
+    useSystemAppBar(false);
 }
 
 FluApp::~FluApp(){
@@ -23,11 +19,10 @@ FluApp::~FluApp(){
 
 void FluApp::init(QObject *application){
     this->_application = application;
-    FramelessHelper::Quick::initialize();
-    FramelessConfig::instance()->set(Global::Option::DisableLazyInitializationForMicaMaterial);
-    FramelessConfig::instance()->set(Global::Option::CenterWindowBeforeShow);
-    QQmlEngine *engine = qmlEngine(_application);
-    FramelessHelper::Quick::registerTypes(engine);
+    QJSEngine * jsEngine = qjsEngine(_application);
+    std::string jsFunction = R"( (function () { console.log("FluentUI");}) )";
+    QJSValue function = jsEngine->evaluate(QString::fromStdString(jsFunction));
+    jsEngine->globalObject().setProperty("__fluentui",function);
 }
 
 void FluApp::run(){

src/FluApp.h

@@ -9,7 +9,6 @@
 #include <QJsonObject>
 #include <QQmlEngine>
 #include "FluRegister.h"
-#include "FluHttpInterceptor.h"
 #include "stdafx.h"
 #include "singleton.h"
 
@@ -22,14 +21,15 @@ class FluApp : public QObject
     Q_PROPERTY_AUTO(bool,vsync)
     Q_PROPERTY_AUTO(QString,initialRoute);
     Q_PROPERTY_AUTO(QJsonObject,routes);
-    Q_PROPERTY_AUTO(FluHttpInterceptor*,httpInterceptor);
+    Q_PROPERTY_AUTO(bool,useSystemAppBar);
+    Q_PROPERTY_AUTO(QString,windowIcon);
     QML_NAMED_ELEMENT(FluApp)
     QML_SINGLETON
 private:
     explicit FluApp(QObject *parent = nullptr);
     ~FluApp();
 public:
-    SINGLETONG(FluApp)
+    SINGLETON(FluApp)
     static FluApp *create(QQmlEngine *qmlEngine, QJSEngine *jsEngine){return getInstance();}
     Q_INVOKABLE void run();
     Q_INVOKABLE void navigate(const QString& route,const QJsonObject& argument  = {},FluRegister* fluRegister = nullptr);
@@ -39,7 +39,7 @@ public:
     void removeWindow(QQuickWindow* window);
 private:
     QMap<quint64, QQuickWindow*> _windows;
-    QObject* _application;
+    QObject* _application = nullptr;
 };
 
 #endif // FLUAPP_H

src/FluColorSet.h

@@ -2,6 +2,7 @@
 #define FLUCOLORSET_H
 
 #include <QObject>
+#include <QtQml/qqml.h>
 #include "stdafx.h"
 
 /**
@@ -17,6 +18,7 @@ class FluColorSet : public QObject
     Q_PROPERTY_AUTO(QString,light)
     Q_PROPERTY_AUTO(QString,lighter)
     Q_PROPERTY_AUTO(QString,lightest)
+    QML_NAMED_ELEMENT(FluColorSet)
 public:
     explicit FluColorSet(QObject *parent = nullptr);
 };

src/FluColors.cpp

@@ -27,7 +27,7 @@ FluColors::FluColors(QObject *parent):QObject{parent}{
     Grey210("#161514");
     Grey220("#11100f");
 
-    FluColorSet *yellow = new FluColorSet();
+    FluColorSet *yellow = new FluColorSet(this);
     yellow->darkest("#f9a825");
     yellow->darker("#fbc02d");
     yellow->dark("#fdd435");
@@ -37,7 +37,7 @@ FluColors::FluColors(QObject *parent):QObject{parent}{
     yellow->lightest("#fff59b");
     Yellow(yellow);
 
-    FluColorSet *orange = new FluColorSet();
+    FluColorSet *orange = new FluColorSet(this);
     orange->darkest("#993d07");
     orange->darker("#ac4408");
     orange->dark("#d1580a");
@@ -47,7 +47,7 @@ FluColors::FluColors(QObject *parent):QObject{parent}{
     orange->lightest("#fac06a");
     Orange(orange);
 
-    FluColorSet *red = new FluColorSet();
+    FluColorSet *red = new FluColorSet(this);
     red->darkest("#8f0a15");
     red->darker("#a20b18");
     red->dark("#b90d1c");
@@ -57,7 +57,7 @@ FluColors::FluColors(QObject *parent):QObject{parent}{
     red->lightest("#f06b76");
     Red(red);
 
-    FluColorSet *magenta = new FluColorSet();
+    FluColorSet *magenta = new FluColorSet(this);
     magenta->darkest("#6f004f");
     magenta->darker("#a0076c");
     magenta->dark("#b50d7d");
@@ -67,7 +67,7 @@ FluColors::FluColors(QObject *parent):QObject{parent}{
     magenta->lightest("#f18cd5");
     Magenta(magenta);
 
-    FluColorSet *purple = new FluColorSet();
+    FluColorSet *purple = new FluColorSet(this);
     purple->darkest("#2c0f76");
     purple->darker("#3d0f99");
     purple->dark("#4e11ae");
@@ -77,7 +77,7 @@ FluColors::FluColors(QObject *parent):QObject{parent}{
     purple->lightest("#9e8ed9");
     Purple(purple);
 
-    FluColorSet *blue = new FluColorSet();
+    FluColorSet *blue = new FluColorSet(this);
     blue->darkest("#004A83");
     blue->darker("#005494");
     blue->dark("#0066B4");
@@ -87,7 +87,7 @@ FluColors::FluColors(QObject *parent):QObject{parent}{
     blue->lightest("#60ABE4");
     Blue(blue);
 
-    FluColorSet *teal = new FluColorSet();
+    FluColorSet *teal = new FluColorSet(this);
     teal->darkest("#006E5B");
     teal->darker("#007C67");
     teal->dark("#00977D");
@@ -97,7 +97,7 @@ FluColors::FluColors(QObject *parent):QObject{parent}{
     teal->lightest("#60CFBC");
     Teal(teal);
 
-    FluColorSet *green = new FluColorSet();
+    FluColorSet *green = new FluColorSet(this);
     green->darkest("#094C09");
     green->darker("#0C5D0C");
     green->dark("#0E6F0E");

src/FluColors.h

@@ -51,7 +51,7 @@ class FluColors : public QObject
 private:
     explicit FluColors(QObject *parent = nullptr);
 public:
-    SINGLETONG(FluColors)
+    SINGLETON(FluColors)
     static FluColors *create(QQmlEngine *qmlEngine, QJSEngine *jsEngine){return getInstance();}
 };
 

src/FluEventBus.h

@@ -23,7 +23,7 @@ class FluEventBus : public QObject
 private:
     explicit FluEventBus(QObject *parent = nullptr);
 public:
-    SINGLETONG(FluEventBus)
+    SINGLETON(FluEventBus)
     static FluEventBus *create(QQmlEngine *qmlEngine, QJSEngine *jsEngine){return getInstance();}
     Q_INVOKABLE void registerEvent(FluEvent* event);
     Q_INVOKABLE void unRegisterEvent(FluEvent* event);

src/FluFramelessHelper.cpp

@@ -0,0 +1,388 @@
+#include "FluFramelessHelper.h"
+
+#include <QGuiApplication>
+#include <QScreen>
+#include "FluTools.h"
+
+#ifdef Q_OS_WIN
+#pragma comment (lib,"user32.lib")
+#pragma comment (lib,"dwmapi.lib")
+#include <windows.h>
+#include <windowsx.h>
+#include <dwmapi.h>
+
+static inline QByteArray qtNativeEventType()
+{
+    static const auto result = "windows_generic_MSG";
+    return result;
+}
+
+static inline bool isCompositionEnabled(){
+    typedef HRESULT (WINAPI* DwmIsCompositionEnabledPtr)(BOOL *pfEnabled);
+    HMODULE module = LoadLibraryW(L"dwmapi.dll");
+    if (module)
+    {
+        BOOL composition_enabled = false;
+        DwmIsCompositionEnabledPtr dwm_is_composition_enabled;
+        dwm_is_composition_enabled= reinterpret_cast<DwmIsCompositionEnabledPtr>(GetProcAddress(module, "DwmIsCompositionEnabled"));
+        if (dwm_is_composition_enabled)
+        {
+            dwm_is_composition_enabled(&composition_enabled);
+        }
+        return composition_enabled;
+    }
+    return false;
+}
+#endif
+
+FramelessEventFilter::FramelessEventFilter(FluFramelessHelper* helper){
+    _helper = helper;
+    _current = _helper->window->winId();
+}
+
+bool FramelessEventFilter::nativeEventFilter(const QByteArray &eventType, void *message, QT_NATIVE_EVENT_RESULT_TYPE *result){
+#ifdef Q_OS_WIN
+    if ((eventType != qtNativeEventType()) || !message || _helper.isNull() || _helper->window.isNull()) {
+        return false;
+    }
+    const auto msg = static_cast<const MSG *>(message);
+    const HWND hwnd = msg->hwnd;
+    if (!hwnd || !msg) {
+        return false;
+    }
+    const qint64 wid = reinterpret_cast<qint64>(hwnd);
+    if(wid != _current){
+        return false;
+    }
+    const UINT uMsg = msg->message;
+    const WPARAM wParam = msg->wParam;
+    const LPARAM lParam = msg->lParam;
+    static QPoint offsetXY;
+    if(uMsg == WM_WINDOWPOSCHANGING){
+        WINDOWPOS* wp = reinterpret_cast<WINDOWPOS*>(lParam);
+        if (wp != nullptr && (wp->flags & SWP_NOSIZE) == 0)
+        {
+            wp->flags |= SWP_NOCOPYBITS;
+            *result = DefWindowProcW(hwnd, uMsg, wParam, lParam);
+            return true;
+        }
+        return false;
+    }else if(uMsg == WM_NCCALCSIZE){
+        const auto clientRect = ((wParam == FALSE) ? reinterpret_cast<LPRECT>(lParam) : &(reinterpret_cast<LPNCCALCSIZE_PARAMS>(lParam))->rgrc[0]);
+        const LONG originalTop = clientRect->top;
+        const LONG originalLeft = clientRect->left;
+#if QT_VERSION < QT_VERSION_CHECK(6,0,0)
+        const LONG originalRight = clientRect->right;
+        const LONG originalBottom = clientRect->bottom;
+#endif
+        const LRESULT hitTestResult = ::DefWindowProcW(hwnd, WM_NCCALCSIZE, wParam, lParam);
+        if ((hitTestResult != HTERROR) && (hitTestResult != HTNOWHERE)) {
+            *result = hitTestResult;
+            return true;
+        }
+        int offsetSize = 0;
+        bool isMaximum = IsZoomed(hwnd);
+        offsetXY = QPoint(abs(clientRect->left - originalLeft),abs(clientRect->top - originalTop));
+        if(isMaximum || _helper->window->visibility() == QWindow::FullScreen){
+            _helper->setOriginalPos(QPoint(originalLeft,originalTop));
+            offsetSize = 0;
+        }else{
+            _helper->setOriginalPos({});
+            offsetSize = 1;
+        }
+        if(!isCompositionEnabled()){
+            offsetSize = 0;
+        }
+        clientRect->top = originalTop+offsetSize;
+#if QT_VERSION < QT_VERSION_CHECK(6,0,0)
+        if(!isMaximum){
+            clientRect->bottom = originalBottom-offsetSize;
+            clientRect->left = originalLeft+offsetSize;
+            clientRect->right = originalRight-offsetSize;
+        }
+#endif
+        *result = WVR_REDRAW;
+        return true;
+    }if(uMsg == WM_NCHITTEST){
+        if(FluTools::getInstance()->isWindows11OrGreater() && _helper->hoverMaxBtn() && _helper->resizeable()){
+            if (*result == HTNOWHERE) {
+                *result = HTZOOM;
+            }
+            return true;
+        }
+        *result = HTCLIENT;
+        return true;
+    }else if(uMsg == WM_NCLBUTTONDBLCLK || uMsg == WM_NCLBUTTONDOWN){
+        if(FluTools::getInstance()->isWindows11OrGreater() && _helper->hoverMaxBtn() && _helper->resizeable()){
+            QMouseEvent event = QMouseEvent(QEvent::MouseButtonPress, QPoint(), QPoint(), Qt::LeftButton, Qt::LeftButton, Qt::NoModifier);
+            QGuiApplication::sendEvent(_helper->maximizeButton(),&event);
+            return true;
+        }
+        return false;
+    }else if(uMsg == WM_NCLBUTTONUP || uMsg == WM_NCRBUTTONUP){
+        if(FluTools::getInstance()->isWindows11OrGreater() && _helper->hoverMaxBtn() && _helper->resizeable()){
+            QMouseEvent event = QMouseEvent(QEvent::MouseButtonRelease, QPoint(), QPoint(), Qt::LeftButton, Qt::LeftButton, Qt::NoModifier);
+            QGuiApplication::sendEvent(_helper->maximizeButton(),&event);
+        }
+        return false;
+    }else if(uMsg == WM_NCPAINT){
+        *result = FALSE;
+        return true;
+    }else if(uMsg == WM_NCACTIVATE){
+        *result = DefWindowProcW(hwnd, WM_NCACTIVATE, wParam, -1);
+        return true;
+    }else if(uMsg == WM_GETMINMAXINFO){
+#if QT_VERSION < QT_VERSION_CHECK(6,0,0)
+        MINMAXINFO* minmaxInfo = reinterpret_cast<MINMAXINFO *>(lParam);
+        auto pixelRatio = _helper->window->devicePixelRatio();
+        auto geometry = _helper->window->screen()->availableGeometry();
+        minmaxInfo->ptMaxSize.x = geometry.width()*pixelRatio + offsetXY.x()*2;
+        minmaxInfo->ptMaxSize.y = geometry.height()*pixelRatio + offsetXY.y()*2;
+#endif
+        return false;
+    }
+    return false;
+#endif
+    return false;
+}
+
+FluFramelessHelper::FluFramelessHelper(QObject *parent)
+    : QObject{parent}
+{
+
+}
+
+void FluFramelessHelper::classBegin(){
+}
+
+void FluFramelessHelper::_updateCursor(int edges){
+    switch (edges) {
+    case 0:
+        window->setCursor(Qt::ArrowCursor);
+        break;
+    case Qt::LeftEdge:
+    case Qt::RightEdge:
+        window->setCursor(Qt::SizeHorCursor);
+        break;
+    case Qt::TopEdge:
+    case Qt::BottomEdge:
+        window->setCursor(Qt::SizeVerCursor);
+        break;
+    case Qt::LeftEdge | Qt::TopEdge:
+    case Qt::RightEdge | Qt::BottomEdge:
+        window->setCursor(Qt::SizeFDiagCursor);
+        break;
+    case Qt::RightEdge | Qt::TopEdge:
+    case Qt::LeftEdge | Qt::BottomEdge:
+        window->setCursor(Qt::SizeBDiagCursor);
+        break;
+    }
+}
+
+bool FluFramelessHelper::eventFilter(QObject *obj, QEvent *ev){
+    if (!window.isNull() && window->flags()) {
+        static int margin = 8;
+        switch (ev->type()) {
+        case QEvent::MouseButtonPress:
+            if(_edges!=0){
+                QMouseEvent *event = static_cast<QMouseEvent*>(ev);
+                if(event->button() == Qt::LeftButton){
+                    _updateCursor(_edges);
+                    window->startSystemResize(Qt::Edges(_edges));
+                }
+            }
+            break;
+        case QEvent::MouseButtonRelease:
+            _edges = 0;
+            _updateCursor(_edges);
+            break;
+        case QEvent::MouseMove: {
+            if(_maximized() || _fullScreen()){
+                break;
+            }
+            if(!resizeable()){
+                break;
+            }
+            QMouseEvent *event = static_cast<QMouseEvent*>(ev);
+            QPoint p =
+#if QT_VERSION < QT_VERSION_CHECK(6,0,0)
+                event->pos();
+#else
+                event->position().toPoint();
+#endif
+            if(p.x() >= margin && p.x() <= (window->width() - margin) && p.y() >= margin && p.y() <= (window->height() - margin)){
+                if(_edges != 0){
+                    _edges = 0;
+                    _updateCursor(_edges);
+                }
+                break;
+            }
+            _edges = 0;
+            if ( p.x() < margin ) {
+                _edges |= Qt::LeftEdge;
+            }
+            if ( p.x() > (window->width() - margin) ) {
+                _edges |= Qt::RightEdge;
+            }
+            if ( p.y() < margin ) {
+                _edges |= Qt::TopEdge;
+            }
+            if ( p.y() > (window->height() - margin) ) {
+                _edges |= Qt::BottomEdge;
+            }
+            _updateCursor(_edges);
+            break;
+        }
+        default:
+            break;
+        }
+    }
+    return QObject::eventFilter(obj, ev);
+}
+
+void FluFramelessHelper::componentComplete(){
+    auto o = parent();
+    while (nullptr != o) {
+        window = (QQuickWindow*)o;
+        o = o->parent();
+    }
+    if(!window.isNull()){
+        _stayTop = QQmlProperty(window,"stayTop");
+        _screen = QQmlProperty(window,"screen");
+        _fixSize = QQmlProperty(window,"fixSize");
+        _originalPos = QQmlProperty(window,"_originalPos");
+        _realHeight = QQmlProperty(window,"_realHeight");
+        _realWidth = QQmlProperty(window,"_realWidth");
+        _appBarHeight = QQmlProperty(window,"_appBarHeight");
+#ifdef Q_OS_WIN
+        window->setFlag(Qt::CustomizeWindowHint,true);
+        _nativeEvent =new FramelessEventFilter(this);
+        qApp->installNativeEventFilter(_nativeEvent);
+        HWND hwnd = reinterpret_cast<HWND>(window->winId());
+        DWORD style = ::GetWindowLong(hwnd, GWL_STYLE);
+        if(resizeable()){
+            SetWindowLongPtr(hwnd, GWL_STYLE, style | WS_MAXIMIZEBOX | WS_THICKFRAME);
+        }else{
+            SetWindowLongPtr(hwnd, GWL_STYLE, style | WS_THICKFRAME);
+        }
+        SetWindowPos(hwnd,nullptr,0,0,0,0,SWP_NOZORDER | SWP_NOOWNERZORDER | SWP_NOMOVE | SWP_NOSIZE | SWP_FRAMECHANGED);
+#else
+        window->setFlags((window->flags() & (~Qt::WindowMinMaxButtonsHint) & (~Qt::Dialog)) | Qt::FramelessWindowHint | Qt::Window);
+#endif
+        int w = _realWidth.read().toInt();
+        int h = _realHeight.read().toInt()+_appBarHeight.read().toInt();
+        if(!resizeable()){
+            window->setMaximumSize(QSize(w,h));
+            window->setMinimumSize(QSize(w,h));
+        }
+        window->setWidth(w);
+        window->setHeight(h);
+        _onStayTopChange();
+        _stayTop.connectNotifySignal(this,SLOT(_onStayTopChange()));
+        _screen.connectNotifySignal(this,SLOT(_onScreenChanged()));
+        window->installEventFilter(this);
+        Q_EMIT loadCompleted();
+    }
+}
+
+void FluFramelessHelper::_onScreenChanged(){
+#ifdef Q_OS_WIN
+    HWND hwnd = reinterpret_cast<HWND>(window->winId());
+    SetWindowPos(hwnd,0,0,0,0,0,SWP_NOMOVE | SWP_NOSIZE | SWP_NOZORDER | SWP_FRAMECHANGED | SWP_NOOWNERZORDER);
+    RedrawWindow(hwnd, NULL, NULL, RDW_INVALIDATE | RDW_UPDATENOW);
+#endif
+}
+
+void FluFramelessHelper::showSystemMenu(){
+#ifdef Q_OS_WIN
+    QPoint point = QCursor::pos();
+    HWND hwnd = reinterpret_cast<HWND>(window->winId());
+    DWORD style = GetWindowLongPtr(hwnd,GWL_STYLE);
+    SetWindowLongPtr(hwnd, GWL_STYLE, style | WS_SYSMENU);
+    const HMENU hMenu = ::GetSystemMenu(hwnd, FALSE);
+    DeleteMenu(hMenu, SC_MOVE, MF_BYCOMMAND);
+    DeleteMenu(hMenu, SC_SIZE, MF_BYCOMMAND);
+    if(_maximized() || _fullScreen()){
+        EnableMenuItem(hMenu,SC_RESTORE,MFS_ENABLED);
+    }else{
+        EnableMenuItem(hMenu,SC_RESTORE,MFS_DISABLED);
+    }
+    if(resizeable() && !_maximized() && !_fullScreen()){
+        EnableMenuItem(hMenu,SC_MAXIMIZE,MFS_ENABLED);
+    }else{
+        EnableMenuItem(hMenu,SC_MAXIMIZE,MFS_DISABLED);
+    }
+    const int result = TrackPopupMenu(hMenu, (TPM_RETURNCMD | (QGuiApplication::isRightToLeft() ? TPM_RIGHTALIGN : TPM_LEFTALIGN)), point.x()*window->devicePixelRatio(), point.y()*window->devicePixelRatio(), 0, hwnd, nullptr);
+    if (result != FALSE) {
+        PostMessageW(hwnd, WM_SYSCOMMAND, result, 0);
+    }
+    SetWindowLongPtr(hwnd, GWL_STYLE, style &~ WS_SYSMENU);
+#endif
+}
+
+void FluFramelessHelper::_onStayTopChange(){
+    bool isStayTop = _stayTop.read().toBool();
+#ifdef Q_OS_WIN
+    HWND hwnd = reinterpret_cast<HWND>(window->winId());
+    if(isStayTop){
+        SetWindowPos(hwnd, HWND_TOPMOST, 0, 0, 0, 0, SWP_NOMOVE | SWP_NOSIZE);
+    }else{
+        SetWindowPos(hwnd, HWND_NOTOPMOST, 0, 0, 0, 0, SWP_NOMOVE | SWP_NOSIZE);
+    }
+#else
+    window->setFlag(Qt::WindowStaysOnTopHint,isStayTop);
+#endif
+}
+
+FluFramelessHelper::~FluFramelessHelper(){
+    if (!window.isNull()) {
+        window->setFlags(Qt::Window);
+#ifdef Q_OS_WIN
+        qApp->removeNativeEventFilter(_nativeEvent);
+        delete _nativeEvent;
+#endif
+        window->removeEventFilter(this);
+    }
+}
+
+bool FluFramelessHelper::hoverMaxBtn(){
+    QVariant appBar = window->property("appBar");
+    if(appBar.isNull()){
+        return false;
+    }
+    QVariant var;
+    QMetaObject::invokeMethod(appBar.value<QObject*>(), "maximizeButtonHover",Q_RETURN_ARG(QVariant, var));
+    if(var.isNull()){
+        return false;
+    }
+    return var.toBool();
+}
+
+QObject* FluFramelessHelper::maximizeButton(){
+    QVariant appBar = window->property("appBar");
+    if(appBar.isNull()){
+        return nullptr;
+    }
+    QVariant var;
+    QMetaObject::invokeMethod(appBar.value<QObject*>(), "maximizeButton",Q_RETURN_ARG(QVariant, var));
+    if(var.isNull()){
+        return nullptr;
+    }
+    return var.value<QObject*>();
+}
+
+void FluFramelessHelper::setOriginalPos(QVariant pos){
+    _originalPos.write(pos);
+}
+
+bool FluFramelessHelper::resizeable(){
+    return !_fixSize.read().toBool();
+}
+
+bool FluFramelessHelper::_maximized(){
+    return window->visibility() == QWindow::Maximized;
+}
+
+bool FluFramelessHelper::_fullScreen(){
+    return window->visibility() == QWindow::FullScreen;
+}

src/FluFramelessHelper.h

@@ -0,0 +1,67 @@
+#ifndef FLUFRAMELESSHELPER_H
+#define FLUFRAMELESSHELPER_H
+
+#include <QObject>
+#include <QQuickWindow>
+#include <QtQml/qqml.h>
+#include <QAbstractNativeEventFilter>
+#include <QQmlProperty>
+
+#if (QT_VERSION >= QT_VERSION_CHECK(6, 0, 0))
+using QT_NATIVE_EVENT_RESULT_TYPE = qintptr;
+using QT_ENTER_EVENT_TYPE = QEnterEvent;
+#else
+using QT_NATIVE_EVENT_RESULT_TYPE = long;
+using QT_ENTER_EVENT_TYPE = QEvent;
+#endif
+
+class FluFramelessHelper;
+
+class FramelessEventFilter : public QAbstractNativeEventFilter
+{
+public:
+    FramelessEventFilter(FluFramelessHelper* helper);
+    bool nativeEventFilter(const QByteArray &eventType, void *message, QT_NATIVE_EVENT_RESULT_TYPE *result) override;
+public:
+    QPointer<FluFramelessHelper> _helper = nullptr;
+    qint64 _current = 0;
+};
+
+class FluFramelessHelper : public QObject, public QQmlParserStatus
+{
+    Q_OBJECT
+    QML_NAMED_ELEMENT(FluFramelessHelper)
+public:
+    explicit FluFramelessHelper(QObject *parent = nullptr);
+    ~FluFramelessHelper();
+    void classBegin() override;
+    void componentComplete() override;
+    bool hoverMaxBtn();
+    bool resizeable();
+    QObject* maximizeButton();
+    void setOriginalPos(QVariant pos);
+    Q_INVOKABLE void showSystemMenu();
+    Q_SIGNAL void loadCompleted();
+protected:
+    bool eventFilter(QObject *obj, QEvent *event) override;
+private:
+    void _updateCursor(int edges);
+    bool _maximized();
+    bool _fullScreen();
+    Q_SLOT void _onStayTopChange();
+    Q_SLOT void _onScreenChanged();
+public:
+    QPointer<QQuickWindow> window = nullptr;
+private:
+    FramelessEventFilter* _nativeEvent = nullptr;
+    QQmlProperty _stayTop;
+    QQmlProperty _screen;
+    QQmlProperty _originalPos;
+    QQmlProperty _fixSize;
+    QQmlProperty _realHeight;
+    QQmlProperty _realWidth;
+    QQmlProperty _appBarHeight;
+    int _edges = 0;
+};
+
+#endif // FLUFRAMELESSHELPER_H

src/FluHttp.cpp

@@ -1,681 +0,0 @@
-#include "FluHttp.h"
-
-#include <QThreadPool>
-#include <QEventLoop>
-#include <QNetworkReply>
-#include <QUrlQuery>
-#include <QHttpMultiPart>
-#include <QGuiApplication>
-#include <QJsonDocument>
-#include <QStandardPaths>
-#include <QTextStream>
-#include <QDir>
-#include "Def.h"
-#include "FluApp.h"
-#include "FluTools.h"
-
-HttpRequest::HttpRequest(QObject *parent):QObject{parent}{
-}
-
-QMap<QString, QVariant> HttpRequest::toMap(){
-    QVariant _params;
-    bool isPostString = method() == "postString";
-    if(params().isNull()){
-        if(isPostString){
-            _params = "";
-        }else{
-            _params = QMap<QString,QVariant>();
-        }
-    }else{
-        _params = params();
-    }
-    QVariant _headers;
-    if(headers().isNull()){
-        _headers = QMap<QString,QVariant>();
-    }else{
-        _headers = headers();
-    }
-    QMap<QString, QVariant> request = {
-        {"url",url()},
-        {"headers",_headers.toMap()},
-        {"method",method()},
-        {"downloadSavePath",downloadSavePath()}
-    };
-    if(isPostString){
-        request.insert("params",_params.toString());
-    }else{
-        request.insert("params",_params.toMap());
-    }
-    return request;
-}
-
-QString HttpRequest::httpId(){
-    return FluTools::getInstance()->sha256(QJsonDocument::fromVariant(QVariant(toMap())).toJson(QJsonDocument::Compact));
-}
-
-HttpCallable::HttpCallable(QObject *parent):QObject{parent}{
-}
-
-FluHttp::FluHttp(QObject *parent):QObject{parent}{
-    retry(3);
-    timeout(15000);
-    cacheMode(FluHttpType::CacheMode::NoCache);
-    cacheDir(QStandardPaths::writableLocation(QStandardPaths::CacheLocation)+"/httpcache");
-    breakPointDownload(false);
-}
-
-FluHttp::~FluHttp(){
-    cancel();
-}
-
-void FluHttp::cancel(){
-    foreach (QPointer<QNetworkReply> item, _cacheReply) {
-        if(item){
-            item->abort();
-        }
-    }
-}
-
-void FluHttp::post(HttpRequest* r,HttpCallable* c){
-    auto request = QPointer(r);
-    auto callable = QPointer(c);
-    request->method("post");
-    auto requestMap = request->toMap();
-    auto httpId = request->httpId();
-    QMap<QString, QVariant> data = invokeIntercept(requestMap).toMap();
-    QThreadPool::globalInstance()->start([=](){
-        onStart(callable);
-        if(_cacheMode == FluHttpType::CacheMode::IfNoneCacheRequest && cacheExists(httpId)){
-            onCache(callable,readCache(httpId));
-            onFinish(callable,request);
-            return;
-        }
-        if(_cacheMode == FluHttpType::CacheMode::FirstCacheThenRequest && cacheExists(httpId)){
-            onCache(callable,readCache(httpId));
-        }
-        QNetworkAccessManager manager;
-        manager.setTransferTimeout(timeout());
-        for (int i = 0; i < retry(); ++i) {
-            QUrl url(request->url());
-            QNetworkRequest req(url);
-            addHeaders(&req,data["headers"].toMap());
-            QHttpMultiPart multiPart(QHttpMultiPart::FormDataType);
-            for (const auto& each : data["params"].toMap().toStdMap())
-            {
-                const QString& key = each.first;
-                const QString& value = each.second.toString();
-                QString dispositionHeader = QString("form-data; name=\"%1\"").arg(key);
-                QHttpPart part;
-                part.setHeader(QNetworkRequest::ContentDispositionHeader, dispositionHeader);
-                part.setBody(value.toUtf8());
-                multiPart.append(part);
-            }
-            QNetworkReply* reply = manager.post(req,&multiPart);
-            if(!QPointer(qApp)){
-                reply->deleteLater();
-                reply = nullptr;
-                return;
-            }
-            _cacheReply.append(reply);
-            QEventLoop loop;
-            connect(&manager,&QNetworkAccessManager::finished,&manager,[&loop](QNetworkReply *reply){loop.quit();});
-            connect(qApp,&QGuiApplication::aboutToQuit,&manager, [&loop,reply](){reply->abort(),loop.quit();});
-            loop.exec();
-            QString result = QString::fromUtf8(reply->readAll());
-            int status = reply->attribute(QNetworkRequest::HttpStatusCodeAttribute).toInt();
-            QString errorString = reply->errorString();
-            QNetworkReply::NetworkError error = reply->error();
-            bool isSuccess = error == QNetworkReply::NoError;
-            reply->deleteLater();
-            reply = nullptr;
-            if (isSuccess) {
-                handleCache(httpId,result);
-                onSuccess(callable,result);
-                break;
-            }else{
-                if(i == retry()-1){
-                    if(_cacheMode == FluHttpType::CacheMode::RequestFailedReadCache && cacheExists(httpId)){
-                        onCache(callable,readCache(httpId));
-                    }
-                    onError(callable,status,errorString,result);
-                }
-            }
-            if(error == QNetworkReply::OperationCanceledError){
-                break;
-            }
-        }
-        onFinish(callable,request);
-    });
-}
-
-void FluHttp::postString(HttpRequest* r,HttpCallable* c){
-    auto request = QPointer(r);
-    auto callable = QPointer(c);
-    request->method("postString");
-    auto requestMap = request->toMap();
-    auto httpId = request->httpId();
-    QString params = request->params().toString();
-    QMap<QString, QVariant> data = invokeIntercept(requestMap).toMap();
-    QThreadPool::globalInstance()->start([=](){
-        onStart(callable);
-        if(_cacheMode == FluHttpType::CacheMode::IfNoneCacheRequest && cacheExists(httpId)){
-            onCache(callable,readCache(httpId));
-            onFinish(callable,request);
-            return;
-        }
-        if(_cacheMode == FluHttpType::CacheMode::FirstCacheThenRequest && cacheExists(httpId)){
-            onCache(callable,readCache(httpId));
-        }
-        QNetworkAccessManager manager;
-        manager.setTransferTimeout(timeout());
-        for (int i = 0; i < retry(); ++i) {
-            QUrl url(request->url());
-            QNetworkRequest req(url);
-            addHeaders(&req,data["headers"].toMap());
-            QString contentType = QString("text/plain;charset=utf-8");
-            req.setHeader(QNetworkRequest::ContentTypeHeader, contentType);
-            QNetworkReply* reply = manager.post(req,params.toUtf8());
-            if(!QPointer(qApp)){
-                reply->deleteLater();
-                reply = nullptr;
-                return;
-            }
-            _cacheReply.append(reply);
-            QEventLoop loop;
-            connect(&manager,&QNetworkAccessManager::finished,&manager,[&loop](QNetworkReply *reply){loop.quit();});
-            connect(qApp,&QGuiApplication::aboutToQuit,&manager, [&loop,reply](){reply->abort(),loop.quit();});
-            loop.exec();
-            QString result = QString::fromUtf8(reply->readAll());
-            int status = reply->attribute(QNetworkRequest::HttpStatusCodeAttribute).toInt();
-            QString errorString = reply->errorString();
-            QNetworkReply::NetworkError error = reply->error();
-            bool isSuccess = error == QNetworkReply::NoError;
-            reply->deleteLater();
-            reply = nullptr;
-            if (isSuccess) {
-                handleCache(httpId,result);
-                onSuccess(callable,result);
-                break;
-            }else{
-                if(i == retry()-1){
-                    if(_cacheMode == FluHttpType::CacheMode::RequestFailedReadCache && cacheExists(httpId)){
-                        onCache(callable,readCache(httpId));
-                    }
-                    onError(callable,status,errorString,result);
-                }
-            }
-            if(error == QNetworkReply::OperationCanceledError){
-                break;
-            }
-        }
-        onFinish(callable,request);
-    });
-}
-
-void FluHttp::postJson(HttpRequest* r,HttpCallable* c){
-    auto request = QPointer(r);
-    auto callable = QPointer(c);
-    request->method("postJson");
-    auto requestMap = request->toMap();
-    auto httpId = request->httpId();
-    QMap<QString, QVariant> data = invokeIntercept(requestMap).toMap();
-    QThreadPool::globalInstance()->start([=](){
-        onStart(callable);
-        if(_cacheMode == FluHttpType::CacheMode::IfNoneCacheRequest && cacheExists(httpId)){
-            onCache(callable,readCache(httpId));
-            onFinish(callable,request);
-            return;
-        }
-        if(_cacheMode == FluHttpType::CacheMode::FirstCacheThenRequest && cacheExists(httpId)){
-            onCache(callable,readCache(httpId));
-        }
-        QNetworkAccessManager manager;
-        manager.setTransferTimeout(timeout());
-        for (int i = 0; i < retry(); ++i) {
-            QUrl url(request->url());
-            QNetworkRequest req(url);
-            addHeaders(&req,data["headers"].toMap());
-            QString contentType = QString("application/json;charset=utf-8");
-            req.setHeader(QNetworkRequest::ContentTypeHeader, contentType);
-            QNetworkReply* reply = manager.post(req,QJsonDocument::fromVariant(data["params"]).toJson());
-            if(!QPointer(qApp)){
-                reply->deleteLater();
-                reply = nullptr;
-                return;
-            }
-            _cacheReply.append(reply);
-            QEventLoop loop;
-            connect(&manager,&QNetworkAccessManager::finished,&manager,[&loop](QNetworkReply *reply){loop.quit();});
-            connect(qApp,&QGuiApplication::aboutToQuit,&manager, [&loop,reply](){reply->abort(),loop.quit();});
-            loop.exec();
-            QString result = QString::fromUtf8(reply->readAll());
-            int status = reply->attribute(QNetworkRequest::HttpStatusCodeAttribute).toInt();
-            QString errorString = reply->errorString();
-            QNetworkReply::NetworkError error = reply->error();
-            bool isSuccess = error == QNetworkReply::NoError;
-            reply->deleteLater();
-            reply = nullptr;
-            if (isSuccess) {
-                handleCache(httpId,result);
-                onSuccess(callable,result);
-                break;
-            }else{
-                if(i == retry()-1){
-                    if(_cacheMode == FluHttpType::CacheMode::RequestFailedReadCache && cacheExists(httpId)){
-                        onCache(callable,readCache(httpId));
-                    }
-                    onError(callable,status,errorString,result);
-                }
-            }
-            if(error == QNetworkReply::OperationCanceledError){
-                break;
-            }
-        }
-        onFinish(callable,request);
-    });
-}
-
-void FluHttp::get(HttpRequest* r,HttpCallable* c){
-    auto request = QPointer(r);
-    auto callable = QPointer(c);
-    request->method("get");
-    auto requestMap = request->toMap();
-    auto httpId = request->httpId();
-    QMap<QString, QVariant> data = invokeIntercept(requestMap).toMap();
-    QThreadPool::globalInstance()->start([=](){
-        onStart(callable);
-        if(_cacheMode == FluHttpType::CacheMode::FirstCacheThenRequest && cacheExists(httpId)){
-            onCache(callable,readCache(httpId));
-        }
-        if(_cacheMode == FluHttpType::CacheMode::IfNoneCacheRequest && cacheExists(httpId)){
-            onCache(callable,readCache(httpId));
-            onFinish(callable,request);
-            return;
-        }
-        QNetworkAccessManager manager;
-        manager.setTransferTimeout(timeout());
-        for (int i = 0; i < retry(); ++i) {
-            QUrl url(request->url());
-            addQueryParam(&url,data["params"].toMap());
-            QNetworkRequest req(url);
-            addHeaders(&req,data["headers"].toMap());
-            QNetworkReply* reply  = manager.get(req);
-            if(!QPointer(qApp)){
-                reply->deleteLater();
-                reply = nullptr;
-                return;
-            }
-            _cacheReply.append(reply);
-            QEventLoop loop;
-            connect(&manager,&QNetworkAccessManager::finished,&manager,[&loop](QNetworkReply *reply){loop.quit();});
-            connect(qApp,&QGuiApplication::aboutToQuit,&manager, [&loop,reply](){reply->abort(),loop.quit();});
-            loop.exec();
-            int status = reply->attribute(QNetworkRequest::HttpStatusCodeAttribute).toInt();
-            QString errorString = reply->errorString();
-            QNetworkReply::NetworkError error = reply->error();
-            bool isSuccess = error == QNetworkReply::NoError;
-            QString result = QString::fromUtf8(reply->readAll());
-            if (isSuccess) {
-                handleCache(httpId,result);
-                onSuccess(callable,result);
-                break;
-            }else{
-                if(i == retry()-1){
-                    if(_cacheMode == FluHttpType::CacheMode::RequestFailedReadCache && cacheExists(httpId)){
-                        onCache(callable,readCache(httpId));
-                    }
-                    onError(callable,status,errorString,result);
-                }
-            }
-            reply->deleteLater();
-            reply = nullptr;
-            if(error == QNetworkReply::OperationCanceledError){
-                break;
-            }
-        }
-        onFinish(callable,request);
-    });
-}
-
-void FluHttp::download(HttpRequest* r,HttpCallable* c){
-    auto request = QPointer(r);
-    auto callable = QPointer(c);
-    request->method("download");
-    auto requestMap = request->toMap();
-    auto httpId = request->httpId();
-    auto savePath = request->downloadSavePath();
-    QMap<QString, QVariant> data = invokeIntercept(requestMap).toMap();
-    QThreadPool::globalInstance()->start([=](){
-        onStart(callable);
-        QNetworkAccessManager manager;
-        QUrl url(request->url());
-        addQueryParam(&url,data["params"].toMap());
-        QNetworkRequest req(url);
-        addHeaders(&req,data["headers"].toMap());
-        QSharedPointer<QFile> file(new QFile(savePath));
-        QDir dir = QFileInfo(savePath).path();
-        if (!dir.exists(dir.path())){
-            dir.mkpath(dir.path());
-        }
-        qint64 seek = 0;
-        auto filePath = getCacheFilePath(httpId);
-        QSharedPointer<QFile> fileCache(new QFile(filePath));
-        if(fileCache->exists() && file->exists() && _breakPointDownload){
-            QJsonObject cacheInfo = QJsonDocument::fromJson(readCache(httpId).toUtf8()).object();
-            qint64 fileSize = cacheInfo.value("fileSize").toDouble();
-            qint64 contentLength = cacheInfo.value("contentLength").toDouble();
-            if(fileSize == contentLength && file->size() == contentLength){
-                onDownloadProgress(callable,fileSize,contentLength);
-                onSuccess(callable,savePath);
-                onFinish(callable,request);
-                return;
-            }
-            if(fileSize==file->size()){
-                req.setRawHeader("Range", QString("bytes=%1-").arg(fileSize).toUtf8());
-                seek = fileSize;
-                file->open(QIODevice::WriteOnly|QIODevice::Append);
-            }else{
-                file->open(QIODevice::WriteOnly|QIODevice::Truncate);
-            }
-        }else{
-            file->open(QIODevice::WriteOnly|QIODevice::Truncate);
-        }
-        QNetworkReply* reply =  manager.get(req);
-        if(!QPointer(qApp)){
-            reply->deleteLater();
-            reply = nullptr;
-            return;
-        }
-        _cacheReply.append(reply);
-        QEventLoop loop;
-        connect(&manager,&QNetworkAccessManager::finished,&manager,[&loop](QNetworkReply *reply){loop.quit();});
-        connect(qApp,&QGuiApplication::aboutToQuit,&manager, [&loop,reply](){reply->abort(),loop.quit();});
-        if (!fileCache->open(QIODevice::WriteOnly|QIODevice::Truncate))
-        {
-            qDebug()<<"FileCache Error";
-        }
-        connect(reply,&QNetworkReply::readyRead,reply,[reply,file,fileCache,requestMap,callable,seek,this]{
-            if (!reply || !file || reply->error() != QNetworkReply::NoError)
-            {
-                return;
-            }
-            QMap<QString, QVariant> downMap = requestMap;
-            qint64 contentLength = reply->header(QNetworkRequest::ContentLengthHeader).toLongLong()+seek;
-            downMap.insert("contentLength",contentLength);
-            QString eTag = reply->header(QNetworkRequest::ETagHeader).toString();
-            downMap.insert("eTag",eTag);
-            file->write(reply->readAll());
-            file->flush();
-            downMap.insert("fileSize",file->size());
-            fileCache->resize(0);
-            fileCache->write(FluTools::getInstance()->toBase64(QJsonDocument::fromVariant(QVariant(downMap)).toJson()).toUtf8());
-            fileCache->flush();
-            onDownloadProgress(callable,file->size(),contentLength);
-        });
-        loop.exec();
-        if (reply->error() == QNetworkReply::NoError) {
-            onSuccess(callable,savePath);
-        }else{
-            onError(callable,reply->attribute(QNetworkRequest::HttpStatusCodeAttribute).toInt(),reply->errorString(),"");
-        }
-        reply->deleteLater();
-        reply = nullptr;
-        onFinish(callable,request);
-    });
-}
-
-void FluHttp::upload(HttpRequest* request,HttpCallable* callable){
-    request->method("upload");
-    auto requestMap = request->toMap();
-    QMap<QString, QVariant> data = invokeIntercept(requestMap).toMap();
-    QThreadPool::globalInstance()->start([=](){
-        onStart(callable);
-        QNetworkAccessManager manager;
-        manager.setTransferTimeout(timeout());
-        QUrl url(request->url());
-        QNetworkRequest req(url);
-        addHeaders(&req,data["headers"].toMap());
-        QHttpMultiPart multiPart(QHttpMultiPart::FormDataType);
-        for (const auto& each : data["params"].toMap().toStdMap())
-        {
-            const QString& key = each.first;
-            const QString& filePath = each.second.toString();
-            QFile *file = new QFile(filePath);
-            file->open(QIODevice::ReadOnly);
-            file->setParent(&multiPart);
-            QString dispositionHeader = QString("form-data; name=\"%1\"; filename=\"%2\"").arg(key,filePath);
-            QHttpPart part;
-            part.setHeader(QNetworkRequest::ContentTypeHeader, QVariant("application/octet-stream"));
-            part.setHeader(QNetworkRequest::ContentDispositionHeader, dispositionHeader);
-            part.setBodyDevice(file);
-            multiPart.append(part);
-        }
-        QNetworkReply* reply = manager.post(req,&multiPart);
-        if(!QPointer(qApp)){
-            reply->deleteLater();
-            reply = nullptr;
-            return;
-        }
-        _cacheReply.append(reply);
-        QEventLoop loop;
-        connect(&manager,&QNetworkAccessManager::finished,&manager,[&loop](QNetworkReply *reply){loop.quit();});
-        connect(qApp,&QGuiApplication::aboutToQuit,&manager, [&loop,reply](){reply->abort(),loop.quit();});
-        connect(reply,&QNetworkReply::uploadProgress,reply,[=](qint64 bytesSent, qint64 bytesTotal){
-            onUploadProgress(callable,bytesSent,bytesTotal);
-        });
-        loop.exec();
-        QString result = QString::fromUtf8(reply->readAll());
-        int status = reply->attribute(QNetworkRequest::HttpStatusCodeAttribute).toInt();
-        QString errorString = reply->errorString();
-        bool isSuccess = reply->error() == QNetworkReply::NoError;
-        reply->deleteLater();
-        reply = nullptr;
-        if (isSuccess) {
-            onSuccess(callable,result);
-        }else{
-            onError(callable,status,errorString,result);
-        }
-        onFinish(callable,request);
-    });
-}
-
-void FluHttp::deleteResource(HttpRequest* request,HttpCallable* callable)
-{
-    request->method("deleteResource");
-    auto requestMap = request->toMap();
-    auto httpId = request->httpId();
-    QMap<QString, QVariant> data = invokeIntercept(requestMap).toMap();
-    QThreadPool::globalInstance()->start([=](){
-        onStart(callable);
-        if(_cacheMode == FluHttpType::CacheMode::FirstCacheThenRequest && cacheExists(httpId)){
-            onCache(callable,readCache(httpId));
-        }
-        if(_cacheMode == FluHttpType::CacheMode::IfNoneCacheRequest && cacheExists(httpId)){
-            onCache(callable,readCache(httpId));
-            onFinish(callable,request);
-            return;
-        }
-        QNetworkAccessManager manager;
-        manager.setTransferTimeout(timeout());
-        for (int i = 0; i < retry(); ++i) {
-            QUrl url(request->url());
-            addQueryParam(&url,data["params"].toMap());
-            QNetworkRequest req(url);
-            addHeaders(&req,data["headers"].toMap());
-            QEventLoop loop;
-            QNetworkReply* reply = manager.deleteResource(req);
-            _cacheReply.append(reply);
-            connect(&manager,&QNetworkAccessManager::finished,&manager,[&loop](QNetworkReply *reply){loop.quit();});
-            connect(qApp,&QGuiApplication::aboutToQuit,&manager, [&loop](){loop.quit();});
-            loop.exec();
-            int status = reply->attribute(QNetworkRequest::HttpStatusCodeAttribute).toInt();
-            QString errorString = reply->errorString();
-            bool isSuccess = reply->error() == QNetworkReply::NoError;
-            QString result = QString::fromUtf8(reply->readAll());
-            if (isSuccess) {
-                handleCache(httpId,result);
-                onSuccess(callable,result);
-                break;
-            }else{
-                if(i == retry()-1){
-                    if(_cacheMode == FluHttpType::CacheMode::RequestFailedReadCache && cacheExists(httpId)){
-                        onCache(callable,readCache(httpId));
-                    }
-                    onError(callable,status,errorString,result);
-                }
-            }
-            QNetworkReply::NetworkError error = reply->error();
-            if(error == QNetworkReply::OperationCanceledError){
-                break;
-            }
-            reply->deleteLater();
-            reply = nullptr;
-        }
-        onFinish(callable,request);
-    });
-}
-
-QVariant FluHttp::invokeIntercept(QMap<QString, QVariant> request){
-    if(!FluApp::getInstance()->httpInterceptor()){
-        return request;
-    }
-    QVariant target;
-    QMetaObject::invokeMethod(FluApp::getInstance()->httpInterceptor(), "onIntercept",Q_RETURN_ARG(QVariant,target),Q_ARG(QVariant, request));
-    return target;
-}
-
-void FluHttp::addQueryParam(QUrl* url,const QMap<QString, QVariant>& params){
-    QMapIterator<QString, QVariant> iter(params);
-    QUrlQuery urlQuery(*url);
-    while (iter.hasNext())
-    {
-        iter.next();
-        urlQuery.addQueryItem(iter.key(), iter.value().toString());
-    }
-    url->setQuery(urlQuery);
-}
-
-void FluHttp::addHeaders(QNetworkRequest* request,const QMap<QString, QVariant>& headers){
-    QMapIterator<QString, QVariant> iter(headers);
-    while (iter.hasNext())
-    {
-        iter.next();
-        request->setRawHeader(iter.key().toUtf8(), iter.value().toString().toUtf8());
-    }
-}
-
-QString FluHttp::readCache(const QString& httpId){
-    auto filePath = getCacheFilePath(httpId);
-    QString result;
-    QFile file(filePath);
-    if(!file.exists()){
-        return result;
-    }
-    if (file.open(QIODevice::ReadOnly)) {
-        QTextStream stream(&file);
-        result = FluTools::getInstance()->fromBase64(stream.readAll().toUtf8());
-    }
-    return result;
-}
-
-bool FluHttp::cacheExists(const QString& httpId){
-    return QFile(getCacheFilePath(httpId)).exists();
-}
-
-QString FluHttp::getCacheFilePath(const QString& httpId){
-    QString path = FluTools::getInstance()->toLocalPath(QUrl(_cacheDir));
-    QDir dir = path;
-    if (!dir.exists(path)){
-        dir.mkpath(path);
-    }
-    auto filePath = path+"/"+httpId;
-    return filePath;
-}
-
-void FluHttp::handleCache(const QString& httpId,const QString& result){
-    if(_cacheMode==FluHttpType::CacheMode::NoCache){
-        return;
-    }
-    auto filePath = getCacheFilePath(httpId);
-    QSharedPointer<QFile> file(new QFile(filePath));
-    QIODevice::OpenMode mode = QIODevice::WriteOnly|QIODevice::Truncate;
-    if (!file->open(mode))
-    {
-        return;
-    }
-    file->write(FluTools::getInstance()->toBase64(result).toUtf8());
-}
-
-qreal FluHttp::getBreakPointProgress(HttpRequest* request){
-    request->method("download");
-    auto httpId = request->httpId();
-    QSharedPointer<QFile> file(new QFile(request->downloadSavePath()));
-    auto filePath = getCacheFilePath(httpId);
-    QSharedPointer<QFile> fileCache(new QFile(filePath));
-    if(fileCache->exists() && file->exists() && _breakPointDownload){
-        QJsonObject cacheInfo = QJsonDocument::fromJson(readCache(httpId).toUtf8()).object();
-        double fileSize = cacheInfo.value("fileSize").toDouble();
-        double contentLength = cacheInfo.value("contentLength").toDouble();
-        if(fileSize == contentLength && file->size() == contentLength){
-            return 1;
-        }
-        if(fileSize==file->size()){
-            return fileSize/contentLength;
-        }else{
-            return 0;
-        }
-    }else{
-        return 0;
-    }
-}
-
-HttpRequest* FluHttp::newRequest(QString url){
-    HttpRequest* request = new HttpRequest(this);
-    request->url(url);
-    return request;
-}
-
-void FluHttp::onStart(QPointer<HttpCallable> callable){
-    if (!callable.isNull()) {
-        Q_EMIT callable->start();
-    }
-}
-
-void FluHttp::onFinish(QPointer<HttpCallable> callable,QPointer<HttpRequest> request){
-    if (!callable.isNull()) {
-        Q_EMIT callable->finish();
-    }
-    if(request&&request->parent()->inherits("FluHttp")){
-        request->deleteLater();
-    }
-}
-
-void FluHttp::onError(QPointer<HttpCallable> callable,int status,QString errorString,QString result){
-    if (!callable.isNull()) {
-        Q_EMIT callable->error(status,errorString,result);
-    }
-}
-
-void FluHttp::onSuccess(QPointer<HttpCallable> callable,QString result){
-    if (!callable.isNull()) {
-        Q_EMIT callable->success(result);
-    }
-}
-
-void FluHttp::onCache(QPointer<HttpCallable> callable,QString result){
-    if (!callable.isNull()) {
-        Q_EMIT callable->cache(result);
-    }
-}
-
-void FluHttp::onDownloadProgress(QPointer<HttpCallable> callable,qint64 recv,qint64 total){
-    if (!callable.isNull()) {
-        Q_EMIT callable->downloadProgress(recv,total);
-    }
-}
-
-void FluHttp::onUploadProgress(QPointer<HttpCallable> callable,qint64 sent,qint64 total){
-    if (!callable.isNull()) {
-        Q_EMIT callable->uploadProgress(sent,total);
-    }
-}