update macos action

FluNavigationView 组件增加了 tooltip 提示，交互更友好些。

.cmake/version_exe.rc.in

@@ -31,4 +31,4 @@ BEGIN
     END
 END
 
-IDI_ICON1 ICON DISCARDABLE "${CMAKE_SOURCE_DIR}/example/favicon.ico"
+IDI_ICON1 ICON DISCARDABLE "${FLUENTUI_DIRECTORY}/example/favicon.ico"

.github/workflows/macos.yml

@@ -56,7 +56,7 @@ jobs:
       - name: package
         run: |
           # 拷贝依赖
-          macdeployqt bin/release/${targetName}.app -qmldir=. -dmg     
+          sudo macdeployqt bin/release/${targetName}.app -qmldir=. -dmg     
           
       - uses: actions/upload-artifact@v2
         with:

example/CMakeLists.txt

@@ -18,9 +18,9 @@ endif()
 
 #设置可执行文件输出目录
 if(CMAKE_BUILD_TYPE STREQUAL "Debug")
-    set(CMAKE_RUNTIME_OUTPUT_DIRECTORY ${CMAKE_SOURCE_DIR}/bin/debug)
+    set(CMAKE_RUNTIME_OUTPUT_DIRECTORY ${FLUENTUI_DIRECTORY}/bin/debug)
 else()
-    set(CMAKE_RUNTIME_OUTPUT_DIRECTORY ${CMAKE_SOURCE_DIR}/bin/release)
+    set(CMAKE_RUNTIME_OUTPUT_DIRECTORY ${FLUENTUI_DIRECTORY}/bin/release)
 endif()
 
 #获取文件路径分隔符（解决执行命令的时候有些平台会报错）
@@ -81,7 +81,7 @@ if(WIN32)
     )
     configure_file(
         ${FLUENTUI_DIRECTORY}/.cmake/InstallerScript.iss.in
-        ${CMAKE_SOURCE_DIR}/action-cli/InstallerScript.iss
+        ${FLUENTUI_DIRECTORY}/action-cli/InstallerScript.iss
     )
 endif()
 
@@ -139,7 +139,7 @@ target_include_directories(example PRIVATE
     ${CMAKE_CURRENT_SOURCE_DIR}/src/component
 )
 
-#如何是静态库则需要手动注册插件，导入FluentUI.h头文件
+#如果是静态库则需要手动注册插件，导入FluentUI.h头文件
 if(FLUENTUI_BUILD_STATIC_LIB)
     target_include_directories(example PRIVATE
         ${CMAKE_SOURCE_DIR}/src

example/qml-Qt6/page/T_Home.qml

@@ -77,7 +77,7 @@ FluScrollablePage{
                     Rectangle{
                         anchors.fill: parent
                         radius: 5
-                        color:FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
+                        color:FluTheme.itemHoverColor
                         visible: item_mouse.containsMouse
                     }
                     Rectangle{
@@ -172,17 +172,10 @@ FluScrollablePage{
                     anchors.fill: parent
                     radius: 8
                     color:{
-                        if(FluTheme.dark){
-                            if(item_mouse.containsMouse){
-                                return Qt.rgba(1,1,1,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
-                        }else{
-                            if(item_mouse.containsMouse){
-                                return Qt.rgba(0,0,0,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
+                        if(item_mouse.containsMouse){
+                            return FluTheme.itemHoverColor
                         }
+                        return FluTheme.itemNormalColor
                     }
                 }
                 Image{
@@ -227,7 +220,7 @@ FluScrollablePage{
                     height: 12
                     width: 12
                     radius:  6
-                    color: FluTheme.primaryColor.dark
+                    color: FluTheme.primaryColor
                     anchors{
                         right: parent.right
                         top: parent.top

example/qml-Qt6/page/T_Screenshot.qml

@@ -35,7 +35,7 @@ FluScrollablePage{
         color: FluTheme.dark ? FluColors.Black : FluColors.White
         FluShadow{
             radius: 4
-            color: FluTheme.primaryColor.dark
+            color: FluTheme.primaryColor
         }
         Image{
             id:image

example/qml-Qt6/page/T_StatusView.qml

@@ -66,7 +66,7 @@ FluScrollablePage{
             }
             Rectangle {
                 anchors.fill: parent
-                color:FluTheme.primaryColor.dark
+                color:FluTheme.primaryColor
             }
         }
     }
@@ -78,7 +78,7 @@ FluScrollablePage{
     statusMode: FluStatusViewType.Loading
     Rectangle{
         anchors.fill: parent
-        color:FluTheme.primaryColor.dark
+        color:FluTheme.primaryColor
     }
 }'
     }

example/qml-Qt6/page/T_TableView.qml

@@ -181,7 +181,7 @@ FluContentPage{
                     iconSource: FluentIcons.ChevronUp
                     iconColor: {
                         if(1 === root.sortType){
-                            return FluTheme.primaryColor.dark
+                            return FluTheme.primaryColor
                         }
                         return FluTheme.dark ?  Qt.rgba(1,1,1,1) : Qt.rgba(0,0,0,1)
                     }
@@ -202,7 +202,7 @@ FluContentPage{
                     iconSource: FluentIcons.ChevronDown
                     iconColor: {
                         if(2 === root.sortType){
-                            return FluTheme.primaryColor.dark
+                            return FluTheme.primaryColor
                         }
                         return FluTheme.dark ?  Qt.rgba(1,1,1,1) : Qt.rgba(0,0,0,1)
                     }

example/qml-Qt6/page/T_Theme.qml

@@ -32,7 +32,7 @@ FluScrollablePage{
                             anchors.centerIn: parent
                             iconSource: FluentIcons.AcceptMedium
                             iconSize: 15
-                            visible: modelData === FluTheme.primaryColor
+                            visible: modelData === FluTheme.themeColor
                             color: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
                         }
                         MouseArea{
@@ -40,7 +40,7 @@ FluScrollablePage{
                             anchors.fill: parent
                             hoverEnabled: true
                             onClicked: {
-                                FluTheme.primaryColor = modelData
+                                FluTheme.themeColor = modelData
                             }
                         }
                     }
@@ -88,7 +88,7 @@ FluScrollablePage{
     CodeExpander{
         Layout.fillWidth: true
         Layout.topMargin: -1
-        code:'FluTheme.primaryColor = FluColors.Orange
+        code:'FluTheme.themeColor = FluColors.Orange
 
 FluTheme.dark = true
 

example/qml-Qt6/window/HotloadWindow.qml

@@ -60,11 +60,11 @@ FluWindow {
                         event.accepted = false
                         return
                     }
-                    if (event.urls.length !== 1) {
+                    var url = getUrlByEvent(event)
+                    if(url === ""){
                         event.accepted = false
                         return
                     }
-                    var url = event.urls[0].toString()
                     var fileExtension = url.substring(url.lastIndexOf(".") + 1)
                     if (fileExtension !== "qml") {
                         event.accepted = false
@@ -74,12 +74,24 @@ FluWindow {
                 }
             onDropped:
                 (event)=>{
-                    var path = event.urls[0].toString()
-                    loader.source = path
-                    watcher.path = path
-                    loader.reload()
+                    var url = getUrlByEvent(event)
+                    if(url !== ""){
+                        loader.source = url
+                        watcher.path = url
+                        loader.reload()
+                    }
                 }
         }
     }
 
+    function getUrlByEvent(event){
+        var url = ""
+        if (event.urls.length === 0) {
+            url = "file:///"+event.getDataAsString("text/plain")
+        }else{
+            url = event.urls[0].toString()
+        }
+        return url
+    }
+
 }

example/qml-Qt6/window/MainWindow.qml

@@ -244,7 +244,7 @@ FluWindow {
         }
     }
 
-    Loader{
+    FluLoader{
         id:loader_reveal
         anchors.fill: parent
     }

example/qml-Qt6/window/PageWindow.qml

@@ -18,7 +18,7 @@ FluWindow {
             window.title = arg.title
             loader.setSource( arg.url,{animDisabled:true})
         }
-    Loader{
+    FluLoader{
         id: loader
         anchors.fill: parent
     }

example/qml/page/T_Home.qml

@@ -2,7 +2,6 @@ import QtQuick 2.15
 import QtQuick.Layouts 1.15
 import QtQuick.Window 2.15
 import QtQuick.Controls 2.15
-import QtGraphicalEffects 1.0
 import "qrc:///example/qml/global"
 import FluentUI 1.0
 
@@ -78,7 +77,7 @@ FluScrollablePage{
                     Rectangle{
                         anchors.fill: parent
                         radius: 5
-                        color:FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
+                        color:FluTheme.itemHoverColor
                         visible: item_mouse.containsMouse
                     }
                     Rectangle{
@@ -173,17 +172,10 @@ FluScrollablePage{
                     anchors.fill: parent
                     radius: 8
                     color:{
-                        if(FluTheme.dark){
-                            if(item_mouse.containsMouse){
-                                return Qt.rgba(1,1,1,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
-                        }else{
-                            if(item_mouse.containsMouse){
-                                return Qt.rgba(0,0,0,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
+                        if(item_mouse.containsMouse){
+                            return FluTheme.itemHoverColor
                         }
+                        return FluTheme.itemNormalColor
                     }
                 }
                 Image{
@@ -228,7 +220,7 @@ FluScrollablePage{
                     height: 12
                     width: 12
                     radius:  6
-                    color: FluTheme.primaryColor.dark
+                    color: FluTheme.primaryColor
                     anchors{
                         right: parent.right
                         top: parent.top

example/qml/page/T_Screenshot.qml

@@ -36,7 +36,7 @@ FluScrollablePage{
         color: FluTheme.dark ? FluColors.Black : FluColors.White
         FluShadow{
             radius: 4
-            color: FluTheme.primaryColor.dark
+            color: FluTheme.primaryColor
         }
         Image{
             id:image

example/qml/page/T_StatusView.qml

@@ -67,7 +67,7 @@ FluScrollablePage{
             }
             Rectangle {
                 anchors.fill: parent
-                color:FluTheme.primaryColor.dark
+                color:FluTheme.primaryColor
             }
         }
     }
@@ -79,7 +79,7 @@ FluScrollablePage{
     statusMode: FluStatusViewType.Loading
     Rectangle{
         anchors.fill: parent
-        color:FluTheme.primaryColor.dark
+        color:FluTheme.primaryColor
     }
 }'
     }

example/qml/page/T_TableView.qml

@@ -182,7 +182,7 @@ FluContentPage{
                     iconSource: FluentIcons.ChevronUp
                     iconColor: {
                         if(1 === root.sortType){
-                            return FluTheme.primaryColor.dark
+                            return FluTheme.primaryColor
                         }
                         return FluTheme.dark ?  Qt.rgba(1,1,1,1) : Qt.rgba(0,0,0,1)
                     }
@@ -203,7 +203,7 @@ FluContentPage{
                     iconSource: FluentIcons.ChevronDown
                     iconColor: {
                         if(2 === root.sortType){
-                            return FluTheme.primaryColor.dark
+                            return FluTheme.primaryColor
                         }
                         return FluTheme.dark ?  Qt.rgba(1,1,1,1) : Qt.rgba(0,0,0,1)
                     }

example/qml/page/T_Theme.qml

@@ -33,7 +33,7 @@ FluScrollablePage{
                             anchors.centerIn: parent
                             iconSource: FluentIcons.AcceptMedium
                             iconSize: 15
-                            visible: modelData === FluTheme.primaryColor
+                            visible: modelData === FluTheme.themeColor
                             color: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
                         }
                         MouseArea{
@@ -41,7 +41,7 @@ FluScrollablePage{
                             anchors.fill: parent
                             hoverEnabled: true
                             onClicked: {
-                                FluTheme.primaryColor = modelData
+                                FluTheme.themeColor = modelData
                             }
                         }
                     }
@@ -89,7 +89,7 @@ FluScrollablePage{
     CodeExpander{
         Layout.fillWidth: true
         Layout.topMargin: -1
-        code:'FluTheme.primaryColor = FluColors.Orange
+        code:'FluTheme.themeColor = FluColors.Orange
 
 FluTheme.dark = true
 

example/qml/window/HotloadWindow.qml

@@ -61,11 +61,11 @@ FluWindow {
                         event.accepted = false
                         return
                     }
-                    if (event.urls.length !== 1) {
+                    var url = getUrlByEvent(event)
+                    if(url === ""){
                         event.accepted = false
                         return
                     }
-                    var url = event.urls[0].toString()
                     var fileExtension = url.substring(url.lastIndexOf(".") + 1)
                     if (fileExtension !== "qml") {
                         event.accepted = false
@@ -75,12 +75,24 @@ FluWindow {
                 }
             onDropped:
                 (event)=>{
-                    var path = event.urls[0].toString()
-                    loader.source = path
-                    watcher.path = path
-                    loader.reload()
+                    var url = getUrlByEvent(event)
+                    if(url !== ""){
+                        loader.source = url
+                        watcher.path = url
+                        loader.reload()
+                    }
                 }
         }
     }
 
+    function getUrlByEvent(event){
+        var url = ""
+        if (event.urls.length === 0) {
+            url = "file:///"+event.getDataAsString("text/plain")
+        }else{
+            url = event.urls[0].toString()
+        }
+        return url
+    }
+
 }

example/qml/window/MainWindow.qml

@@ -247,7 +247,7 @@ FluWindow {
         }
     }
 
-    Loader{
+    FluLoader{
         id:loader_reveal
         anchors.fill: parent
     }

example/qml/window/PageWindow.qml

@@ -19,7 +19,7 @@ FluWindow {
             window.title = arg.title
             loader.setSource( arg.url,{animDisabled:true})
         }
-    Loader{
+    FluLoader{
         id: loader
         anchors.fill: parent
     }

src/FluApp.cpp

@@ -14,7 +14,7 @@
 FRAMELESSHELPER_USE_NAMESPACE
 
 FluApp::FluApp(QObject *parent):QObject{parent}{
-    vsync(false);
+    vsync(true);
     httpInterceptor(nullptr);
 }
 
@@ -26,14 +26,6 @@ void FluApp::init(QObject *application){
     FramelessHelper::Quick::initialize();
     FramelessConfig::instance()->set(Global::Option::DisableLazyInitializationForMicaMaterial);
     FramelessConfig::instance()->set(Global::Option::CenterWindowBeforeShow);
-    FramelessConfig::instance()->set(Global::Option::ForceNonNativeBackgroundBlur);
-    FramelessConfig::instance()->set(Global::Option::EnableBlurBehindWindow);
-#ifdef Q_OS_WIN
-    FramelessConfig::instance()->set(Global::Option::EnableBlurBehindWindow,false);
-#endif
-#ifdef Q_OS_MACOS
-    FramelessConfig::instance()->set(Global::Option::ForceNonNativeBackgroundBlur,false);
-#endif
     QQmlEngine *engine = qmlEngine(_application);
     FramelessHelper::Quick::registerTypes(engine);
 }

src/FluHttp.h

@@ -4,14 +4,20 @@
 #include <QObject>
 #include <QtQml/qqml.h>
 #include <QFile>
+#include <QJsonValue>
 #include <QNetworkAccessManager>
 #include "stdafx.h"
 
 class HttpRequest : public QObject{
     Q_OBJECT
     Q_PROPERTY_AUTO(QString,url);
+#  if (QT_VERSION == QT_VERSION_CHECK(6, 4, 3))
+    Q_PROPERTY_AUTO(QJsonValue,params);
+    Q_PROPERTY_AUTO(QJsonValue,headers);
+#  else
     Q_PROPERTY_AUTO(QVariant,params);
     Q_PROPERTY_AUTO(QVariant,headers);
+#  endif
     Q_PROPERTY_AUTO(QString,method);
     Q_PROPERTY_AUTO(QString,downloadSavePath);
     QML_NAMED_ELEMENT(HttpRequest)

src/FluTheme.cpp

@@ -16,14 +16,31 @@ FluTheme::FluTheme(QObject *parent):QObject{parent}{
     connect(this,&FluTheme::darkModeChanged,this,[=]{
         Q_EMIT darkChanged();
     });
-    primaryColor(FluColors::getInstance()->Blue());
+    connect(this,&FluTheme::darkChanged,this,[=]{refreshColors();});
+    connect(this,&FluTheme::themeColorChanged,this,[=]{refreshColors();});
+    themeColor(FluColors::getInstance()->Blue());
+    darkMode(FluThemeType::DarkMode::Light);
     nativeText(false);
     enableAnimation(true);
-    darkMode(FluThemeType::DarkMode::Light);
     _systemDark = systemDark();
     qApp->installEventFilter(this);
 }
 
+void FluTheme::refreshColors(){
+    auto isDark = dark();
+    primaryColor(isDark ? _themeColor->lighter() : _themeColor->dark());
+    backgroundColor(isDark ? QColor(0,0,0,255) : QColor(1,1,1,255));
+    windowBackgroundColor(isDark ? QColor(32,32,32,255) : QColor(237,237,237,255));
+    windowActiveBackgroundColor(isDark ? QColor(26,26,26,255) : QColor(243,243,243,255));
+    fontPrimaryColor(isDark ? QColor(248,248,248,255) : QColor(7,7,7,255));
+    fontSecondaryColor(isDark ? QColor(222,222,222,255) : QColor(102,102,102,255));
+    fontTertiaryColor(isDark ? QColor(200,200,200,255) : QColor(153,153,153,255));
+    itemNormalColor(isDark ? QColor(255,255,255,0) : QColor(0,0,0,0));
+    itemHoverColor(isDark ? QColor(255,255,255,255*0.03) : QColor(0,0,0,255*0.03));
+    itemPressColor(isDark ? QColor(255,255,255,255*0.06) : QColor(0,0,0,255*0.06));
+    itemCheckColor(isDark ? QColor(255,255,255,255*0.09) : QColor(0,0,0,255*0.09));
+}
+
 bool FluTheme::eventFilter(QObject *obj, QEvent *event){
     Q_UNUSED(obj);
     if (event->type() == QEvent::ApplicationPaletteChange || event->type() == QEvent::ThemeChange)

src/FluTheme.h

@@ -5,6 +5,7 @@
 #include <QtQml/qqml.h>
 #include <QJsonArray>
 #include <QJsonObject>
+#include <QColor>
 #include "FluColorSet.h"
 #include "stdafx.h"
 #include "singleton.h"
@@ -16,7 +17,18 @@ class FluTheme : public QObject
 {
     Q_OBJECT
     Q_PROPERTY(bool dark READ dark NOTIFY darkChanged)
-    Q_PROPERTY_AUTO(FluColorSet*,primaryColor)
+    Q_PROPERTY_AUTO(FluColorSet*,themeColor);
+    Q_PROPERTY_AUTO(QColor,primaryColor);
+    Q_PROPERTY_AUTO(QColor,backgroundColor);
+    Q_PROPERTY_AUTO(QColor,windowBackgroundColor);
+    Q_PROPERTY_AUTO(QColor,windowActiveBackgroundColor);
+    Q_PROPERTY_AUTO(QColor,fontPrimaryColor);
+    Q_PROPERTY_AUTO(QColor,fontSecondaryColor);
+    Q_PROPERTY_AUTO(QColor,fontTertiaryColor);
+    Q_PROPERTY_AUTO(QColor,itemNormalColor);
+    Q_PROPERTY_AUTO(QColor,itemHoverColor);
+    Q_PROPERTY_AUTO(QColor,itemPressColor);
+    Q_PROPERTY_AUTO(QColor,itemCheckColor);
     Q_PROPERTY_AUTO(int,darkMode);
     Q_PROPERTY_AUTO(bool,nativeText);
     Q_PROPERTY_AUTO(bool,enableAnimation);
@@ -26,6 +38,7 @@ private:
     explicit FluTheme(QObject *parent = nullptr);
     bool eventFilter(QObject *obj, QEvent *event);
     bool systemDark();
+    void refreshColors();
 public:
     SINGLETONG(FluTheme)
     Q_INVOKABLE QJsonArray awesomeList(const QString& keyword = "");
@@ -33,7 +46,6 @@ public:
     static FluTheme *create(QQmlEngine *qmlEngine, QJSEngine *jsEngine){return getInstance();}
     bool dark();
 private:
-    bool _dark;
     bool _systemDark;
 };
 

src/FluViewModel.cpp

@@ -35,7 +35,9 @@ bool ViewModelManager::exist(const QString& key){
 void ViewModelManager::refreshViewModel(FluViewModel* viewModel,QString key,QVariant value){
     foreach (auto item, _viewmodel) {
         if(item->getKey() == viewModel->getKey()){
-            item->setProperty(key.toStdString().c_str(),value);
+            item->enablePropertyChange = false;
+            item->setProperty(key.toLatin1().constData(),value);
+            item->enablePropertyChange  = true;
         }
     }
 }
@@ -51,14 +53,16 @@ PropertyObserver::~PropertyObserver(){
 }
 
 void PropertyObserver::_propertyChange(){
-    auto value = _property.read();
-    _model->setProperty(_name.toStdString().c_str(),value);
-    ViewModelManager::getInstance()->refreshViewModel((FluViewModel*)parent(),_name,value);
+    auto viewModel = (FluViewModel*)parent();
+    if(viewModel->enablePropertyChange){
+        auto value = _property.read();
+        _model->setProperty(_name.toLatin1().constData(),value);
+        ViewModelManager::getInstance()->refreshViewModel(viewModel,_name,value);
+    }
 }
 
 FluViewModel::FluViewModel(QObject *parent):QObject{parent}{
     scope(FluViewModelType::Scope::Window);
-    target(nullptr);
     ViewModelManager::getInstance()->insertViewModel(this);
 }
 
@@ -77,7 +81,7 @@ void FluViewModel::componentComplete(){
     }
     const QMetaObject* obj = metaObject();
     if(_scope == FluViewModelType::Scope::Window){
-        _key = property("objectName_").toString()+QString::number(reinterpret_cast<qulonglong>(_window), 16);
+        _key = property("objectName").toString()+"-"+QString::number(reinterpret_cast<qulonglong>(_window), 16);
     }else{
         _key = property("objectName").toString();
     }
@@ -93,7 +97,7 @@ void FluViewModel::componentComplete(){
             const QMetaProperty property = obj->property(i);
             QString propertyName = property.name();
             auto value = property.read(this);
-            model->setProperty(propertyName.toStdString().c_str(),value);
+            model->setProperty(propertyName.toLatin1().constData(),value);
             new PropertyObserver(propertyName,model,this);
         }
         ViewModelManager::getInstance()->insert(_key,model);

src/FluViewModel.h

@@ -20,7 +20,6 @@ class FluViewModel : public QObject, public QQmlParserStatus
     Q_OBJECT
     Q_INTERFACES(QQmlParserStatus)
     Q_PROPERTY_AUTO(int,scope);
-    Q_PROPERTY_AUTO(QObject*,target);
     QML_NAMED_ELEMENT(FluViewModel)
 public:
     explicit FluViewModel(QObject *parent = nullptr);
@@ -29,6 +28,7 @@ public:
     void componentComplete() override;
     Q_SIGNAL void initData();
     QString getKey();
+    bool enablePropertyChange = true;
 private:
     QObject* _window = nullptr;
     QString _key = "";

src/FluentUI.cpp

@@ -151,6 +151,8 @@ void FluentUI::registerTypes(const char *uri){
     qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluProgressButton.qml"),uri,major,minor,"FluProgressButton");
     qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluLoadingButton.qml"),uri,major,minor,"FluLoadingButton");
     qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluClip.qml"),uri,major,minor,"FluClip");
+    qmlRegisterType(QUrl("qrc:/qt/qml/FluentUI/Controls/FluLoader.qml"),uri,major,minor,"FluLoader");
+
 
     qmlRegisterUncreatableMetaObject(Fluent_Awesome::staticMetaObject,  uri,major,minor,"FluentIcons", "Access to enums & flags only");
     qmlRegisterUncreatableMetaObject(FluHttpType::staticMetaObject,  uri,major,minor,"FluHttpType", "Access to enums & flags only");

src/Qt5/imports/FluentUI/Controls/FluAppBar.qml

@@ -14,12 +14,12 @@ Rectangle{
     property string stayTopText : "置顶"
     property string stayTopCancelText : "取消置顶"
     property color textColor: FluTheme.dark ? "#FFFFFF" : "#000000"
-    property color minimizeNormalColor: Qt.rgba(0,0,0,0)
-    property color minimizeHoverColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-    property color minimizePressColor: FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
-    property color maximizeNormalColor: Qt.rgba(0,0,0,0)
-    property color maximizeHoverColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-    property color maximizePressColor: FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
+    property color minimizeNormalColor: FluTheme.itemNormalColor
+    property color minimizeHoverColor: FluTheme.itemHoverColor
+    property color minimizePressColor: FluTheme.itemPressColor
+    property color maximizeNormalColor: FluTheme.itemNormalColor
+    property color maximizeHoverColor: FluTheme.itemHoverColor
+    property color maximizePressColor: FluTheme.itemPressColor
     property color closeNormalColor: Qt.rgba(0,0,0,0)
     property color closeHoverColor:  Qt.rgba(251/255,115/255,115/255,1)
     property color closePressColor: Qt.rgba(251/255,115/255,115/255,0.8)
@@ -32,7 +32,7 @@ Rectangle{
     property url icon
     property int iconSize: 20
     property bool isMac: FluTools.isMacos()
-    property color borerlessColor : FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color borerlessColor : FluTheme.primaryColor
     property var maxClickListener : function(){
         if (d.win.visibility === Window.Maximized)
             d.win.visibility = Window.Windowed
@@ -135,7 +135,7 @@ Rectangle{
             }
             text:d.stayTop ? control.stayTopCancelText : control.stayTopText
             radius: 0
-            iconColor: d.stayTop ? (FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark) : control.textColor
+            iconColor: d.stayTop ? FluTheme.primaryColor : control.textColor
             onClicked: stayTopClickListener()
         }
         FluIconButton{

src/Qt5/imports/FluentUI/Controls/FluCalendarView.qml

@@ -65,7 +65,7 @@ Item {
                     height: 50
                     radius: 25
                     visible: isYear
-                    color: FluTheme.primaryColor.dark
+                    color: FluTheme.primaryColor
                 }
                 FluText{
                     text:date.getFullYear()
@@ -124,7 +124,7 @@ Item {
                     height: 50
                     radius: 25
                     visible: isMonth
-                    color: FluTheme.primaryColor.dark
+                    color: FluTheme.primaryColor
                 }
                 FluText{
                     text:(date.getMonth()+1)+"月"
@@ -184,7 +184,7 @@ Item {
                     radius: 18
                     color:"#00000000"
                     visible: isDay
-                    border.color: FluTheme.primaryColor.dark
+                    border.color: FluTheme.primaryColor
                     border.width: 1
                 }
                 Rectangle{
@@ -194,7 +194,7 @@ Item {
                     height: 30
                     radius: 15
                     visible: isToDay
-                    color: FluTheme.primaryColor.dark
+                    color: FluTheme.primaryColor
                 }
                 FluText{
                     text:date.getDate()
@@ -331,7 +331,7 @@ Item {
                 cellWidth: displayMode === FluCalendarViewType.Month ? 40 : 70
                 clip: true
                 boundsBehavior:Flickable.StopAtBounds
-                delegate: Loader{
+                delegate: FluLoader{
                     property var modelData : model
                     property var name : model.name
                     property var date : model.date

src/Qt5/imports/FluentUI/Controls/FluCarousel.qml

@@ -75,7 +75,7 @@ Item {
                     return 0
                 return index-1
             }
-            Loader{
+            FluLoader{
                 property int displayIndex : item_control.displayIndex
                 property var model: list_view.model.get(index)
                 anchors.fill: parent
@@ -124,9 +124,9 @@ Item {
                 radius: 4
             }
             scale: checked ? 1.2 : 1
-            color: checked ?  FluTheme.primaryColor.dark : Qt.rgba(1,1,1,0.7)
+            color: checked ?  FluTheme.primaryColor : Qt.rgba(1,1,1,0.7)
             border.width: mouse_item.containsMouse ? 1 : 0
-            border.color: FluTheme.primaryColor.dark
+            border.color: FluTheme.primaryColor
             MouseArea{
                 id:mouse_item
                 hoverEnabled: true
@@ -156,7 +156,7 @@ Item {
         Repeater{
             id:repeater_indicator
             model: list_view.count
-            Loader{
+            FluLoader{
                 property int displayIndex: {
                     if(index === 0)
                         return list_view.count-3

src/Qt5/imports/FluentUI/Controls/FluCheckBox.qml

@@ -7,12 +7,12 @@ Button {
     property bool disabled: false
     property string contentDescription: ""
     property color borderNormalColor: FluTheme.dark ? Qt.rgba(160/255,160/255,160/255,1) : Qt.rgba(136/255,136/255,136/255,1)
-    property color bordercheckedColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color bordercheckedColor: FluTheme.primaryColor
     property color borderHoverColor: FluTheme.dark ? Qt.rgba(167/255,167/255,167/255,1) : Qt.rgba(135/255,135/255,135/255,1)
     property color borderDisableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(199/255,199/255,199/255,1)
     property color borderPressedColor: FluTheme.dark ? Qt.rgba(90/255,90/255,90/255,1) : Qt.rgba(191/255,191/255,191/255,1)
     property color normalColor: FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(247/255,247/255,247/255,1)
-    property color checkedColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color checkedColor: FluTheme.primaryColor
     property color hoverColor: FluTheme.dark ? Qt.rgba(72/255,72/255,72/255,1) : Qt.rgba(236/255,236/255,236/255,1)
     property color checkedHoverColor: FluTheme.dark ? Qt.darker(checkedColor,1.15) : Qt.lighter(checkedColor,1.15)
     property color checkedPreesedColor: FluTheme.dark ? Qt.darker(checkedColor,1.3) : Qt.lighter(checkedColor,1.3)

src/Qt5/imports/FluentUI/Controls/FluColorPicker.qml

@@ -19,7 +19,7 @@ Button{
         color:"#00000000"
         border.color: {
             if(hovered)
-                return FluTheme.primaryColor.light
+                return FluTheme.primaryColor
             return FluTheme.dark ? Qt.rgba(100/255,100/255,100/255,1) : Qt.rgba(200/255,200/255,200/255,1)
         }
         border.width: 1

src/Qt5/imports/FluentUI/Controls/FluComboBox.qml

@@ -45,7 +45,7 @@ T.ComboBox {
         topPadding: 6 - control.padding
         bottomPadding: 6 - control.padding
         renderType: FluTheme.nativeText ? Text.NativeRendering : Text.QtRendering
-        selectionColor: FluTools.colorAlpha(FluTheme.primaryColor.lightest,0.6)
+        selectionColor: FluTools.colorAlpha(FluTheme.primaryColor,0.5)
         selectedTextColor: color
         text: control.editable ? control.editText : control.displayText
         enabled: control.editable
@@ -108,6 +108,7 @@ T.ComboBox {
             model: control.delegateModel
             currentIndex: control.highlightedIndex
             highlightMoveDuration: 0
+			boundsMovement: Flickable.StopAtBounds
             T.ScrollIndicator.vertical: ScrollIndicator { }
         }
         enter: Transition {

src/Qt5/imports/FluentUI/Controls/FluContentDialog.qml

@@ -25,9 +25,6 @@ FluPopup {
         anchors.fill: parent
         color: 'transparent'
         radius:5
-        FluShadow{
-            radius: 5
-        }
         FluText{
             id:text_title
             font: FluTextStyle.TitleLarge

src/Qt5/imports/FluentUI/Controls/FluCopyableText.qml

@@ -17,7 +17,7 @@ TextEdit {
     selectByMouse: true
     selectedTextColor: color
     bottomPadding: 0
-    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor.lightest,0.6)
+    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor,0.5)
     font:FluTextStyle.Body
     onSelectedTextChanged: {
         control.forceActiveFocus()

src/Qt5/imports/FluentUI/Controls/FluDatePicker.qml

@@ -169,11 +169,7 @@ Rectangle {
                                 anchors.rightMargin: 5
                                 color:  {
                                     if(getListView().currentIndex === position){
-                                        if(FluTheme.dark){
-                                            return  item_mouse.containsMouse ? Qt.darker(FluTheme.primaryColor.lighter,1.1) : FluTheme.primaryColor.lighter
-                                        }else{
-                                            return  item_mouse.containsMouse ? Qt.lighter(FluTheme.primaryColor.dark,1.1): FluTheme.primaryColor.dark
-                                        }
+                                        return  item_mouse.containsMouse ? Qt.lighter(FluTheme.primaryColor,1.1): FluTheme.primaryColor
                                     }
                                     if(item_mouse.containsMouse){
                                         return FluTheme.dark ? Qt.rgba(63/255,60/255,61/255,1) : Qt.rgba(237/255,237/255,242/255,1)
@@ -236,7 +232,7 @@ Rectangle {
                         preferredHighlightEnd: 0
                         highlightMoveDuration: 0
                         visible: showYear
-                        delegate: Loader{
+                        delegate: FluLoader{
                             property var model: modelData
                             property int type:0
                             property int position:index
@@ -258,7 +254,7 @@ Rectangle {
                         preferredHighlightEnd: 0
                         highlightMoveDuration: 0
                         boundsBehavior:Flickable.StopAtBounds
-                        delegate: Loader{
+                        delegate: FluLoader{
                             property var model: modelData
                             property int type:1
                             property int position:index
@@ -281,7 +277,7 @@ Rectangle {
                         ScrollBar.vertical: FluScrollBar {}
                         Layout.alignment: Qt.AlignVCenter
                         boundsBehavior:Flickable.StopAtBounds
-                        delegate: Loader{
+                        delegate: FluLoader{
                             property var model: modelData
                             property int type:2
                             property int position:index

src/Qt5/imports/FluentUI/Controls/FluDivider.qml

@@ -2,16 +2,26 @@ import QtQuick 2.15
 import QtQuick.Window 2.15
 import FluentUI 1.0
 
-Rectangle {
-    property real spacing
-    property alias separatorHeight:separator.height
+
+Item {
     id:control
-    color:Qt.rgba(0,0,0,0)
-    height: spacing*2+separator.height
+    property int orientation: Qt.Horizontal
+    property int spacing:0
+    property int size: 1
+
+    QtObject{
+        id:d
+        property bool isVertical : orientation === Qt.Vertical
+    }
+
+    width: d.isVertical ? spacing*2+size : parent.width
+    height: d.isVertical ? parent.height : spacing*2+size
+
     FluRectangle{
-        id:separator
         color: FluTheme.dark ? Qt.rgba(80/255,80/255,80/255,1) : Qt.rgba(210/255,210/255,210/255,1)
-        width:parent.width
+        width: d.isVertical ? size : parent.width
+        height: d.isVertical ? parent.height : size
         anchors.centerIn: parent
     }
+
 }

src/Qt5/imports/FluentUI/Controls/FluFilledButton.qml

@@ -5,7 +5,7 @@ import FluentUI 1.0
 Button {
     property bool disabled: false
     property string contentDescription: ""
-    property color normalColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color normalColor: FluTheme.primaryColor
     property color hoverColor: FluTheme.dark ? Qt.darker(normalColor,1.1) : Qt.lighter(normalColor,1.1)
     property color disableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(199/255,199/255,199/255,1)
     property color pressedColor: FluTheme.dark ? Qt.darker(normalColor,1.2) : Qt.lighter(normalColor,1.2)

src/Qt5/imports/FluentUI/Controls/FluIconButton.qml

@@ -10,10 +10,10 @@ Button {
     property bool disabled: false
     property int radius:4
     property string contentDescription: ""
-    property color hoverColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-    property color pressedColor: FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
-    property color normalColor: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
-    property color disableColor: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
+    property color hoverColor: FluTheme.itemHoverColor
+    property color pressedColor: FluTheme.itemPressColor
+    property color normalColor: FluTheme.itemNormalColor
+    property color disableColor: FluTheme.itemNormalColor
     property Component iconDelegate: com_icon
     property color color: {
         if(!enabled){
@@ -37,6 +37,7 @@ Button {
             return Qt.rgba(0,0,0,1)
         }
     }
+    property color textColor: FluTheme.fontPrimaryColor
     Accessible.role: Accessible.Button
     Accessible.name: control.text
     Accessible.description: contentDescription
@@ -47,6 +48,7 @@ Button {
     verticalPadding: 8
     horizontalPadding: 8
     enabled: !disabled
+    font:FluTextStyle.Caption
     background: Rectangle{
         implicitWidth: 30
         implicitHeight: 30
@@ -71,7 +73,7 @@ Button {
     Component{
         id:com_row
         RowLayout{
-            Loader{
+            FluLoader{
                 sourceComponent: iconDelegate
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
                 visible: display !== Button.TextOnly
@@ -80,13 +82,15 @@ Button {
                 text:control.text
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
                 visible: display !== Button.IconOnly
+                color: control.textColor
+                font: control.font
             }
         }
     }
     Component{
         id:com_column
         ColumnLayout{
-            Loader{
+            FluLoader{
                 sourceComponent: iconDelegate
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
                 visible: display !== Button.TextOnly
@@ -95,10 +99,12 @@ Button {
                 text:control.text
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
                 visible: display !== Button.IconOnly
+                color: control.textColor
+                font: control.font
             }
         }
     }
-    contentItem:Loader{
+    contentItem:FluLoader{
         sourceComponent: {
             if(display === Button.TextUnderIcon){
                 return com_column

src/Qt5/imports/FluentUI/Controls/FluImage.qml

@@ -11,7 +11,7 @@ Image {
     property Component errorItem : com_error
     property Component loadingItem: com_loading
     id: control
-    Loader{
+    FluLoader{
         anchors.fill: parent
         sourceComponent: {
             if(control.status === Image.Loading){
@@ -26,7 +26,7 @@ Image {
     Component{
         id:com_loading
         Rectangle{
-            color: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
+            color: FluTheme.itemHoverColor
             FluProgressRing{
                 anchors.centerIn: parent
                 visible: control.status === Image.Loading
@@ -36,7 +36,7 @@ Image {
     Component{
         id:com_error
         Rectangle{
-            color: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
+            color: FluTheme.itemHoverColor
             FluFilledButton{
                 text: control.errorButtonText
                 anchors.centerIn: parent

src/Qt5/imports/FluentUI/Controls/FluInfoBar.qml

@@ -86,7 +86,7 @@ FluObject {
                     interval: duration; running: duration > 0; repeat: duration > 0
                     onTriggered: content.close();
                 }
-                Loader{
+                FluLoader{
                     id:loader;
                     x:(parent.width - width) / 2;
                     property var _super: content;
@@ -170,7 +170,7 @@ FluObject {
                             switch(_super.type){
                             case mcontrol.const_success: return Qt.rgba(108/255,203/255,95/255,1);
                             case mcontrol.const_warning: return Qt.rgba(252/255,225/255,0/255,1);
-                            case mcontrol.const_info:    return FluTheme.primaryColor.lighter;
+                            case mcontrol.const_info:    return FluTheme.primaryColor;
                             case mcontrol.const_error:   return Qt.rgba(255/255,153/255,164/255,1);
                             }
                             return "#FFFFFF"
@@ -213,7 +213,7 @@ FluObject {
                             switch(_super.type){
                             case mcontrol.const_success: return Qt.rgba(108/255,203/255,95/255,1);
                             case mcontrol.const_warning: return Qt.rgba(252/255,225/255,0/255,1);
-                            case mcontrol.const_info:    return FluTheme.primaryColor.lighter;
+                            case mcontrol.const_info:    return FluTheme.primaryColor;
                             case mcontrol.const_error:   return Qt.rgba(255/255,153/255,164/255,1);
                             }
                             return "#FFFFFF"

src/Qt5/imports/FluentUI/Controls/FluLoader.qml

@@ -0,0 +1,5 @@
+import QtQuick 2.15
+
+Loader {
+    Component.onDestruction: sourceComponent = undefined
+}

src/Qt5/imports/FluentUI/Controls/FluMenuBarItem.qml

@@ -47,23 +47,13 @@ T.MenuBarItem {
         implicitHeight: 30
         radius: 3
         color: {
-            if(FluTheme.dark){
-                if(control.highlighted){
-                    return Qt.rgba(1,1,1,0.06)
-                }
-                if(control.hovered){
-                    return Qt.rgba(1,1,1,0.03)
-                }
-                return Qt.rgba(0,0,0,0)
-            }else{
-                if(control.highlighted){
-                    return Qt.rgba(0,0,0,0.06)
-                }
-                if(control.hovered){
-                    return Qt.rgba(0,0,0,0.03)
-                }
-                return Qt.rgba(0,0,0,0)
+            if(control.highlighted){
+                return FluTheme.itemCheckColor
             }
+            if(control.hovered){
+                return FluTheme.itemHoverColor
+            }
+            return FluTheme.itemNormalColor
         }
     }
 }

src/Qt5/imports/FluentUI/Controls/FluMenuItem.qml

@@ -60,7 +60,7 @@ T.MenuItem {
                 right: parent.right
                 rightMargin: (control.mirrored ? indicatorPadding : arrowPadding)+5
             }
-            Loader{
+            FluLoader{
                 id:loader_icon
                 sourceComponent: iconDelegate
                 anchors.verticalCenter: parent.verticalCenter
@@ -98,17 +98,10 @@ T.MenuItem {
             anchors.margins: 3
             radius: 4
             color:{
-                if(FluTheme.dark){
-                    if(control.highlighted){
-                        return Qt.rgba(1,1,1,0.06)
-                    }
-                    return Qt.rgba(0,0,0,0)
-                }else{
-                    if(control.highlighted){
-                        return Qt.rgba(0,0,0,0.06)
-                    }
-                    return Qt.rgba(0,0,0,0)
+                if(control.highlighted){
+                    return FluTheme.itemCheckColor
                 }
+                return FluTheme.itemNormalColor
             }
         }
     }

src/Qt5/imports/FluentUI/Controls/FluMultilineTextBox.qml

@@ -10,6 +10,7 @@ TextArea{
     property color placeholderNormalColor: FluTheme.dark ? Qt.rgba(210/255,210/255,210/255,1) : Qt.rgba(96/255,96/255,96/255,1)
     property color placeholderFocusColor: FluTheme.dark ? Qt.rgba(152/255,152/255,152/255,1) : Qt.rgba(141/255,141/255,141/255,1)
     property color placeholderDisableColor: FluTheme.dark ? Qt.rgba(131/255,131/255,131/255,1) : Qt.rgba(160/255,160/255,160/255,1)
+    property bool isCtrlEnterForNewline: false
     id:control
     enabled: !disabled
     color: {
@@ -20,11 +21,11 @@ TextArea{
     }
     font:FluTextStyle.Body
     wrapMode: Text.WrapAnywhere
-    padding: 7
+    padding: 8
     leftPadding: padding+4
     renderType: FluTheme.nativeText ? Text.NativeRendering : Text.QtRendering
     selectedTextColor: color
-    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor.lightest,0.6)
+    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor,0.5)
     placeholderTextColor: {
         if(!enabled){
             return placeholderDisableColor
@@ -35,21 +36,28 @@ TextArea{
         return placeholderNormalColor
     }
     selectByMouse: true
-    width: background.implicitWidth
+    width: 240
     background: FluTextBoxBackground{
         inputItem: control
-        implicitWidth: 240
     }
     Keys.onEnterPressed: (event)=> d.handleCommit(event)
     Keys.onReturnPressed:(event)=> d.handleCommit(event)
     QtObject{
         id:d
         function handleCommit(event){
-            if(event.modifiers & Qt.ControlModifier){
+            if(isCtrlEnterForNewline){
+                if(event.modifiers & Qt.ControlModifier){
+                    insert(control.cursorPosition, "\n")
+                    return
+                }
+                control.commit(control.text)
+            }else{
+                if(event.modifiers & Qt.ControlModifier){
+                    control.commit(control.text)
+                    return
+                }
                 insert(control.cursorPosition, "\n")
-                return
             }
-            control.commit(control.text)
         }
     }
     MouseArea{

src/Qt5/imports/FluentUI/Controls/FluNavigationView.qml

@@ -16,8 +16,11 @@ Item {
     property int pageMode: FluNavigationViewType.Stack
     property FluMenu navItemRightMenu
     property FluMenu navItemExpanderRightMenu
+    property int navCompactWidth: 50
+    property int navTopMargin: 0
     property int cellHeight: 38
     property int cellWidth: 300
+    property bool hideNavAppBar: false
     signal logoClicked
     id:control
     Item{
@@ -120,7 +123,7 @@ Item {
                 }
                 return 1
             }
-            separatorHeight: {
+            size: {
                 if(!model){
                     return 1
                 }
@@ -176,6 +179,11 @@ Item {
                     leftMargin: 6
                     rightMargin: 6
                 }
+                FluTooltip {
+                    text: model.title
+                    visible: item_control.hovered && model.title && d.isCompact
+                    delay: 800
+                }
                 MouseArea{
                     anchors.fill: parent
                     acceptedButtons: Qt.RightButton
@@ -199,7 +207,7 @@ Item {
                         if(h+y>control.height){
                             y = control.height - h
                         }
-                        control_popup.showPopup(Qt.point(50,y),h,model.children)
+                        control_popup.showPopup(Qt.point(control.navCompactWidth,y),h,model.children)
                         return
                     }
                     model.isExpand = !model.isExpand
@@ -239,7 +247,7 @@ Item {
                         width: 3
                         height: 18
                         radius: 1.5
-                        color: FluTheme.primaryColor.dark
+                        color: FluTheme.primaryColor
                         visible: {
                             if(!model){
                                 return false
@@ -291,25 +299,15 @@ Item {
                     }
                     color: {
                         if(!item_control.enabled){
-                            return Qt.rgba(0,0,0,0)
+                            return FluTheme.itemNormalColor
                         }
-                        if(FluTheme.dark){
-                            if((nav_list.currentIndex === _idx)&&type===0){
-                                return Qt.rgba(1,1,1,0.06)
-                            }
-                            if(item_control.hovered){
-                                return Qt.rgba(1,1,1,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
-                        }else{
-                            if(nav_list.currentIndex === _idx&&type===0){
-                                return Qt.rgba(0,0,0,0.06)
-                            }
-                            if(item_control.hovered){
-                                return Qt.rgba(0,0,0,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
+                        if(nav_list.currentIndex === _idx&&type===0){
+                            return FluTheme.itemCheckColor
                         }
+                        if(item_control.hovered){
+                            return FluTheme.itemHoverColor
+                        }
+                        return FluTheme.itemNormalColor
                     }
                     Component{
                         id:com_icon
@@ -340,11 +338,11 @@ Item {
                             return true
                         }
                         anchors{
-                            verticalCenter: parent.verticalCenter
                             left:parent.left
-                            leftMargin: 3
+                            verticalCenter: parent.verticalCenter
+                            leftMargin: d.isCompactAndNotPanel ? (parent.width - 30)/2 : 3
                         }
-                        Loader{
+                        FluLoader{
                             anchors.centerIn: parent
                             sourceComponent: {
                                 if(model&&model.iconDelegate){
@@ -390,7 +388,7 @@ Item {
                             return FluTheme.dark ? FluColors.White : FluColors.Grey220
                         }
                     }
-                    Loader{
+                    FluLoader{
                         id:item_edit_loader
                         anchors{
                             top: parent.top
@@ -406,7 +404,7 @@ Item {
                             return model&&model.showEdit ? model.editDelegate : undefined
                         }
                         onStatusChanged: {
-                            if(status === Loader.Ready){
+                            if(status === FluLoader.Ready){
                                 item.forceActiveFocus()
                                 item_connection_edit_focus.target = item
                             }
@@ -465,6 +463,11 @@ Item {
                     leftMargin: 6
                     rightMargin: 6
                 }
+                FluTooltip {
+                    text: model.title
+                    visible: item_control.hovered && model.title && d.isCompact
+                    delay: 800
+                }
                 onClicked:{
                     if(type === 0){
                         if(model.onTapListener){
@@ -513,37 +516,21 @@ Item {
                     anchors.fill: parent
                     color: {
                         if(!item_control.enabled){
-                            return Qt.rgba(0,0,0,0)
+                            return FluTheme.itemNormalColor
                         }
-                        if(FluTheme.dark){
-                            if(type===0){
-                                if(nav_list.currentIndex === _idx){
-                                    return Qt.rgba(1,1,1,0.06)
-                                }
-                            }else{
-                                if(nav_list.currentIndex === (nav_list.count-layout_footer.count+_idx)){
-                                    return Qt.rgba(1,1,1,0.06)
-                                }
+                        if(type===0){
+                            if(nav_list.currentIndex === _idx){
+                                return FluTheme.itemCheckColor
                             }
-                            if(item_control.hovered){
-                                return Qt.rgba(1,1,1,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
                         }else{
-                            if(type===0){
-                                if(nav_list.currentIndex === _idx){
-                                    return Qt.rgba(0,0,0,0.06)
-                                }
-                            }else{
-                                if(nav_list.currentIndex === (nav_list.count-layout_footer.count+_idx)){
-                                    return Qt.rgba(0,0,0,0.06)
-                                }
+                            if(nav_list.currentIndex === (nav_list.count-layout_footer.count+_idx)){
+                                return FluTheme.itemCheckColor
                             }
-                            if(item_control.hovered){
-                                return Qt.rgba(0,0,0,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
                         }
+                        if(item_control.hovered){
+                            return FluTheme.itemHoverColor
+                        }
+                        return FluTheme.itemNormalColor
                     }
                     Component{
                         id:com_icon
@@ -574,11 +561,11 @@ Item {
                             return true
                         }
                         anchors{
-                            verticalCenter: parent.verticalCenter
                             left:parent.left
-                            leftMargin: 3
+                            verticalCenter: parent.verticalCenter
+                            leftMargin: d.isCompactAndNotPanel ? (parent.width - 30)/2 : 3
                         }
-                        Loader{
+                        FluLoader{
                             anchors.centerIn: parent
                             sourceComponent: {
                                 if(model&&model.iconDelegate){
@@ -624,7 +611,7 @@ Item {
                             right: item_dot_loader.left
                         }
                     }
-                    Loader{
+                    FluLoader{
                         id:item_edit_loader
                         anchors{
                             top: parent.top
@@ -643,7 +630,7 @@ Item {
                             return model.showEdit ? model.editDelegate : undefined
                         }
                         onStatusChanged: {
-                            if(status === Loader.Ready){
+                            if(status === FluLoader.Ready){
                                 item.forceActiveFocus()
                                 item_connection_edit_focus.target = item
                             }
@@ -662,7 +649,7 @@ Item {
                             }
                         }
                     }
-                    Loader{
+                    FluLoader{
                         id:item_dot_loader
                         property bool isDot: (item_dot_loader.item&&item_dot_loader.item.isDot)
                         anchors{
@@ -693,11 +680,12 @@ Item {
     Item {
         id:nav_app_bar
         width: parent.width
-        height: 40
+        height: visible ? 40 : 0
         anchors{
             top: parent.top
             topMargin: control.topPadding
         }
+        visible: !control.hideNavAppBar
         z:999
         RowLayout{
             height:parent.height
@@ -806,7 +794,7 @@ Item {
                 }
                 return 0
             }
-            Loader{
+            FluLoader{
                 id:loader_action
                 anchors.centerIn: parent
                 sourceComponent: actionItem
@@ -848,7 +836,7 @@ Item {
             }
         }
     }
-    Loader{
+    FluLoader{
         id:loader_content
         anchors{
             left: parent.left
@@ -860,7 +848,7 @@ Item {
                     return 0
                 }
                 if(d.isCompact){
-                    return 50
+                    return control.navCompactWidth
                 }
                 return control.cellWidth
             }
@@ -888,12 +876,13 @@ Item {
         id:layout_list
         width: {
             if(d.isCompactAndNotPanel){
-                return 50
+                return control.navCompactWidth
             }
             return control.cellWidth
         }
         anchors{
             top: parent.top
+            topMargin: control.navTopMargin
             bottom: parent.bottom
         }
         border.color: FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,230/255,234/255,1)
@@ -934,7 +923,7 @@ Item {
             clip: true
             y:nav_app_bar.height+control.topPadding
             height: autoSuggestBox ? 38 : 0
-            Loader{
+            FluLoader{
                 id:loader_auto_suggest_box
                 sourceComponent: autoSuggestBox
                 anchors{
@@ -953,13 +942,13 @@ Item {
             }
             FluIconButton{
                 visible:d.isCompactAndNotPanel
-                hoverColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-                pressedColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-                normalColor: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
-                width:38
-                height:34
-                x:6
-                y:2
+                anchors{
+                    fill: parent
+                    leftMargin: 6
+                    rightMargin: 6
+                    topMargin: 2
+                    bottomMargin: 2
+                }
                 iconSize: 15
                 iconSource: {
                     if(loader_auto_suggest_box.item){
@@ -1004,7 +993,7 @@ Item {
                     Rectangle{
                         height: 18
                         radius: 1.5
-                        color: FluTheme.primaryColor.dark
+                        color: FluTheme.primaryColor
                         width: 3
                         anchors{
                             verticalCenter: parent.verticalCenter
@@ -1014,7 +1003,7 @@ Item {
                     }
                 }
                 currentIndex: -1
-                delegate: Loader{
+                delegate: FluLoader{
                     property var model: modelData
                     property var _idx: index
                     property int type: 0
@@ -1062,7 +1051,7 @@ Item {
                 Rectangle{
                     height: 18
                     radius: 1.5
-                    color: FluTheme.primaryColor.dark
+                    color: FluTheme.primaryColor
                     width: 3
                     anchors{
                         verticalCenter: parent.verticalCenter
@@ -1071,7 +1060,7 @@ Item {
                     }
                 }
             }
-            delegate: Loader{
+            delegate: FluLoader{
                 property var model: modelData
                 property var _idx: index
                 property int type: 1
@@ -1126,24 +1115,17 @@ Item {
                     focusPolicy:Qt.TabFocus
                     background: Rectangle{
                         color:  {
-                            if(FluTheme.dark){
-                                if(item_button.hovered){
-                                    return Qt.rgba(1,1,1,0.06)
-                                }
-                                return Qt.rgba(0,0,0,0)
-                            }else{
-                                if(item_button.hovered){
-                                    return Qt.rgba(0,0,0,0.03)
-                                }
-                                return Qt.rgba(0,0,0,0)
+                            if(item_button.hovered){
+                                return FluTheme.itemHoverColor
                             }
+                            return FluTheme.itemNormalColor
                         }
                         FluFocusRectangle{
                             visible: item_button.activeFocus
                             radius:4
                         }
 
-                        Loader{
+                        FluLoader{
                             id:item_dot_loader
                             anchors{
                                 right: parent.right
@@ -1200,7 +1182,7 @@ Item {
             control_popup.open()
         }
     }
-    Loader{
+    FluLoader{
         property var modelData
         id:loader_item_menu
     }

src/Qt5/imports/FluentUI/Controls/FluPasswordBox.qml

@@ -25,7 +25,7 @@ TextField{
     leftPadding: padding+4
     echoMode:btn_reveal.pressed ? TextField.Normal : TextField.Password
     renderType: FluTheme.nativeText ? Text.NativeRendering : Text.QtRendering
-    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor.lightest,0.6)
+    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor,0.5)
     selectedTextColor: color
     placeholderTextColor: {
         if(!enabled){
@@ -37,9 +37,9 @@ TextField{
         return placeholderNormalColor
     }
     selectByMouse: true
+    width: 240
     background: FluTextBoxBackground{
         inputItem: control
-        implicitWidth: 240
     }
     Keys.onEnterPressed: (event)=> d.handleCommit(event)
     Keys.onReturnPressed:(event)=> d.handleCommit(event)

src/Qt5/imports/FluentUI/Controls/FluPivot.qml

@@ -36,7 +36,7 @@ Page {
             Rectangle{
                 height: 3
                 radius: 1.5
-                color: FluTheme.primaryColor.dark
+                color: FluTheme.primaryColor
                 width: nav_list.currentItem ? nav_list.currentItem.width : 0
                 y:d.tabY
                 Behavior on width {
@@ -84,7 +84,7 @@ Page {
         anchors.fill: parent
         Repeater{
             model:d.children
-            Loader{
+            FluLoader{
                 property var argument: modelData.argument
                 anchors.fill: parent
                 sourceComponent: modelData.contentItem

src/Qt5/imports/FluentUI/Controls/FluPopup.qml

@@ -11,13 +11,6 @@ Popup {
     anchors.centerIn: Overlay.overlay
     closePolicy: Popup.CloseOnEscape
     enter: Transition {
-        NumberAnimation {
-            properties: "scale"
-            from:1.2
-            to:1
-            duration: FluTheme.enableAnimation ? 83 : 0
-            easing.type: Easing.OutCubic
-        }
         NumberAnimation {
             property: "opacity"
             duration: FluTheme.enableAnimation ? 83 : 0
@@ -26,13 +19,6 @@ Popup {
         }
     }
     exit:Transition {
-        NumberAnimation {
-            properties: "scale"
-            from:1
-            to:1.2
-            duration: FluTheme.enableAnimation ? 83 : 0
-            easing.type: Easing.OutCubic
-        }
         NumberAnimation {
             property: "opacity"
             duration: FluTheme.enableAnimation ? 83 : 0
@@ -43,5 +29,8 @@ Popup {
     background: FluRectangle{
         radius: [5,5,5,5]
         color: FluTheme.dark ? Qt.rgba(43/255,43/255,43/255,1) : Qt.rgba(1,1,1,1)
+        FluShadow{
+            radius: 5
+        }
     }
 }

src/Qt5/imports/FluentUI/Controls/FluProgressBar.qml

@@ -5,7 +5,7 @@ import FluentUI 1.0
 ProgressBar{
     property real strokeWidth: 6
     property bool progressVisible: false
-    property color color: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color color: FluTheme.primaryColor
     property color backgroundColor : FluTheme.dark ? Qt.rgba(99/255,99/255,99/255,1) : Qt.rgba(214/255,214/255,214/255,1)
     id:control
     indeterminate : true

src/Qt5/imports/FluentUI/Controls/FluProgressButton.qml

@@ -12,7 +12,7 @@ Button {
     }
     property color normalColor: {
         if(d.checked){
-            return FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+            return FluTheme.primaryColor
         }else{
             return FluTheme.dark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(254/255,254/255,254/255,1)
         }
@@ -66,7 +66,7 @@ Button {
             width: parent.width  * control.progress
             height: control.progress === 1 ? background.height : 3
             visible: !d.checked
-            color: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+            color: FluTheme.primaryColor
             anchors.bottom: parent.bottom
             Behavior on height{
                 enabled: control.progress !== 1

src/Qt5/imports/FluentUI/Controls/FluProgressRing.qml

@@ -6,7 +6,7 @@ import FluentUI 1.0
 ProgressBar{
     property real strokeWidth: 6
     property bool progressVisible: false
-    property color color: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color color: FluTheme.primaryColor
     property color backgroundColor : FluTheme.dark ? Qt.rgba(99/255,99/255,99/255,1) : Qt.rgba(214/255,214/255,214/255,1)
     id:control
     indeterminate : true

src/Qt5/imports/FluentUI/Controls/FluRadioButton.qml

@@ -6,7 +6,7 @@ import FluentUI 1.0
 Button {
     property string contentDescription: ""
     property bool disabled: false
-    property color borderNormalColor: checked ? FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark : FluTheme.dark ? Qt.rgba(161/255,161/255,161/255,1) : Qt.rgba(141/255,141/255,141/255,1)
+    property color borderNormalColor: checked ? FluTheme.primaryColor : FluTheme.dark ? Qt.rgba(161/255,161/255,161/255,1) : Qt.rgba(141/255,141/255,141/255,1)
     property color borderDisableColor:  FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(198/255,198/255,198/255,1)
     property color normalColor: FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(1,1,1,1)
     property color hoverColor: checked ? FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(1,1,1,1) : FluTheme.dark ? Qt.rgba(43/255,43/255,43/255,1) : Qt.rgba(222/255,222/255,222/255,1)

src/Qt5/imports/FluentUI/Controls/FluRangeSlider.qml

@@ -41,7 +41,7 @@ T.RangeSlider {
                 }
                 return control.first.hovered ? 1.2 : 1
             }
-            iconColor:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
+            iconColor: FluTheme.primaryColor
             anchors.centerIn: parent
             Behavior on scale{
                 NumberAnimation{
@@ -72,7 +72,7 @@ T.RangeSlider {
                 }
                 return control.second.hovered ? 1.2 : 1
             }
-            iconColor:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
+            iconColor: FluTheme.primaryColor
             anchors.centerIn: parent
             Behavior on scale{
                 NumberAnimation{
@@ -101,7 +101,7 @@ T.RangeSlider {
             y: control.horizontal ? 0 : control.second.visualPosition * parent.height + 3
             width: control.horizontal ? control.second.position * parent.width - control.first.position * parent.width - 6 : 6
             height: control.horizontal ? 6 : control.second.position * parent.height - control.first.position * parent.height - 6
-            color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
+            color: FluTheme.primaryColor
         }
     }
     FluTooltip{

src/Qt5/imports/FluentUI/Controls/FluRatingControl.qml

@@ -32,7 +32,7 @@ Item {
                     }
                     iconSize: control.size
                     iconSource: isSelected ? FluentIcons.FavoriteStarFill : FluentIcons.FavoriteStar
-                    iconColor: isSelected ? FluTheme.primaryColor.dark : (FluTheme.dark ? "#FFFFFF" : "#000000")
+                    iconColor: isSelected ? FluTheme.primaryColor : (FluTheme.dark ? "#FFFFFF" : "#000000")
                     anchors.centerIn: parent
                 }
             }

src/Qt5/imports/FluentUI/Controls/FluRemoteLoader.qml

@@ -15,7 +15,7 @@ FluStatusView {
             loader.source = control.source
         }
     }
-    Loader{
+    FluLoader{
         id:loader
         anchors.fill: parent
         asynchronous: true

src/Qt5/imports/FluentUI/Controls/FluScreenshot.qml

@@ -11,7 +11,7 @@ Item{
     property int dotSize: 5
     property int borderSize: 1
     property var saveFolder: StandardPaths.standardLocations(StandardPaths.PicturesLocation)[0]
-    property color borderColor: FluTheme.primaryColor.dark
+    property color borderColor: FluTheme.primaryColor
     signal captrueCompleted(var captrue)
     QtObject{
         id:d
@@ -508,7 +508,7 @@ Item{
                     }
                     FluIconButton{
                         iconSource: FluentIcons.AcceptMedium
-                        iconColor: FluTheme.primaryColor.dark
+                        iconColor: FluTheme.primaryColor
                         onClicked: {
                             screenshot_background.capture(screenshot.start,screenshot.end)
                         }

src/Qt5/imports/FluentUI/Controls/FluSlider.qml

@@ -39,7 +39,7 @@ T.Slider {
                 }
                 return control.hovered ? 1.2 : 1
             }
-            iconColor:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
+            iconColor: FluTheme.primaryColor
             anchors.centerIn: parent
         }
     }
@@ -62,7 +62,7 @@ T.Slider {
             width: control.horizontal ? control.position * parent.width : 6
             height: control.horizontal ? 6 : control.position * parent.height
             radius: 3
-            color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
+            color: FluTheme.primaryColor
         }
     }
     FluTooltip{

src/Qt5/imports/FluentUI/Controls/FluSpinBox.qml

@@ -39,7 +39,7 @@ T.SpinBox {
             }
             return normalColor
         }
-        selectionColor: FluTools.colorAlpha(FluTheme.primaryColor.lightest,0.6)
+        selectionColor: FluTools.colorAlpha(FluTheme.primaryColor,0.5)
         selectedTextColor: color
         horizontalAlignment: Qt.AlignHCenter
         verticalAlignment: Qt.AlignVCenter
@@ -52,10 +52,13 @@ T.SpinBox {
             anchors.bottom: parent.bottom
             visible: contentItem.enabled
             color: {
+                if(contentItem.activeFocus){
+                    return FluTheme.primaryColor
+                }
                 if(FluTheme.dark){
-                    contentItem.activeFocus ? FluTheme.primaryColor.lighter  : Qt.rgba(166/255,166/255,166/255,1)
+                    return Qt.rgba(166/255,166/255,166/255,1)
                 }else{
-                    return contentItem.activeFocus ? FluTheme.primaryColor.dark  : Qt.rgba(183/255,183/255,183/255,1)
+                    return Qt.rgba(183/255,183/255,183/255,1)
                 }
             }
             Behavior on height{

src/Qt5/imports/FluentUI/Controls/FluStatusView.qml

@@ -23,7 +23,7 @@ Item{
         anchors.fill: parent
         visible: statusMode===FluStatusViewType.Success
     }
-    Loader{
+    FluLoader{
         id:loader
         anchors.fill: parent
         visible: statusMode!==FluStatusViewType.Success

src/Qt5/imports/FluentUI/Controls/FluTabView.qml

@@ -189,23 +189,13 @@ Item {
                         anchors.fill: parent
                         radius: [6,6,0,0]
                         color: {
-                            if(FluTheme.dark){
-                                if(item_mouse_hove.containsMouse || item_btn_close.hovered){
-                                    return Qt.rgba(1,1,1,0.03)
-                                }
-                                if(tab_nav.currentIndex === index){
-                                    return Qt.rgba(1,1,1,0.06)
-                                }
-                                return Qt.rgba(0,0,0,0)
-                            }else{
-                                if(item_mouse_hove.containsMouse || item_btn_close.hovered){
-                                    return Qt.rgba(0,0,0,0.03)
-                                }
-                                if(tab_nav.currentIndex === index){
-                                    return Qt.rgba(0,0,0,0.06)
-                                }
-                                return Qt.rgba(0,0,0,0)
+                            if(item_mouse_hove.containsMouse || item_btn_close.hovered){
+                                return FluTheme.itemHoverColor
                             }
+                            if(tab_nav.currentIndex === index){
+                                return FluTheme.itemCheckColor
+                            }
+                            return FluTheme.itemNormalColor
                         }
                     }
                     RowLayout{
@@ -264,6 +254,7 @@ Item {
                     FluDivider{
                         width: 1
                         height: 16
+                        orientation: Qt.Vertical
                         anchors{
                             verticalCenter: parent.verticalCenter
                             right: parent.right
@@ -283,7 +274,7 @@ Item {
         }
         Repeater{
             model:tab_model
-            Loader{
+            FluLoader{
                 property var argument: model.argument
                 anchors.fill: parent
                 sourceComponent: model.page

src/Qt5/imports/FluentUI/Controls/FluTableView.qml

@@ -269,7 +269,7 @@ Rectangle {
                         Rectangle{
                             height: 18
                             radius: 1.5
-                            color: FluTheme.primaryColor.dark
+                            color: FluTheme.primaryColor
                             width: 3
                             visible: d.currentRow === table_model.getRow(row).__index && column === 0
                             anchors{
@@ -301,7 +301,7 @@ Rectangle {
                                     event.accepted = true
                                 }
                         }
-                        Loader{
+                        FluLoader{
                             property var itemModel: model
                             property var modelData: display
                             property var tableView: table_view
@@ -341,7 +341,7 @@ Rectangle {
                 onEntered: {
                     d.rowHoverIndex = -1
                 }
-                Loader{
+                FluLoader{
                     id:item_loader
                     property var display
                     property int column
@@ -393,8 +393,10 @@ Rectangle {
             property bool canceled: false
             property int columnIndex: column
             readonly property var obj : columnSource[column]
-            implicitWidth: item_column_loader.item.implicitWidth + (cellPadding * 2)
-            implicitHeight: Math.max(36, item_column_loader.item.implicitHeight + (cellPadding * 2))
+            implicitWidth: {
+                return (item_column_loader.item && item_column_loader.item.implicitWidth) + (cellPadding * 2)
+            }
+            implicitHeight: Math.max(36, (item_column_loader.item&&item_column_loader.item.implicitHeight) + (cellPadding * 2))
             color: FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(247/255,247/255,247/255,1)
             Rectangle{
                 border.color: control.borderColor
@@ -443,7 +445,7 @@ Rectangle {
                         closeEditor()
                     }
             }
-            Loader{
+            FluLoader{
                 id:item_column_loader
                 property var itemModel: model
                 property var modelData: model.display

src/Qt5/imports/FluentUI/Controls/FluText.qml

@@ -3,7 +3,7 @@ import QtQuick.Controls 2.15
 import FluentUI 1.0
 
 Text {
-    property color textColor: FluTheme.dark ? FluColors.White : FluColors.Grey220
+    property color textColor: FluTheme.fontPrimaryColor
     id:text
     color: textColor
     renderType: FluTheme.nativeText ? Text.NativeRendering : Text.QtRendering

src/Qt5/imports/FluentUI/Controls/FluTextBox.qml

@@ -25,7 +25,7 @@ TextField{
     }
     font:FluTextStyle.Body
     renderType: FluTheme.nativeText ? Text.NativeRendering : Text.QtRendering
-    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor.lightest,0.6)
+    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor,0.5)
     selectedTextColor: color
     placeholderTextColor: {
         if(!enabled){
@@ -46,9 +46,9 @@ TextField{
             w = 0
         return icon_end.visible ? w+36 : w+10
     }
+    width: 240
     background: FluTextBoxBackground{
         inputItem: control
-        implicitWidth: 240
     }
     Keys.onEnterPressed: (event)=> d.handleCommit(event)
     Keys.onReturnPressed:(event)=> d.handleCommit(event)

src/Qt5/imports/FluentUI/Controls/FluTextBoxBackground.qml

@@ -36,10 +36,13 @@ FluClip{
         anchors.bottom: parent.bottom
         visible: !inputItem.disabled
         color: {
+            if(inputItem.activeFocus){
+                return FluTheme.primaryColor
+            }
             if(FluTheme.dark){
-                return inputItem.activeFocus ? FluTheme.primaryColor.lighter  : Qt.rgba(166/255,166/255,166/255,1)
+                return Qt.rgba(166/255,166/255,166/255,1)
             }else{
-                return inputItem.activeFocus ? FluTheme.primaryColor.dark  : Qt.rgba(134/255,134/255,134/255,1)
+                return Qt.rgba(134/255,134/255,134/255,1)
             }
         }
         Behavior on height{

src/Qt5/imports/FluentUI/Controls/FluTextButton.qml

@@ -5,14 +5,14 @@ import FluentUI 1.0
 Button {
     property bool disabled: false
     property string contentDescription: ""
-    property color normalColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color normalColor: FluTheme.primaryColor
     property color hoverColor: FluTheme.dark ? Qt.darker(normalColor,1.15) : Qt.lighter(normalColor,1.15)
     property color pressedColor: FluTheme.dark ? Qt.darker(normalColor,1.3) : Qt.lighter(normalColor,1.3)
     property color disableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(199/255,199/255,199/255,1)
-    property color backgroundHoverColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-    property color backgroundPressedColor: FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
-    property color backgroundNormalColor: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
-    property color backgroundDisableColor: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
+    property color backgroundHoverColor: FluTheme.itemHoverColor
+    property color backgroundPressedColor: FluTheme.itemPressColor
+    property color backgroundNormalColor: FluTheme.itemNormalColor
+    property color backgroundDisableColor: FluTheme.itemNormalColor
     property bool textBold: true
     property color textColor: {
         if(!enabled){

src/Qt5/imports/FluentUI/Controls/FluTimePicker.qml

@@ -184,11 +184,7 @@ Rectangle {
                                 anchors.rightMargin: 5
                                 color:  {
                                     if(getListView().currentIndex === position){
-                                        if(FluTheme.dark){
-                                            return  item_mouse.containsMouse ? Qt.darker(FluTheme.primaryColor.lighter,1.1) : FluTheme.primaryColor.lighter
-                                        }else{
-                                            return  item_mouse.containsMouse ? Qt.lighter(FluTheme.primaryColor.dark,1.1): FluTheme.primaryColor.dark
-                                        }
+                                        return  item_mouse.containsMouse ? Qt.darker(FluTheme.primaryColor,1.1) : FluTheme.primaryColor
                                     }
                                     if(item_mouse.containsMouse){
                                         return FluTheme.dark ? Qt.rgba(63/255,60/255,61/255,1) : Qt.rgba(237/255,237/255,242/255,1)
@@ -242,7 +238,7 @@ Rectangle {
                         highlightMoveDuration: 0
                         model: isH ? generateArray(1,12) : generateArray(0,23)
                         clip: true
-                        delegate: Loader{
+                        delegate: FluLoader{
                             property var model: modelData
                             property int type:0
                             property int position:index
@@ -265,7 +261,7 @@ Rectangle {
                         highlightMoveDuration: 0
                         ScrollBar.vertical: FluScrollBar {}
                         boundsBehavior:Flickable.StopAtBounds
-                        delegate: Loader{
+                        delegate: FluLoader{
                             property var model: modelData
                             property int type:1
                             property int position:index
@@ -291,7 +287,7 @@ Rectangle {
                         ScrollBar.vertical: FluScrollBar {}
                         Layout.alignment: Qt.AlignVCenter
                         boundsBehavior:Flickable.StopAtBounds
-                        delegate: Loader{
+                        delegate: FluLoader{
                             property var model: modelData
                             property int type:2
                             property int position:index

src/Qt5/imports/FluentUI/Controls/FluTimeline.qml

@@ -82,7 +82,7 @@ Item{
             radius: 8
             border.width: 4
             color:FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
-            border.color: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+            border.color: FluTheme.primaryColor
         }
     }
 
@@ -92,7 +92,7 @@ Item{
             wrapMode: Text.WrapAnywhere
             horizontalAlignment: isRight ? Qt.AlignRight : Qt.AlignLeft
             text: modelData.lable
-            color: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+            color: FluTheme.primaryColor
         }
     }
 
@@ -116,7 +116,7 @@ Item{
                 id:item_layout
                 width: layout_column.width
                 height: loader_text.height
-                Loader{
+                FluLoader{
                     id:item_loader
                     state: d.stateName
                     states: [
@@ -149,7 +149,7 @@ Item{
                     }
                 }
 
-                Loader{
+                FluLoader{
                     property var modelData: control.model.get(index)
                     property bool isRight: state === "Right"
                     id:loader_lable
@@ -219,7 +219,7 @@ Item{
                     ]
                 }
 
-                Loader{
+                FluLoader{
                     id:loader_text
                     property var modelData: control.model.get(index)
                     property bool isRight: state === "Right"

src/Qt5/imports/FluentUI/Controls/FluToggleButton.qml

@@ -7,7 +7,7 @@ Button {
     property string contentDescription: ""
     property color normalColor: {
         if(checked){
-           return FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+           return FluTheme.primaryColor
         }else{
            return FluTheme.dark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(254/255,254/255,254/255,1)
         }

src/Qt5/imports/FluentUI/Controls/FluToggleSwitch.qml

@@ -7,11 +7,11 @@ Button {
     property bool disabled: false
     property string contentDescription: ""
     property color disableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(233/255,233/255,233/255,1)
-    property color checkColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color checkColor: FluTheme.primaryColor
     property color hoverColor: FluTheme.dark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(240/255,240/255,240/255,1)
     property color normalColor: FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(253/255,253/255,253/255,1)
     property color borderNormalColor: FluTheme.dark ? Qt.rgba(161/255,161/255,161/255,1) : Qt.rgba(141/255,141/255,141/255,1)
-    property color borderCheckColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color borderCheckColor: FluTheme.primaryColor
     property color borderDisableColor: FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(200/255,200/255,200/255,1)
     property color dotNormalColor: FluTheme.dark ? Qt.rgba(208/255,208/255,208/255,1) : Qt.rgba(93/255,93/255,93/255,1)
     property color dotCheckColor: FluTheme.dark ? Qt.rgba(0/255,0/255,0/255,1) : Qt.rgba(255/255,255/255,255/255,1)
@@ -46,8 +46,8 @@ Button {
         layoutDirection:control.textRight ? Qt.LeftToRight : Qt.RightToLeft
         Rectangle {
             id:control_backgound
-            width: background.width
-            height: background.height
+            implicitWidth: background.implicitWidth
+            implicitHeight: background.implicitHeight
             radius: height / 2
             FluFocusRectangle{
                 visible: control.activeFocus

src/Qt5/imports/FluentUI/Controls/FluTour.qml

@@ -155,7 +155,7 @@ Popup{
                 leftMargin: 15
             }
         }
-        Loader{
+        FluLoader{
             id:loader_next
             property bool isEnd: control.index === steps.length-1
             sourceComponent: com_next_button
@@ -166,7 +166,7 @@ Popup{
                 rightMargin: 15
             }
         }
-        Loader{
+        FluLoader{
             id:loader_prev
             visible: control.index !== 0
             sourceComponent: com_prev_button

src/Qt5/imports/FluentUI/Controls/FluTreeView.qml

@@ -22,7 +22,7 @@ Item {
         property int dropIndex: -1
         property bool isDropTopArea: false
         property int dragIndex: -1
-        property color hitColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+        property color hitColor: FluTheme.primaryColor
     }
     onDataSourceChanged: {
         tree_model.setDataSource(dataSource)
@@ -86,7 +86,7 @@ Item {
             ListView.onPooled: {
                 item_loader_container.item.pooled()
             }
-            Loader{
+            FluLoader{
                 property var itemControl: item_control
                 property var itemModel: dataModel
                 property int rowIndex: index
@@ -95,7 +95,7 @@ Item {
                 sourceComponent: com_item_container
             }
         }
-        Loader{
+        FluLoader{
             id:loader_container
             property var itemControl
             property var itemModel
@@ -138,7 +138,7 @@ Item {
                 width: 3
                 height: 18
                 radius: 1.5
-                color: FluTheme.primaryColor.dark
+                color: FluTheme.primaryColor
                 visible: isCurrent
                 anchors{
                     left: parent.left
@@ -322,29 +322,16 @@ Item {
                 border.color: d.hitColor
                 border.width: d.dragIndex === rowIndex ? 1 : 0
                 color: {
-                    if(FluTheme.dark){
-                        if(isCurrent){
-                            return Qt.rgba(1,1,1,0.06)
-                        }
-                        if(item_mouse.containsMouse || item_check_box.hovered){
-                            return Qt.rgba(1,1,1,0.03)
-                        }
-                        if(item_loader_expand.item && item_loader_expand.item.hovered){
-                            return Qt.rgba(1,1,1,0.03)
-                        }
-                        return Qt.rgba(0,0,0,0)
-                    }else{
-                        if(isCurrent){
-                            return Qt.rgba(0,0,0,0.06)
-                        }
-                        if(item_mouse.containsMouse || item_check_box.hovered){
-                            return Qt.rgba(0,0,0,0.03)
-                        }
-                        if(item_loader_expand.item && item_loader_expand.item.hovered){
-                            return Qt.rgba(0,0,0,0.03)
-                        }
-                        return Qt.rgba(0,0,0,0)
+                    if(isCurrent){
+                        return FluTheme.itemCheckColor
                     }
+                    if(item_mouse.containsMouse || item_check_box.hovered){
+                        return FluTheme.itemHoverColor
+                    }
+                    if(item_loader_expand.item && item_loader_expand.item.hovered){
+                        return FluTheme.itemHoverColor
+                    }
+                    return FluTheme.itemNormalColor
                 }
             }
             RowLayout{
@@ -370,7 +357,7 @@ Item {
                     }
                 }
 
-                Loader{
+                FluLoader{
                     id:item_loader_expand
                     Layout.preferredWidth: 20
                     Layout.preferredHeight: 20
@@ -394,7 +381,7 @@ Item {
                     }
                     Layout.alignment: Qt.AlignVCenter
                 }
-                Loader{
+                FluLoader{
                     property var dataModel: itemModel
                     property var itemMouse: item_mouse
                     id:item_loader_cell

src/Qt5/imports/FluentUI/Controls/FluWindow.qml

@@ -14,16 +14,20 @@ Window {
     property bool fixSize: false
     property Component loadingItem: com_loading
     property var appBar: com_app_bar
-    flags: Qt.Window | Qt.CustomizeWindowHint | Qt.WindowTitleHint | Qt.WindowSystemMenuHint | Qt.WindowMinMaxButtonsHint | Qt.WindowCloseButtonHint
     property color backgroundColor: {
         if(active){
-            return FluTheme.dark ? Qt.rgba(26/255,34/255,40/255,1) : Qt.rgba(243/255,243/255,243/255,1)
+            return FluTheme.windowActiveBackgroundColor
         }
-        return FluTheme.dark ? Qt.rgba(32/255,32/255,32/255,1) : Qt.rgba(237/255,237/255,237/255,1)
+        return FluTheme.windowBackgroundColor
     }
     property bool stayTop: false
     property var _pageRegister
     property string _route
+    property bool showDark: false
+    property bool showClose: true
+    property bool showMinimize: true
+    property bool showMaximize: true
+    property bool showStayTop: true
     property var closeListener: function(event){
         if(closeDestory){
             destoryOnClose()
@@ -49,19 +53,23 @@ Window {
     onVisibleChanged: {
         lifecycle.onVisible(visible)
     }
-    onVisibilityChanged: {
-        console.debug(visibility)
-    }
     QtObject{
         id:d
         function changedStayTop(){
-            var visibility = window.visibility
-            if(window.stayTop){
-                window.flags = window.flags | Qt.WindowStaysOnTopHint
-            }else{
-                window.flags = window.flags &~ Qt.WindowStaysOnTopHint
+            function toggleStayTop(){
+                if(window.stayTop){
+                    window.flags = window.flags | Qt.WindowStaysOnTopHint
+                }else{
+                    window.flags = window.flags &~ Qt.WindowStaysOnTopHint
+                }
+            }
+            if(window.visibility === Window.Maximized){
+                window.visibility = Window.Windowed
+                toggleStayTop()
+                window.visibility = Window.Maximized
+            }else{
+                toggleStayTop()
             }
-            window.visibility = visibility
         }
     }
     Connections{
@@ -78,13 +86,18 @@ Window {
         id:com_app_bar
         FluAppBar {
             title: window.title
+            showDark: window.showDark
+            showClose: window.showClose
+            showMinimize: window.showMinimize
+            showMaximize: window.showMaximize
+            showStayTop: window.showStayTop
         }
     }
-    Loader{
+    FluLoader{
         anchors.fill: parent
         sourceComponent: background
     }
-    Loader{
+    FluLoader{
         id: loader_title_bar
         anchors {
             top: parent.top
@@ -103,7 +116,7 @@ Window {
         }
         clip: true
     }
-    Loader{
+    FluLoader{
         property string loadingText: "加载中..."
         property bool cancel: false
         id:loader_loading
@@ -187,6 +200,7 @@ Window {
     FramelessHelper{
         id:framless_helper
         onReady: {
+            flags = flags | Qt.Window | Qt.CustomizeWindowHint | Qt.WindowTitleHint | Qt.WindowSystemMenuHint | Qt.WindowMinMaxButtonsHint | Qt.WindowCloseButtonHint
             if(appBar){
                 var title_bar = loader_title_bar.item
                 setTitleBarItem(title_bar)
@@ -208,6 +222,19 @@ Window {
     }
     WindowBorder{
         z:999
+        visible: !FluTools.isLinux()
+    }
+    Rectangle{
+        anchors.fill: parent
+        color: "#00000000"
+        border.width: 1
+        visible: FluTools.isLinux()
+        border.color: {
+            if(window.active){
+                return "#333333"
+            }
+            return "#999999"
+        }
     }
     function destoryOnClose(){
         lifecycle.onDestoryOnClose()

src/Qt5/imports/FluentUI/qmldir

@@ -95,4 +95,5 @@ FluStaggeredView 1.0 Controls/FluStaggeredView.qml
 FluProgressButton 1.0 Controls/FluProgressButton.qml
 FluLoadingButton 1.0 Controls/FluLoadingButton.qml
 FluClip 1.0 Controls/FluClip.qml
+FluLoader 1.0 Controls/FluLoader.qml
 plugin fluentuiplugin

src/Qt5/imports/fluentui.qrc

@@ -95,5 +95,6 @@
         <file>FluentUI/Controls/ColorPicker/Content/SBPicker.qml</file>
         <file>FluentUI/Controls/FluLoadingButton.qml</file>
         <file>FluentUI/Controls/FluClip.qml</file>
+        <file>FluentUI/Controls/FluLoader.qml</file>
     </qresource>
 </RCC>

src/Qt6/imports/FluentUI/Controls/FluAppBar.qml

@@ -14,12 +14,12 @@ Rectangle{
     property string stayTopText : "置顶"
     property string stayTopCancelText : "取消置顶"
     property color textColor: FluTheme.dark ? "#FFFFFF" : "#000000"
-    property color minimizeNormalColor: Qt.rgba(0,0,0,0)
-    property color minimizeHoverColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-    property color minimizePressColor: FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
-    property color maximizeNormalColor: Qt.rgba(0,0,0,0)
-    property color maximizeHoverColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-    property color maximizePressColor: FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
+    property color minimizeNormalColor: FluTheme.itemNormalColor
+    property color minimizeHoverColor: FluTheme.itemHoverColor
+    property color minimizePressColor: FluTheme.itemPressColor
+    property color maximizeNormalColor: FluTheme.itemNormalColor
+    property color maximizeHoverColor: FluTheme.itemHoverColor
+    property color maximizePressColor: FluTheme.itemPressColor
     property color closeNormalColor: Qt.rgba(0,0,0,0)
     property color closeHoverColor:  Qt.rgba(251/255,115/255,115/255,1)
     property color closePressColor: Qt.rgba(251/255,115/255,115/255,0.8)
@@ -32,7 +32,7 @@ Rectangle{
     property url icon
     property int iconSize: 20
     property bool isMac: FluTools.isMacos()
-    property color borerlessColor : FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color borerlessColor : FluTheme.primaryColor
     property var maxClickListener : function(){
         if (d.win.visibility === Window.Maximized)
             d.win.visibility = Window.Windowed
@@ -135,7 +135,7 @@ Rectangle{
             }
             text:d.stayTop ? control.stayTopCancelText : control.stayTopText
             radius: 0
-            iconColor: d.stayTop ? (FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark) : control.textColor
+            iconColor: d.stayTop ? FluTheme.primaryColor : control.textColor
             onClicked: stayTopClickListener()
         }
         FluIconButton{

src/Qt6/imports/FluentUI/Controls/FluCalendarView.qml

@@ -65,7 +65,7 @@ Item {
                     height: 50
                     radius: 25
                     visible: isYear
-                    color: FluTheme.primaryColor.dark
+                    color: FluTheme.primaryColor
                 }
                 FluText{
                     text:date.getFullYear()
@@ -124,7 +124,7 @@ Item {
                     height: 50
                     radius: 25
                     visible: isMonth
-                    color: FluTheme.primaryColor.dark
+                    color: FluTheme.primaryColor
                 }
                 FluText{
                     text:(date.getMonth()+1)+"月"
@@ -184,7 +184,7 @@ Item {
                     radius: 18
                     color:"#00000000"
                     visible: isDay
-                    border.color: FluTheme.primaryColor.dark
+                    border.color: FluTheme.primaryColor
                     border.width: 1
                 }
                 Rectangle{
@@ -194,7 +194,7 @@ Item {
                     height: 30
                     radius: 15
                     visible: isToDay
-                    color: FluTheme.primaryColor.dark
+                    color: FluTheme.primaryColor
                 }
                 FluText{
                     text:date.getDate()
@@ -331,7 +331,7 @@ Item {
                 cellWidth: displayMode === FluCalendarViewType.Month ? 40 : 70
                 clip: true
                 boundsBehavior:Flickable.StopAtBounds
-                delegate: Loader{
+                delegate: FluLoader{
                     property var modelData : model
                     property var name : model.name
                     property var date : model.date

src/Qt6/imports/FluentUI/Controls/FluCarousel.qml

@@ -75,7 +75,7 @@ Item {
                     return 0
                 return index-1
             }
-            Loader{
+            FluLoader{
                 property int displayIndex : item_control.displayIndex
                 property var model: list_view.model.get(index)
                 anchors.fill: parent
@@ -124,9 +124,9 @@ Item {
                 radius: 4
             }
             scale: checked ? 1.2 : 1
-            color: checked ?  FluTheme.primaryColor.dark : Qt.rgba(1,1,1,0.7)
+            color: checked ?  FluTheme.primaryColor : Qt.rgba(1,1,1,0.7)
             border.width: mouse_item.containsMouse ? 1 : 0
-            border.color: FluTheme.primaryColor.dark
+            border.color: FluTheme.primaryColor
             MouseArea{
                 id:mouse_item
                 hoverEnabled: true
@@ -156,7 +156,7 @@ Item {
         Repeater{
             id:repeater_indicator
             model: list_view.count
-            Loader{
+            FluLoader{
                 property int displayIndex: {
                     if(index === 0)
                         return list_view.count-3

src/Qt6/imports/FluentUI/Controls/FluCheckBox.qml

@@ -1,6 +1,5 @@
 import QtQuick
 import QtQuick.Controls
-import QtQuick.Controls.Basic
 import QtQuick.Layouts
 import FluentUI
 
@@ -8,12 +7,12 @@ Button {
     property bool disabled: false
     property string contentDescription: ""
     property color borderNormalColor: FluTheme.dark ? Qt.rgba(160/255,160/255,160/255,1) : Qt.rgba(136/255,136/255,136/255,1)
-    property color bordercheckedColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color bordercheckedColor: FluTheme.primaryColor
     property color borderHoverColor: FluTheme.dark ? Qt.rgba(167/255,167/255,167/255,1) : Qt.rgba(135/255,135/255,135/255,1)
     property color borderDisableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(199/255,199/255,199/255,1)
     property color borderPressedColor: FluTheme.dark ? Qt.rgba(90/255,90/255,90/255,1) : Qt.rgba(191/255,191/255,191/255,1)
     property color normalColor: FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(247/255,247/255,247/255,1)
-    property color checkedColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color checkedColor: FluTheme.primaryColor
     property color hoverColor: FluTheme.dark ? Qt.rgba(72/255,72/255,72/255,1) : Qt.rgba(236/255,236/255,236/255,1)
     property color checkedHoverColor: FluTheme.dark ? Qt.darker(checkedColor,1.15) : Qt.lighter(checkedColor,1.15)
     property color checkedPreesedColor: FluTheme.dark ? Qt.darker(checkedColor,1.3) : Qt.lighter(checkedColor,1.3)
@@ -31,6 +30,11 @@ Button {
     id:control
     enabled: !disabled
     onClicked: clickListener()
+    onCheckableChanged: {
+        if(checkable){
+            checkable = false
+        }
+    }
     background: Item{
         FluFocusRectangle{
             radius: 4

src/Qt6/imports/FluentUI/Controls/FluColorPicker.qml

@@ -1,6 +1,5 @@
 import QtQuick
 import QtQuick.Controls
-import QtQuick.Controls.Basic
 import QtQuick.Layouts
 import QtQuick.Window
 import FluentUI
@@ -20,7 +19,7 @@ Button{
         color:"#00000000"
         border.color: {
             if(hovered)
-                return FluTheme.primaryColor.light
+                return FluTheme.primaryColor
             return FluTheme.dark ? Qt.rgba(100/255,100/255,100/255,1) : Qt.rgba(200/255,200/255,200/255,1)
         }
         border.width: 1
@@ -31,6 +30,7 @@ Button{
             radius: 5
             color: control.colorValue
         }
+
     }
     Item{
         id: d

src/Qt6/imports/FluentUI/Controls/FluComboBox.qml

@@ -45,7 +45,7 @@ T.ComboBox {
         topPadding: 6 - control.padding
         bottomPadding: 6 - control.padding
         renderType: FluTheme.nativeText ? Text.NativeRendering : Text.QtRendering
-        selectionColor: Qt.alpha(FluTheme.primaryColor.lightest,0.6)
+        selectionColor: FluTools.colorAlpha(FluTheme.primaryColor,0.5)
         selectedTextColor: color
         text: control.editable ? control.editText : control.displayText
         enabled: control.editable
@@ -108,6 +108,7 @@ T.ComboBox {
             model: control.delegateModel
             currentIndex: control.highlightedIndex
             highlightMoveDuration: 0
+            boundsMovement: Flickable.StopAtBounds
             T.ScrollIndicator.vertical: ScrollIndicator { }
         }
         enter: Transition {

src/Qt6/imports/FluentUI/Controls/FluContentDialog.qml

@@ -25,9 +25,6 @@ FluPopup {
         anchors.fill: parent
         color: 'transparent'
         radius:5
-        FluShadow{
-            radius: 5
-        }
         FluText{
             id:text_title
             font: FluTextStyle.TitleLarge

src/Qt6/imports/FluentUI/Controls/FluCopyableText.qml

@@ -17,7 +17,7 @@ TextEdit {
     selectByMouse: true
     selectedTextColor: color
     bottomPadding: 0
-    selectionColor: Qt.alpha(FluTheme.primaryColor.lightest,0.6)
+    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor,0.5)
     font:FluTextStyle.Body
     onSelectedTextChanged: {
         control.forceActiveFocus()

src/Qt6/imports/FluentUI/Controls/FluDatePicker.qml

@@ -169,11 +169,7 @@ Rectangle {
                                 anchors.rightMargin: 5
                                 color:  {
                                     if(getListView().currentIndex === position){
-                                        if(FluTheme.dark){
-                                            return  item_mouse.containsMouse ? Qt.darker(FluTheme.primaryColor.lighter,1.1) : FluTheme.primaryColor.lighter
-                                        }else{
-                                            return  item_mouse.containsMouse ? Qt.lighter(FluTheme.primaryColor.dark,1.1): FluTheme.primaryColor.dark
-                                        }
+                                        return  item_mouse.containsMouse ? Qt.lighter(FluTheme.primaryColor,1.1): FluTheme.primaryColor
                                     }
                                     if(item_mouse.containsMouse){
                                         return FluTheme.dark ? Qt.rgba(63/255,60/255,61/255,1) : Qt.rgba(237/255,237/255,242/255,1)
@@ -236,7 +232,7 @@ Rectangle {
                         preferredHighlightEnd: 0
                         highlightMoveDuration: 0
                         visible: showYear
-                        delegate: Loader{
+                        delegate: FluLoader{
                             property var model: modelData
                             property int type:0
                             property int position:index
@@ -258,7 +254,7 @@ Rectangle {
                         preferredHighlightEnd: 0
                         highlightMoveDuration: 0
                         boundsBehavior:Flickable.StopAtBounds
-                        delegate: Loader{
+                        delegate: FluLoader{
                             property var model: modelData
                             property int type:1
                             property int position:index
@@ -281,7 +277,7 @@ Rectangle {
                         ScrollBar.vertical: FluScrollBar {}
                         Layout.alignment: Qt.AlignVCenter
                         boundsBehavior:Flickable.StopAtBounds
-                        delegate: Loader{
+                        delegate: FluLoader{
                             property var model: modelData
                             property int type:2
                             property int position:index

src/Qt6/imports/FluentUI/Controls/FluDivider.qml

@@ -2,16 +2,25 @@ import QtQuick
 import QtQuick.Window
 import FluentUI
 
-Rectangle {
-    property real spacing
-    property alias separatorHeight:separator.height
+Item {
     id:control
-    color:Qt.rgba(0,0,0,0)
-    height: spacing*2+separator.height
+    property int orientation: Qt.Horizontal
+    property int spacing:0
+    property int size: 1
+
+    QtObject{
+        id:d
+        property bool isVertical : orientation === Qt.Vertical
+    }
+
+    width: d.isVertical ? spacing*2+size : parent.width
+    height: d.isVertical ? parent.height : spacing*2+size
+
     FluRectangle{
-        id:separator
         color: FluTheme.dark ? Qt.rgba(80/255,80/255,80/255,1) : Qt.rgba(210/255,210/255,210/255,1)
-        width:parent.width
+        width: d.isVertical ? size : parent.width
+        height: d.isVertical ? parent.height : size
         anchors.centerIn: parent
     }
+
 }

src/Qt6/imports/FluentUI/Controls/FluFilledButton.qml

@@ -6,7 +6,7 @@ import FluentUI
 Button {
     property bool disabled: false
     property string contentDescription: ""
-    property color normalColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color normalColor: FluTheme.primaryColor
     property color hoverColor: FluTheme.dark ? Qt.darker(normalColor,1.1) : Qt.lighter(normalColor,1.1)
     property color disableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(199/255,199/255,199/255,1)
     property color pressedColor: FluTheme.dark ? Qt.darker(normalColor,1.2) : Qt.lighter(normalColor,1.2)

src/Qt6/imports/FluentUI/Controls/FluIconButton.qml

@@ -11,10 +11,10 @@ Button {
     property bool disabled: false
     property int radius:4
     property string contentDescription: ""
-    property color hoverColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-    property color pressedColor: FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
-    property color normalColor: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
-    property color disableColor: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
+    property color hoverColor: FluTheme.itemHoverColor
+    property color pressedColor: FluTheme.itemPressColor
+    property color normalColor: FluTheme.itemNormalColor
+    property color disableColor: FluTheme.itemNormalColor
     property Component iconDelegate: com_icon
     property color color: {
         if(!enabled){
@@ -38,6 +38,7 @@ Button {
             return Qt.rgba(0,0,0,1)
         }
     }
+    property color textColor: FluTheme.fontPrimaryColor
     Accessible.role: Accessible.Button
     Accessible.name: control.text
     Accessible.description: contentDescription
@@ -48,6 +49,7 @@ Button {
     verticalPadding: 8
     horizontalPadding: 8
     enabled: !disabled
+    font:FluTextStyle.Caption
     background: Rectangle{
         implicitWidth: 30
         implicitHeight: 30
@@ -72,7 +74,7 @@ Button {
     Component{
         id:com_row
         RowLayout{
-            Loader{
+            FluLoader{
                 sourceComponent: iconDelegate
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
                 visible: display !== Button.TextOnly
@@ -81,13 +83,15 @@ Button {
                 text:control.text
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
                 visible: display !== Button.IconOnly
+                color: control.textColor
+                font: control.font
             }
         }
     }
     Component{
         id:com_column
         ColumnLayout{
-            Loader{
+            FluLoader{
                 sourceComponent: iconDelegate
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
                 visible: display !== Button.TextOnly
@@ -96,10 +100,12 @@ Button {
                 text:control.text
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
                 visible: display !== Button.IconOnly
+                color: control.textColor
+                font: control.font
             }
         }
     }
-    contentItem:Loader{
+    contentItem:FluLoader{
         sourceComponent: {
             if(display === Button.TextUnderIcon){
                 return com_column

src/Qt6/imports/FluentUI/Controls/FluImage.qml

@@ -11,7 +11,7 @@ Image {
     property Component errorItem : com_error
     property Component loadingItem: com_loading
     id: control
-    Loader{
+    FluLoader{
         anchors.fill: parent
         sourceComponent: {
             if(control.status === Image.Loading){
@@ -26,7 +26,7 @@ Image {
     Component{
         id:com_loading
         Rectangle{
-            color: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
+            color: FluTheme.itemHoverColor
             FluProgressRing{
                 anchors.centerIn: parent
                 visible: control.status === Image.Loading
@@ -36,7 +36,7 @@ Image {
     Component{
         id:com_error
         Rectangle{
-            color: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
+            color: FluTheme.itemHoverColor
             FluFilledButton{
                 text: control.errorButtonText
                 anchors.centerIn: parent

src/Qt6/imports/FluentUI/Controls/FluInfoBar.qml

@@ -86,7 +86,7 @@ FluObject {
                     interval: duration; running: duration > 0; repeat: duration > 0
                     onTriggered: content.close();
                 }
-                Loader{
+                FluLoader{
                     id:loader;
                     x:(parent.width - width) / 2;
                     property var _super: content;
@@ -170,7 +170,7 @@ FluObject {
                             switch(_super.type){
                             case mcontrol.const_success: return Qt.rgba(108/255,203/255,95/255,1);
                             case mcontrol.const_warning: return Qt.rgba(252/255,225/255,0/255,1);
-                            case mcontrol.const_info:    return FluTheme.primaryColor.lighter;
+                            case mcontrol.const_info:    return FluTheme.primaryColor;
                             case mcontrol.const_error:   return Qt.rgba(255/255,153/255,164/255,1);
                             }
                             return "#FFFFFF"
@@ -213,7 +213,7 @@ FluObject {
                             switch(_super.type){
                             case mcontrol.const_success: return Qt.rgba(108/255,203/255,95/255,1);
                             case mcontrol.const_warning: return Qt.rgba(252/255,225/255,0/255,1);
-                            case mcontrol.const_info:    return FluTheme.primaryColor.lighter;
+                            case mcontrol.const_info:    return FluTheme.primaryColor;
                             case mcontrol.const_error:   return Qt.rgba(255/255,153/255,164/255,1);
                             }
                             return "#FFFFFF"

src/Qt6/imports/FluentUI/Controls/FluLoader.qml

@@ -0,0 +1,5 @@
+import QtQuick
+
+Loader {
+    Component.onDestruction: sourceComponent = undefined
+}

src/Qt6/imports/FluentUI/Controls/FluMenuBarItem.qml

@@ -48,23 +48,14 @@ T.MenuBarItem {
         implicitHeight: 30
         radius: 3
         color: {
-            if(FluTheme.dark){
-                if(control.highlighted){
-                    return Qt.rgba(1,1,1,0.06)
-                }
-                if(control.hovered){
-                    return Qt.rgba(1,1,1,0.03)
-                }
-                return Qt.rgba(0,0,0,0)
-            }else{
-                if(control.highlighted){
-                    return Qt.rgba(0,0,0,0.06)
-                }
-                if(control.hovered){
-                    return Qt.rgba(0,0,0,0.03)
-                }
-                return Qt.rgba(0,0,0,0)
+            if(control.highlighted){
+                return FluTheme.itemCheckColor
             }
+            if(control.hovered){
+                return FluTheme.itemHoverColor
+            }
+            return FluTheme.itemNormalColor
         }
     }
 }
+

src/Qt6/imports/FluentUI/Controls/FluMenuItem.qml

@@ -61,7 +61,7 @@ T.MenuItem {
                 right: parent.right
                 rightMargin: (control.mirrored ? indicatorPadding : arrowPadding)+5
             }
-            Loader{
+            FluLoader{
                 id:loader_icon
                 sourceComponent: iconDelegate
                 anchors.verticalCenter: parent.verticalCenter
@@ -99,17 +99,10 @@ T.MenuItem {
             anchors.margins: 3
             radius: 4
             color:{
-                if(FluTheme.dark){
-                    if(control.highlighted){
-                        return Qt.rgba(1,1,1,0.06)
-                    }
-                    return Qt.rgba(0,0,0,0)
-                }else{
-                    if(control.highlighted){
-                        return Qt.rgba(0,0,0,0.06)
-                    }
-                    return Qt.rgba(0,0,0,0)
+                if(control.highlighted){
+                    return FluTheme.itemCheckColor
                 }
+                return FluTheme.itemNormalColor
             }
         }
     }

src/Qt6/imports/FluentUI/Controls/FluMultilineTextBox.qml

@@ -11,6 +11,7 @@ TextArea{
     property color placeholderNormalColor: FluTheme.dark ? Qt.rgba(210/255,210/255,210/255,1) : Qt.rgba(96/255,96/255,96/255,1)
     property color placeholderFocusColor: FluTheme.dark ? Qt.rgba(152/255,152/255,152/255,1) : Qt.rgba(141/255,141/255,141/255,1)
     property color placeholderDisableColor: FluTheme.dark ? Qt.rgba(131/255,131/255,131/255,1) : Qt.rgba(160/255,160/255,160/255,1)
+    property bool isCtrlEnterForNewline: false
     id:control
     enabled: !disabled
     color: {
@@ -25,7 +26,7 @@ TextArea{
     leftPadding: padding+4
     renderType: FluTheme.nativeText ? Text.NativeRendering : Text.QtRendering
     selectedTextColor: color
-    selectionColor: Qt.alpha(FluTheme.primaryColor.lightest,0.6)
+    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor,0.5)
     placeholderTextColor: {
         if(!enabled){
             return placeholderDisableColor
@@ -36,21 +37,28 @@ TextArea{
         return placeholderNormalColor
     }
     selectByMouse: true
-    width: background.implicitWidth
+    width: 240
     background: FluTextBoxBackground{
         inputItem: control
-        implicitWidth: 240
     }
     Keys.onEnterPressed: (event)=> d.handleCommit(event)
     Keys.onReturnPressed:(event)=> d.handleCommit(event)
     QtObject{
         id:d
         function handleCommit(event){
-            if(event.modifiers & Qt.ControlModifier){
+            if(isCtrlEnterForNewline){
+                if(event.modifiers & Qt.ControlModifier){
+                    insert(control.cursorPosition, "\n")
+                    return
+                }
+                control.commit(control.text)
+            }else{
+                if(event.modifiers & Qt.ControlModifier){
+                    control.commit(control.text)
+                    return
+                }
                 insert(control.cursorPosition, "\n")
-                return
             }
-            control.commit(control.text)
         }
     }
     MouseArea{

src/Qt6/imports/FluentUI/Controls/FluNavigationView.qml

@@ -17,8 +17,11 @@ Item {
     property int pageMode: FluNavigationViewType.Stack
     property FluMenu navItemRightMenu
     property FluMenu navItemExpanderRightMenu
+    property int navCompactWidth: 50
+    property int navTopMargin: 0
     property int cellHeight: 38
     property int cellWidth: 300
+    property bool hideNavAppBar: false
     signal logoClicked
     id:control
     Item{
@@ -121,7 +124,7 @@ Item {
                 }
                 return 1
             }
-            separatorHeight: {
+            size: {
                 if(!model){
                     return 1
                 }
@@ -177,6 +180,11 @@ Item {
                     leftMargin: 6
                     rightMargin: 6
                 }
+                FluTooltip {
+                    text: model.title
+                    visible: item_control.hovered && model.title && d.isCompact
+                    delay: 800
+                }
                 MouseArea{
                     anchors.fill: parent
                     acceptedButtons: Qt.RightButton
@@ -200,7 +208,7 @@ Item {
                         if(h+y>control.height){
                             y = control.height - h
                         }
-                        control_popup.showPopup(Qt.point(50,y),h,model.children)
+                        control_popup.showPopup(Qt.point(control.navCompactWidth,y),h,model.children)
                         return
                     }
                     model.isExpand = !model.isExpand
@@ -240,7 +248,7 @@ Item {
                         width: 3
                         height: 18
                         radius: 1.5
-                        color: FluTheme.primaryColor.dark
+                        color: FluTheme.primaryColor
                         visible: {
                             if(!model){
                                 return false
@@ -292,25 +300,15 @@ Item {
                     }
                     color: {
                         if(!item_control.enabled){
-                            return Qt.rgba(0,0,0,0)
+                            return FluTheme.itemNormalColor
                         }
-                        if(FluTheme.dark){
-                            if((nav_list.currentIndex === _idx)&&type===0){
-                                return Qt.rgba(1,1,1,0.06)
-                            }
-                            if(item_control.hovered){
-                                return Qt.rgba(1,1,1,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
-                        }else{
-                            if(nav_list.currentIndex === _idx&&type===0){
-                                return Qt.rgba(0,0,0,0.06)
-                            }
-                            if(item_control.hovered){
-                                return Qt.rgba(0,0,0,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
+                        if(nav_list.currentIndex === _idx&&type===0){
+                            return FluTheme.itemCheckColor
                         }
+                        if(item_control.hovered){
+                            return FluTheme.itemHoverColor
+                        }
+                        return FluTheme.itemNormalColor
                     }
                     Component{
                         id:com_icon
@@ -341,11 +339,11 @@ Item {
                             return true
                         }
                         anchors{
-                            verticalCenter: parent.verticalCenter
                             left:parent.left
-                            leftMargin: 3
+                            verticalCenter: parent.verticalCenter
+                            leftMargin: d.isCompactAndNotPanel ? (parent.width - 30)/2 : 3
                         }
-                        Loader{
+                        FluLoader{
                             anchors.centerIn: parent
                             sourceComponent: {
                                 if(model&&model.iconDelegate){
@@ -391,7 +389,7 @@ Item {
                             return FluTheme.dark ? FluColors.White : FluColors.Grey220
                         }
                     }
-                    Loader{
+                    FluLoader{
                         id:item_edit_loader
                         anchors{
                             top: parent.top
@@ -407,7 +405,7 @@ Item {
                             return model&&model.showEdit ? model.editDelegate : undefined
                         }
                         onStatusChanged: {
-                            if(status === Loader.Ready){
+                            if(status === FluLoader.Ready){
                                 item.forceActiveFocus()
                                 item_connection_edit_focus.target = item
                             }
@@ -466,6 +464,11 @@ Item {
                     leftMargin: 6
                     rightMargin: 6
                 }
+                FluTooltip {
+                    text: model.title
+                    visible: item_control.hovered && model.title && d.isCompact
+                    delay: 800
+                }
                 onClicked:{
                     if(type === 0){
                         if(model.onTapListener){
@@ -514,37 +517,21 @@ Item {
                     anchors.fill: parent
                     color: {
                         if(!item_control.enabled){
-                            return Qt.rgba(0,0,0,0)
+                            return FluTheme.itemNormalColor
                         }
-                        if(FluTheme.dark){
-                            if(type===0){
-                                if(nav_list.currentIndex === _idx){
-                                    return Qt.rgba(1,1,1,0.06)
-                                }
-                            }else{
-                                if(nav_list.currentIndex === (nav_list.count-layout_footer.count+_idx)){
-                                    return Qt.rgba(1,1,1,0.06)
-                                }
+                        if(type===0){
+                            if(nav_list.currentIndex === _idx){
+                                return FluTheme.itemCheckColor
                             }
-                            if(item_control.hovered){
-                                return Qt.rgba(1,1,1,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
                         }else{
-                            if(type===0){
-                                if(nav_list.currentIndex === _idx){
-                                    return Qt.rgba(0,0,0,0.06)
-                                }
-                            }else{
-                                if(nav_list.currentIndex === (nav_list.count-layout_footer.count+_idx)){
-                                    return Qt.rgba(0,0,0,0.06)
-                                }
+                            if(nav_list.currentIndex === (nav_list.count-layout_footer.count+_idx)){
+                                return FluTheme.itemCheckColor
                             }
-                            if(item_control.hovered){
-                                return Qt.rgba(0,0,0,0.03)
-                            }
-                            return Qt.rgba(0,0,0,0)
                         }
+                        if(item_control.hovered){
+                            return FluTheme.itemHoverColor
+                        }
+                        return FluTheme.itemNormalColor
                     }
                     Component{
                         id:com_icon
@@ -575,11 +562,11 @@ Item {
                             return true
                         }
                         anchors{
-                            verticalCenter: parent.verticalCenter
                             left:parent.left
-                            leftMargin: 3
+                            verticalCenter: parent.verticalCenter
+                            leftMargin: d.isCompactAndNotPanel ? (parent.width - 30)/2 : 3
                         }
-                        Loader{
+                        FluLoader{
                             anchors.centerIn: parent
                             sourceComponent: {
                                 if(model&&model.iconDelegate){
@@ -625,7 +612,7 @@ Item {
                             right: item_dot_loader.left
                         }
                     }
-                    Loader{
+                    FluLoader{
                         id:item_edit_loader
                         anchors{
                             top: parent.top
@@ -644,7 +631,7 @@ Item {
                             return model.showEdit ? model.editDelegate : undefined
                         }
                         onStatusChanged: {
-                            if(status === Loader.Ready){
+                            if(status === FluLoader.Ready){
                                 item.forceActiveFocus()
                                 item_connection_edit_focus.target = item
                             }
@@ -663,7 +650,7 @@ Item {
                             }
                         }
                     }
-                    Loader{
+                    FluLoader{
                         id:item_dot_loader
                         property bool isDot: (item_dot_loader.item&&item_dot_loader.item.isDot)
                         anchors{
@@ -694,11 +681,12 @@ Item {
     Item {
         id:nav_app_bar
         width: parent.width
-        height: 40
+        height: visible ? 40 : 0
         anchors{
             top: parent.top
             topMargin: control.topPadding
         }
+        visible: !control.hideNavAppBar
         z:999
         RowLayout{
             height:parent.height
@@ -807,7 +795,7 @@ Item {
                 }
                 return 0
             }
-            Loader{
+            FluLoader{
                 id:loader_action
                 anchors.centerIn: parent
                 sourceComponent: actionItem
@@ -849,7 +837,7 @@ Item {
             }
         }
     }
-    Loader{
+    FluLoader{
         id:loader_content
         anchors{
             left: parent.left
@@ -861,7 +849,7 @@ Item {
                     return 0
                 }
                 if(d.isCompact){
-                    return 50
+                    return control.navCompactWidth
                 }
                 return control.cellWidth
             }
@@ -889,12 +877,13 @@ Item {
         id:layout_list
         width: {
             if(d.isCompactAndNotPanel){
-                return 50
+                return control.navCompactWidth
             }
             return control.cellWidth
         }
         anchors{
             top: parent.top
+            topMargin: control.navTopMargin
             bottom: parent.bottom
         }
         border.color: FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,230/255,234/255,1)
@@ -935,7 +924,7 @@ Item {
             clip: true
             y:nav_app_bar.height+control.topPadding
             height: autoSuggestBox ? 38 : 0
-            Loader{
+            FluLoader{
                 id:loader_auto_suggest_box
                 sourceComponent: autoSuggestBox
                 anchors{
@@ -954,13 +943,13 @@ Item {
             }
             FluIconButton{
                 visible:d.isCompactAndNotPanel
-                hoverColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-                pressedColor: FluTheme.dark ? Qt.rgba(1,1,1,0.03) : Qt.rgba(0,0,0,0.03)
-                normalColor: FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
-                width:38
-                height:34
-                x:6
-                y:2
+                anchors{
+                    fill: parent
+                    leftMargin: 6
+                    rightMargin: 6
+                    topMargin: 2
+                    bottomMargin: 2
+                }
                 iconSize: 15
                 iconSource: {
                     if(loader_auto_suggest_box.item){
@@ -1005,7 +994,7 @@ Item {
                     Rectangle{
                         height: 18
                         radius: 1.5
-                        color: FluTheme.primaryColor.dark
+                        color: FluTheme.primaryColor
                         width: 3
                         anchors{
                             verticalCenter: parent.verticalCenter
@@ -1015,7 +1004,7 @@ Item {
                     }
                 }
                 currentIndex: -1
-                delegate: Loader{
+                delegate: FluLoader{
                     property var model: modelData
                     property var _idx: index
                     property int type: 0
@@ -1063,7 +1052,7 @@ Item {
                 Rectangle{
                     height: 18
                     radius: 1.5
-                    color: FluTheme.primaryColor.dark
+                    color: FluTheme.primaryColor
                     width: 3
                     anchors{
                         verticalCenter: parent.verticalCenter
@@ -1072,7 +1061,7 @@ Item {
                     }
                 }
             }
-            delegate: Loader{
+            delegate: FluLoader{
                 property var model: modelData
                 property var _idx: index
                 property int type: 1
@@ -1127,24 +1116,17 @@ Item {
                     focusPolicy:Qt.TabFocus
                     background: Rectangle{
                         color:  {
-                            if(FluTheme.dark){
-                                if(item_button.hovered){
-                                    return Qt.rgba(1,1,1,0.06)
-                                }
-                                return Qt.rgba(0,0,0,0)
-                            }else{
-                                if(item_button.hovered){
-                                    return Qt.rgba(0,0,0,0.03)
-                                }
-                                return Qt.rgba(0,0,0,0)
+                            if(item_button.hovered){
+                                return FluTheme.itemHoverColor
                             }
+                            return FluTheme.itemNormalColor
                         }
                         FluFocusRectangle{
                             visible: item_button.activeFocus
                             radius:4
                         }
 
-                        Loader{
+                        FluLoader{
                             id:item_dot_loader
                             anchors{
                                 right: parent.right
@@ -1201,7 +1183,7 @@ Item {
             control_popup.open()
         }
     }
-    Loader{
+    FluLoader{
         property var modelData
         id:loader_item_menu
     }

src/Qt6/imports/FluentUI/Controls/FluPasswordBox.qml

@@ -26,7 +26,7 @@ TextField{
     leftPadding: padding+4
     echoMode:btn_reveal.pressed ? TextField.Normal : TextField.Password
     renderType: FluTheme.nativeText ? Text.NativeRendering : Text.QtRendering
-    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor.lightest,0.6)
+    selectionColor: FluTools.colorAlpha(FluTheme.primaryColor,0.5)
     selectedTextColor: color
     placeholderTextColor: {
         if(!enabled){
@@ -38,9 +38,9 @@ TextField{
         return placeholderNormalColor
     }
     selectByMouse: true
+    width: 240
     background: FluTextBoxBackground{
         inputItem: control
-        implicitWidth: 240
     }
     Keys.onEnterPressed: (event)=> d.handleCommit(event)
     Keys.onReturnPressed:(event)=> d.handleCommit(event)

src/Qt6/imports/FluentUI/Controls/FluPivot.qml

@@ -36,7 +36,7 @@ Page {
             Rectangle{
                 height: 3
                 radius: 1.5
-                color: FluTheme.primaryColor.dark
+                color: FluTheme.primaryColor
                 width: nav_list.currentItem ? nav_list.currentItem.width : 0
                 y:d.tabY
                 Behavior on width {
@@ -84,7 +84,7 @@ Page {
         anchors.fill: parent
         Repeater{
             model:d.children
-            Loader{
+            FluLoader{
                 property var argument: modelData.argument
                 anchors.fill: parent
                 sourceComponent: modelData.contentItem

src/Qt6/imports/FluentUI/Controls/FluPopup.qml

@@ -11,13 +11,6 @@ Popup {
     anchors.centerIn: Overlay.overlay
     closePolicy: Popup.CloseOnEscape
     enter: Transition {
-        NumberAnimation {
-            properties: "scale"
-            from:1.2
-            to:1
-            duration: FluTheme.enableAnimation ? 83 : 0
-            easing.type: Easing.OutCubic
-        }
         NumberAnimation {
             property: "opacity"
             duration: FluTheme.enableAnimation ? 83 : 0
@@ -26,13 +19,6 @@ Popup {
         }
     }
     exit:Transition {
-        NumberAnimation {
-            properties: "scale"
-            from:1
-            to:1.2
-            duration: FluTheme.enableAnimation ? 83 : 0
-            easing.type: Easing.OutCubic
-        }
         NumberAnimation {
             property: "opacity"
             duration: FluTheme.enableAnimation ? 83 : 0
@@ -43,5 +29,8 @@ Popup {
     background: FluRectangle{
         radius: [5,5,5,5]
         color: FluTheme.dark ? Qt.rgba(43/255,43/255,43/255,1) : Qt.rgba(1,1,1,1)
+        FluShadow{
+            radius: 5
+        }
     }
 }

src/Qt6/imports/FluentUI/Controls/FluProgressBar.qml

@@ -7,7 +7,7 @@ ProgressBar{
     property int duration: 888
     property real strokeWidth: 6
     property bool progressVisible: false
-    property color color: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color color: FluTheme.primaryColor
     property color backgroundColor : FluTheme.dark ? Qt.rgba(99/255,99/255,99/255,1) : Qt.rgba(214/255,214/255,214/255,1)
     id:control
     indeterminate : true

src/Qt6/imports/FluentUI/Controls/FluProgressButton.qml

@@ -13,7 +13,7 @@ Button {
     }
     property color normalColor: {
         if(d.checked){
-            return FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+            return FluTheme.primaryColor
         }else{
             return FluTheme.dark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(254/255,254/255,254/255,1)
         }
@@ -67,7 +67,7 @@ Button {
             width: parent.width  * control.progress
             height: control.progress === 1 ? background.height : 3
             visible: !d.checked
-            color: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+            color: FluTheme.primaryColor
             anchors.bottom: parent.bottom
             Behavior on height{
                 enabled: control.progress === 1

src/Qt6/imports/FluentUI/Controls/FluProgressRing.qml

@@ -7,7 +7,7 @@ ProgressBar{
     property int duration: 888
     property real strokeWidth: 6
     property bool progressVisible: false
-    property color color: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
+    property color color: FluTheme.primaryColor
     property color backgroundColor : FluTheme.dark ? Qt.rgba(99/255,99/255,99/255,1) : Qt.rgba(214/255,214/255,214/255,1)
     id:control
     indeterminate : true