update

2025-07-01 23:51:48 +08:00 · 2023-05-19 13:50:06 +08:00 · 2023-05-19 09:19:52 +08:00 · 2023-05-19 08:03:37 +08:00 · 2023-05-19 07:57:23 +08:00 · 2023-05-18 23:33:31 +08:00
113 changed files with 897 additions and 858 deletions
--- a/.github/workflows/ubuntu.yml
+++ b/.github/workflows/ubuntu.yml
@ -47,7 +47,7 @@ jobs:
          version: 1.10.2
          
      - name: ubuntu install GL library
-        run: sudo apt-get install -y libxkbcommon-x11-dev libxcb-icccm4-dev libxcb-image0-dev libxcb-keysyms1-dev libxcb-randr0-dev libxcb-shape0-dev libxcb-xfixes0-dev libxcb-xinerama0-dev libxcb-sync-dev  libxcb-render-util0-dev libxcb-shm0-dev
+        run: sudo apt-get install -y libgl1-mesa-dev libxcb1-dev libgtk-3-dev libxkbcommon-x11-dev libxcb-icccm4-dev libxcb-image0-dev libxcb-keysyms1-dev libxcb-randr0-dev libxcb-shape0-dev libxcb-xfixes0-dev libxcb-xinerama0-dev libxcb-sync-dev  libxcb-render-util0-dev libxcb-shm0-dev
        
      - name: build ubuntu
        run: |
--- a/.gitmodules
+++ b/.gitmodules
@ -0,0 +1,3 @@
+[submodule "framelesshelper"]
+	path = framelesshelper
+	url = https://github.com/zhuzichu520/framelesshelper.git
--- a/CMakeLists.txt
+++ b/CMakeLists.txt
@ -4,3 +4,4 @@ project(FluentUI VERSION 0.1 LANGUAGES CXX)

 add_subdirectory(src)
 add_subdirectory(example)
+add_subdirectory(framelesshelper)
--- a/README.md
+++ b/README.md
@ -1,99 +1,119 @@
-# FluentUI
+<div align=center>
+  <img width=64 src="doc/preview/fluent_design.svg">
+</div>

-## 简介
+<h1 align="center">
+  QML FluentUI 
+</h1>
+<p align="center">
+  A fluent design component library for Qt QML
+</p>

-这是一个漂亮的Fluent组件库，使用QML插件开发的。main分支是Qt6.4.3，<a href="https://github.com/zhuzichu520/FluentUI/wiki/%E6%96%B0%E6%89%8B%E5%85%A5%E9%97%A8" target="_blank">如何使用？</a>。如果需要qt5的请切换至qt5分支，<a href="https://github.com/zhuzichu520/FluentUI/wiki/%E6%96%B0%E6%89%8B%E5%85%A5%E9%97%A8%EF%BC%881.2.7%E4%BB%A5%E5%8F%8A%E4%B9%8B%E5%89%8D%E7%89%88%E6%9C%AC%EF%BC%89" target="_blank">如何使用？</a>
+![win-badge] ![ubuntu-badge] ![macos-badge] ![release-badge] ![download-badge] ![download-latest]
+
+<p align="center">
+English | <a href="README_zh_CN.md">简体中文</a>
+</p>
+<div align=center>
+  <img src="doc/preview/demo_large.png">
+</div>

-## 编译状态
-| [Windows][win-link]| [Ubuntu][ubuntu-link]|[MacOS][macos-link]|
-|---------------|---------------|-----------------|
-| ![win-badge]  | ![ubuntu-badge]      | ![macos-badge] |

 [win-link]: https://github.com/zhuzichu520/FluentUI/actions?query=workflow%3AWindows "WindowsAction"
 [win-badge]: https://github.com/zhuzichu520/FluentUI/workflows/Windows/badge.svg  "Windows"
-
 [ubuntu-link]: https://github.com/zhuzichu520/FluentUI/actions?query=workflow%3AUbuntu "UbuntuAction"
 [ubuntu-badge]: https://github.com/zhuzichu520/FluentUI/workflows/Ubuntu/badge.svg "Ubuntu"
-
 [macos-link]: https://github.com/zhuzichu520/FluentUI/actions?query=workflow%3AMacOS "MacOSAction"
 [macos-badge]: https://github.com/zhuzichu520/FluentUI/workflows/MacOS/badge.svg "MacOS"
-
-## 发布
-
-|[已发布][release-link]|[下载][download-link]|下载次数|
-|:--:|:--:|:--:|
-|![release-badge] |![download-badge]|![download-latest]|
-
 [release-link]: https://github.com/zhuzichu520/FluentUI/releases "Release status"
 [release-badge]: https://img.shields.io/github/release/zhuzichu520/FluentUI.svg?style=flat-square "Release status"
 [download-link]: https://github.com/zhuzichu520/FluentUI/releases/latest "Download status"
 [download-badge]: https://img.shields.io/github/downloads/zhuzichu520/FluentUI/total.svg "Download status"
 [download-latest]: https://img.shields.io/github/downloads/zhuzichu520/FluentUI/latest/total.svg "latest status"

-## 支持的组件

-|目录|说明|备注|
-|----|----|----|
-|FluApp|初始化入口|支持路由跳转|
-|FluWindow|无边框窗口|解决windows拖动闪烁问题|
-|FluAppBar|窗口顶部标题栏|支持拖动窗口，最小化、最大化、关闭窗口|
-|FluText|Text文本||
-|FluButton|按钮||
-|FluFilledButton|实心按钮||
-|FluIconButton|图标按钮||
-|FluTextButton|文本按钮||
-|FluIcon|图标||
-|FluRadioButton|单选按钮||
-|FluTextBox|单行输入框||
-|FluMultiLineTextBox|多行输入框||
-|FluToggleSwitch|开关按钮||
-|FluSlider|拖动条||
-|FluInfoBar|提示Toast||
-|FluContentDialog|对话框||
-|FluProgressBar|条形进度条||
-|FluProgressRing|圆形进度条||
-|FluRectangle|矩形|支持部分圆角、clip|
-|FluMenu|菜单框||
-|FluTooltip|tooltip提示框||
-|FluTreeView|树控件||
-|FluTheme|主题设置|支持主题颜色切换，夜间模式|
-|FluCarousel|轮播图组件|支持无限轮播|
-|FluTimePicker|时间选择器||
-|FluDatePicker|日期选择器||
-|FluMenu|菜单Popup||
-|FluNavigationView|响应式导航布局||
-|FluScrollbar|滚动条||
-|FluToggleButton|开关按钮||
-|FluPagination|分页组件||
-|FluTableView|表格组件||
-|FluMediaPlayer|播放器||
-|FluFlipView|FlipView||
+<p align=center>
+This is a beautiful FluentUI component library based on Qt QML. Currently the main branch supports Qt 6. If you want to use it in Qt 5, checkout the Qt 5 branch.
+</p>

-# 部分效果预览
+## Requirements

-## 首页
+ Qt Core, Qt Quick, Qt QML, Qt ShaderTool, Qt 5 Compatibility Module. (**Essential**)
+ Qt LinguistTool (optional,for translations)
+ Qt Svg (optional, however essential for Qt 5)

-![](doc/preview/home.png)
+Use [Qt Online Installers](https://download.qt.io/archive/online_installers/) to aquire the moudules (**Recommanded**) or compile them first before using the library.

-## 各种Button按钮
+## ⚽ Get started

-![](doc/preview/buttons.png)
+ Download the [pre-built release](https://github.com/zhuzichu520/FluentUI/releases). (Please pecify your platform and compilers.)

-## 主题颜色切换、夜间模式
+ run `example` program.

-![](doc/preview/theme.png)
+or 

-## TableView表格组件
+ Clone the repository.

-![](doc/preview/tableview.png)
+```SHELL
+git clone --recursive https://github.com/zhuzichu520/FluentUI.git
+```

-## FluTreeView树组件
+ Build

-![](doc/preview/treeview.png)
+```
+git clone --recursive https://github.com/zhuzichu520/FluentUI.git
+cd FluentUI
+mkdir build
+cd build
+cmake -DCMAKE_PREFIX_PATH=<YOUR_QT_SDK_DIR_PATH> -DCMAKE_BUILD_TYPE=Release -GNinja <PATH_TO_THE_REPOSITORY>
+cmake --build . --config Release --target all --parallel
+```

-## 轮播图组件
+ Use your IDE (`Qt Creator` or `CLion`) to open the project. (only **CMake** supported).

-![](doc/preview/carousel.png)
+<div align=center>
+  <img src="doc/preview/qt_creator_project.png">
+</div>

-### ⚡ Visitor count
+ Compile the project. Then try to execute the `example` demo program.
+
+ Great! Now you are ready to write your first QML FluentUI program! Check the documentations for more details.
+
+
+## 📑 Documentations
+
+(Work in progress...🚀)
+
+## Supported components
+
+|Catalog|Detail|Notes / Demos|
+|:----:|:----:|:----:|
+|FluApp|The initial entry of the program|Router supported(SPA)|
+|FluWindow|Frameless Window|*This only works on windows|
+|FluAppBar|Title bar on top of the window|Drag, minimize, maximize and close are supported.|
+|FluText|Common text||
+|FluButton|Common button|![btn](doc/preview/demo_standardbtn.png) |
+|FluFilledButton|Filled button|![filledbtn](doc/preview/demo_filledbtn.png)|
+|FluTextButton|Text button|![textbtn](doc/preview/demo_textbtn.png)|
+|FluToggleButton|Toggle buttons|![togglebtn](doc/preview/demo_toggle_btn.png)|
+|FluIcon|Common icon|![icons](doc/preview/demo_icon.png)|
+|FluRadioButton|radio button|![radiobtn](doc/preview/demo_radiobtn.png)|
+|FluTextBox|Single-line input box|![textbox](doc/preview/demo_textbox.png)|
+|FluMultiLineTextBox|Multi-lines input area|![textarea](doc/preview/demo_multiline_textbox.png)|
+|FluToggleSwitch|toggle switch|![toggleswitch](doc/preview/demo_toggle_switch.png)|
+
+
+View more [`here`](doc/md/all_components.md)!
+
+
+## Reference
+ [**Windows design**: Design guidelines and toolkits of Microsoft.](https://learn.microsoft.com/en-us/windows/apps/design/)
+ [**Microsoft/WinUI-Gallery**: Microsoft's demo](https://github.com/microsoft/WinUI-Gallery)
+
+
+## License
+
+This FluentUI library currently licensed under [MIT License](./License)
+
+## ⚡ Visitor count
 ![](https://profile-counter.glitch.me/zhuzichu520-FluentUI/count.svg)
--- a/README_zh_CN.md
+++ b/README_zh_CN.md
@ -0,0 +1,99 @@
+# FluentUI
+
+## 简介
+
+这是一个漂亮的Fluent组件库，使用QML插件开发的。main分支是Qt6.4.3，<a href="https://github.com/zhuzichu520/FluentUI/wiki/%E6%96%B0%E6%89%8B%E5%85%A5%E9%97%A8" target="_blank">如何使用？</a>。如果需要qt5的请切换至qt5分支，<a href="https://github.com/zhuzichu520/FluentUI/wiki/%E6%96%B0%E6%89%8B%E5%85%A5%E9%97%A8%EF%BC%881.2.7%E4%BB%A5%E5%8F%8A%E4%B9%8B%E5%89%8D%E7%89%88%E6%9C%AC%EF%BC%89" target="_blank">如何使用？</a>
+
+## 编译状态
+| [Windows][win-link]| [Ubuntu][ubuntu-link]|[MacOS][macos-link]|
+|---------------|---------------|-----------------|
+| ![win-badge]  | ![ubuntu-badge]      | ![macos-badge] |
+
+[win-link]: https://github.com/zhuzichu520/FluentUI/actions?query=workflow%3AWindows "WindowsAction"
+[win-badge]: https://github.com/zhuzichu520/FluentUI/workflows/Windows/badge.svg  "Windows"
+
+[ubuntu-link]: https://github.com/zhuzichu520/FluentUI/actions?query=workflow%3AUbuntu "UbuntuAction"
+[ubuntu-badge]: https://github.com/zhuzichu520/FluentUI/workflows/Ubuntu/badge.svg "Ubuntu"
+
+[macos-link]: https://github.com/zhuzichu520/FluentUI/actions?query=workflow%3AMacOS "MacOSAction"
+[macos-badge]: https://github.com/zhuzichu520/FluentUI/workflows/MacOS/badge.svg "MacOS"
+
+## 发布
+
+|[已发布][release-link]|[下载][download-link]|下载次数|
+|:--:|:--:|:--:|
+|![release-badge] |![download-badge]|![download-latest]|
+
+[release-link]: https://github.com/zhuzichu520/FluentUI/releases "Release status"
+[release-badge]: https://img.shields.io/github/release/zhuzichu520/FluentUI.svg?style=flat-square "Release status"
+[download-link]: https://github.com/zhuzichu520/FluentUI/releases/latest "Download status"
+[download-badge]: https://img.shields.io/github/downloads/zhuzichu520/FluentUI/total.svg "Download status"
+[download-latest]: https://img.shields.io/github/downloads/zhuzichu520/FluentUI/latest/total.svg "latest status"
+
+## 支持的组件
+
+|目录|说明|备注|
+|----|----|----|
+|FluApp|初始化入口|支持路由跳转|
+|FluWindow|无边框窗口|解决windows拖动闪烁问题|
+|FluAppBar|窗口顶部标题栏|支持拖动窗口，最小化、最大化、关闭窗口|
+|FluText|Text文本||
+|FluButton|按钮||
+|FluFilledButton|实心按钮||
+|FluIconButton|图标按钮||
+|FluTextButton|文本按钮||
+|FluIcon|图标||
+|FluRadioButton|单选按钮||
+|FluTextBox|单行输入框||
+|FluMultiLineTextBox|多行输入框||
+|FluToggleSwitch|开关按钮||
+|FluSlider|拖动条||
+|FluInfoBar|提示Toast||
+|FluContentDialog|对话框||
+|FluProgressBar|条形进度条||
+|FluProgressRing|圆形进度条||
+|FluRectangle|矩形|支持部分圆角、clip|
+|FluMenu|菜单框||
+|FluTooltip|tooltip提示框||
+|FluTreeView|树控件||
+|FluTheme|主题设置|支持主题颜色切换，夜间模式|
+|FluCarousel|轮播图组件|支持无限轮播|
+|FluTimePicker|时间选择器||
+|FluDatePicker|日期选择器||
+|FluMenu|菜单Popup||
+|FluNavigationView|响应式导航布局||
+|FluScrollbar|滚动条||
+|FluToggleButton|开关按钮||
+|FluPagination|分页组件||
+|FluTableView|表格组件||
+|FluMediaPlayer|播放器||
+|FluFlipView|FlipView||
+
+# 部分效果预览
+
+## 首页
+
+![](doc/preview/home.png)
+
+## 各种Button按钮
+
+![](doc/preview/buttons.png)
+
+## 主题颜色切换、夜间模式
+
+![](doc/preview/theme.png)
+
+## TableView表格组件
+
+![](doc/preview/tableview.png)
+
+## FluTreeView树组件
+
+![](doc/preview/treeview.png)
+
+## 轮播图组件
+
+![](doc/preview/carousel.png)
+
+### ⚡ Visitor count
+![](https://profile-counter.glitch.me/zhuzichu520-FluentUI/count.svg)
--- a/doc/md/all_components.md
+++ b/doc/md/all_components.md
@ -0,0 +1,37 @@
+# 支持的组件
+
+|Catalog|Detail|Notes / Demos|
+|:----:|:----:|:----:|
+|FluApp|The initial entry of the program|Router supported(SPA)|
+|FluWindow|Frameless Window|*This only works on windows|
+|FluAppBar|Title bar on top of the window|Drag, minimize, maximize and close are supported.|
+|FluText|Common text||
+|FluButton|Common button|![btn](../preview/demo_standardbtn.png) |
+|FluFilledButton|Filled button|![filledbtn](../preview/demo_filledbtn.png)|
+|FluTextButton|Text button|![textbtn](../preview/demo_textbtn.png)|
+|FluToggleButton|Toggle buttons|![togglebtn](../preview/demo_toggle_btn.png)|
+|FluIcon|fluent icons|![icons](../preview/demo_icon.png)|
+|FluRadioButton|radio button|![radiobtn](../preview/demo_radiobtn.png)|
+|FluTextBox|Single-line input box|![textbox](../preview/demo_textbox.png)|
+|FluMultiLineTextBox|Multi-lines input area|![textarea](../preview/demo_multiline_textbox.png)|
+|FluToggleSwitch|toggle switch|![toggleswitch](../preview/demo_toggle_switch.png)|
+|FluSlider|Slider|![slider](../preview/demo_slider.png)|
+|FluInfoBar|提示Toast|![infobar](../preview/demo_infobar.png)|
+|FluContentDialog| dialog |![dialog](../preview/demo_content_dialog.png)|
+|FluProgressBar| progress bar |![progress](../preview/demo_progress_bar_ring.png)|
+|FluProgressRing|circle progress||
+|FluRectangle|reactangle| ![rect](../preview/demo_rectangle.png)</br>*partially support `round` and `clip` feature|
+|FluMenu|menu||
+|FluTooltip|tooltip|![tooltip](../preview/demo_tooltip.png)|
+|FluTreeView|tree view component|![treeview](../preview/demo_tree_view.png)|
+|FluTheme|theme settings|theme color changes, dark mode are supported|
+|FluCarousel|-||
+|FluTimePicker| time picker ||
+|FluDatePicker|date picker||
+|FluMenu|the menu popup||
+|FluNavigationView|responsive navigation view||
+|FluScrollbar|scroll bar||
+|FluPagination|||
+|FluTableView|table component||
+|FluMediaPlayer|multimedia components||
+|FluFlipView| flip view||
--- a/doc/preview/demo_content_dialog.png
+++ b/doc/preview/demo_content_dialog.png
--- a/doc/preview/demo_filledbtn.png
+++ b/doc/preview/demo_filledbtn.png
--- a/doc/preview/demo_icon.png
+++ b/doc/preview/demo_icon.png
--- a/doc/preview/demo_infobar.png
+++ b/doc/preview/demo_infobar.png
--- a/doc/preview/demo_large.png
+++ b/doc/preview/demo_large.png
--- a/doc/preview/demo_multiline_textbox.png
+++ b/doc/preview/demo_multiline_textbox.png
--- a/doc/preview/demo_progress_bar_ring.png
+++ b/doc/preview/demo_progress_bar_ring.png
--- a/doc/preview/demo_radiobtn.png
+++ b/doc/preview/demo_radiobtn.png
--- a/doc/preview/demo_rectangle.png
+++ b/doc/preview/demo_rectangle.png
--- a/doc/preview/demo_slider.png
+++ b/doc/preview/demo_slider.png
--- a/doc/preview/demo_standardbtn.png
+++ b/doc/preview/demo_standardbtn.png
--- a/doc/preview/demo_textbox.png
+++ b/doc/preview/demo_textbox.png
--- a/doc/preview/demo_textbtn.png
+++ b/doc/preview/demo_textbtn.png
--- a/doc/preview/demo_toggle_btn.png
+++ b/doc/preview/demo_toggle_btn.png
--- a/doc/preview/demo_toggle_switch.png
+++ b/doc/preview/demo_toggle_switch.png
--- a/doc/preview/demo_tooltip.png
+++ b/doc/preview/demo_tooltip.png
--- a/doc/preview/demo_tree_view.png
+++ b/doc/preview/demo_tree_view.png
--- a/doc/preview/fluent_design.svg
+++ b/doc/preview/fluent_design.svg
@ -0,0 +1,7 @@
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 73 73" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000" stroke="#000000">
+
+<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+
--- a/doc/preview/qt_creator_project.png
+++ b/doc/preview/qt_creator_project.png
--- a/example.svg
+++ b/example.svg
@ -1 +1,7 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1678260749060" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11227" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M0 0m170.663111 0l682.652445 0q170.663111 0 170.663111 170.663111l0 682.652445q0 170.663111-170.663111 170.663111l-682.652445 0q-170.663111 0-170.663111-170.663111l0-682.652445q0-170.663111 170.663111-170.663111Z" fill="#EBF2FF" p-id="11228"></path><path d="M512.351993 787.674257c182.822858 0 330.926439 98.568613 331.033103 231.312514 0 1.674632-0.031999 3.338597-0.106664 5.002563H181.43622c-0.074665-1.663965-0.106664-3.327931-0.106664-5.002563 0-132.743901 148.210246-231.312514 331.022437-231.312514z" fill="#7D99C8" p-id="11229"></path><path d="M592.264994 721.158309v79.817004h-0.810649c-5.546551 30.079373-38.847191 53.204225-79.102352 53.204225-40.244495 0-73.545134-23.114185-79.091686-53.193559h-0.81065V721.158309h159.815337z" fill="#FBDBCB" p-id="11230"></path><path d="M508.213412 765.626716c-44.105748-1.226641-85.363555-19.306264-118.568196-56.916147-22.826191-25.866128-35.199267-53.054895-37.097894-81.576968l-21.610217-1.610633a59.988084 59.988084 0 0 1-55.433511-56.585488l-0.319994-5.72788a34.932606 34.932606 0 0 1 43.124435-35.839254l0.949314-9.098477a608.008666 608.008666 0 0 1 40.031166-159.015354l10.389117-25.866127H655.026354l10.389117 25.866127a608.008666 608.008666 0 0 1 40.031166 159.015354l0.95998 9.098477a34.932606 34.932606 0 0 1 43.103102 35.839254l-0.309327 5.72788a59.988084 59.988084 0 0 1-55.433512 56.585488l-21.610217 1.610633c-1.909294 28.522072-14.271703 55.710839-37.097893 81.576968-34.239287 38.793858-77.054395 56.798817-122.717444 56.980146z" fill="#FFE7DB" p-id="11231"></path><path d="M546.911273 182.822858a10.666444 10.666444 0 0 1 1.429303 4.31991c0.533322 5.055895 0.714652 9.226474 0.533322 12.501073l-0.202662 2.346618 3.221266-0.543989c21.876878-3.733256 38.452532-9.877128 49.705631-18.452949l2.197288-1.73863a10.666444 10.666444 0 0 1 16.682319 3.98925c8.767817 20.650236 11.125102 40.681819 7.039853 60.116081l-0.373325 1.578633c4.746568 1.514635 9.589134 3.199933 14.506364 5.066562 27.882086 10.581113 57.769463 26.367451 76.883732 75.65709 20.212912 52.084248 18.826274 116.562905-4.149247 193.425304l-1.855961 6.101206H701.425387c-0.47999-51.732256-8.319827-90.526114-23.540843-116.392242-15.221016-25.866128-29.716714-46.185704-43.487094-60.969396-41.513802 10.399783-79.85967 15.914335-115.037603 16.564988l-6.997188 0.063998v0.191996c-37.065894 0-77.737047-5.546551-122.024124-16.628986-13.77038 10.954438-28.266078 31.220683-43.487094 60.7774-15.221016 29.556718-23.060853 68.414575-23.540843 116.584238h-11.114435c-24.746151-79.571676-26.740776-146.076957-6.005209-199.52651 8.746484-22.548864 19.732922-38.079207 31.764672-49.321639 18.079623-20.660903 40.180496-36.009916 66.302619-46.068374a424.716485 424.716485 0 0 1 32.319326-11.029103c25.25814-9.034478 44.991063-16.767651 59.209433-23.210183a366.221704 366.221704 0 0 0 29.151393-14.869024l7.359847-4.266578a10.666444 10.666444 0 0 1 14.623695 3.733256z" fill="#7D99C8" p-id="11232"></path></svg>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 73 73" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000" stroke="#000000">
+
+<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+
--- a/example/CMakeLists.txt
+++ b/example/CMakeLists.txt
@ -20,7 +20,7 @@ endif()
 file(TO_CMAKE_PATH "/" PATH_SEPARATOR)

 #设置版本号
-add_definitions(-DVERSION=1,3,0,0)
+add_definitions(-DVERSION=1,3,1,0)

 find_package(Qt6 REQUIRED COMPONENTS Quick REQUIRED)

@ -94,6 +94,8 @@ set_target_properties(example PROPERTIES
 target_link_libraries(example PRIVATE
    Qt6::Quick
    fluentuiplugin
+    FramelessHelper::Core
+    FramelessHelper::Quick
 )

 #安装
--- a/example/qml/TestWindow.qml
+++ b/example/qml/TestWindow.qml
@ -1,14 +1,69 @@
 import QtQuick
+import QtQuick.Window
+import QtQuick.Controls
+import QtQuick.Layouts
+import Qt.labs.platform
 import FluentUI
+import "qrc:///example/qml/global/"

 FluWindow {
+
    id:window
-    width: 400
-    height: 400
+    title: "FluentUI"
+    width: 1000
+    height: 640
+    closeDestory:false
+    minimumWidth: 520
+    minimumHeight: 460
+    launchMode: FluWindow.SingleTask
    visible: true

-    FluButton{
-        text:"123"
+    FluNavigationView2{
+        id:nav_view
+        anchors.fill: parent
+        items: ItemsOriginal
+        footerItems:ItemsFooter
+        z:11
+        displayMode:MainEvent.displayMode
+        logo: "qrc:/example/res/image/favicon.ico"
+        title:"FluentUI"
+        autoSuggestBox:FluAutoSuggestBox{
+            width: 280
+            anchors.centerIn: parent
+            iconSource: FluentIcons.Search
+            items: ItemsOriginal.getSearchData()
+            placeholderText: lang.search
+            onItemClicked:
+                (data)=>{
+                    ItemsOriginal.startPageByItem(data)
+                }
+        }
+        actionItem:Item{
+            height: 40
+            width: 148
+            RowLayout{
+                anchors.centerIn: parent
+                spacing: 5
+                FluText{
+                    text:lang.dark_mode
+                }
+                FluToggleSwitch{
+                    selected: FluTheme.dark
+                    clickFunc:function(){
+                        if(FluTheme.dark){
+                            FluTheme.darkMode = FluDarkMode.Light
+                        }else{
+                            FluTheme.darkMode = FluDarkMode.Dark
+                        }
+                    }
+                }
+            }
+        }
+        Component.onCompleted: {
+            ItemsOriginal.navigationView = nav_view
+            ItemsFooter.navigationView = nav_view
+//            nav_view.setCurrentIndex(0)
+        }
    }

 }
--- a/example/qml/component/CustomWindow.qml
+++ b/example/qml/component/CustomWindow.qml
@ -0,0 +1,64 @@
+import QtQuick
+import QtQuick.Layouts
+import FluentUI
+import org.wangwenx190.FramelessHelper
+
+FluWindow {
+
+    id:window
+
+    property bool fixSize
+    property alias titleVisible: title_bar.titleVisible
+    property bool appBarVisible: true
+    default property alias content: container.data
+
+    Component.onCompleted: {
+        console.debug(FramelessUtils.frameBorderVisible)
+    }
+
+    FluAppBar {
+        id: title_bar
+        title: window.title
+        visible: window.appBarVisible
+        anchors {
+            top: parent.top
+            left: parent.left
+            right: parent.right
+        }
+        darkText: lang.dark_mode
+    }
+
+    Item{
+        id:container
+        anchors{
+            top: title_bar.bottom
+            left: parent.left
+            right: parent.right
+            bottom: parent.bottom
+        }
+        clip: true
+    }
+
+    FramelessHelper{
+        id:framless_helper
+        onReady: {
+            setTitleBarItem(title_bar)
+            framless_helper.moveWindowToDesktopCenter()
+            setHitTestVisible(title_bar.minimizeButton())
+            setHitTestVisible(title_bar.maximizeButton())
+            setHitTestVisible(title_bar.closeButton())
+            framless_helper.setWindowFixedSize(fixSize)
+            title_bar.maximizeButton.visible = !fixSize
+            window.visible = true
+        }
+    }
+
+    function setHitTestVisible(com){
+        framless_helper.setHitTestVisible(com)
+    }
+
+    function setTitleBarItem(com){
+        framless_helper.setTitleBarItem(com)
+    }
+
+}
--- a/example/qml/page/T_Acrylic.qml
+++ b/example/qml/page/T_Acrylic.qml
@ -12,48 +12,52 @@ FluScrollablePage{
    FluArea{
        Layout.fillWidth: true
        Layout.topMargin: 20
-        height: 1439/5+20
+        height: 1200/5+20
        paddings: 10

        FluRectangle{
-            width: 1080/5
-            height: 1439/5
-            radius:[25,25,25,25]
-            anchors.verticalCenter: parent.verticalCenter
-            anchors.left: parent.left
-            anchors.leftMargin: 20
+            width: 1920/5
+            height: 1200/5
+            radius:[15,15,15,15]
            Image {
+                id:image
                asynchronous: true
-                source: "qrc:/example/res/image/image_huoyin.webp"
+                source: "qrc:/example/res/image/banner_3.jpg"
                anchors.fill: parent
-                sourceSize: Qt.size(width,height)
-                FluAcrylic {
+                sourceSize: Qt.size(2*width,2*height)
+            }
+            FluAcrylic {
+                sourceItem:image
+                anchors.bottom: parent.bottom
+                anchors.right: parent.right
+                width: 100
+                height: 100
+                FluText {
                    anchors.centerIn: parent
-                    width: 100
-                    height: 100
-                    FluText {
-                        anchors.centerIn: parent
-                        text: "Acrylic"
-                        color: "#FFFFFF"
-                        font.bold: true
-                    }
+                    text: "Acrylic"
+                    color: "#FFFFFF"
+                    font.bold: true
                }
            }
+            Layout.topMargin: 20
        }
+
    }
    CodeExpander{
        Layout.fillWidth: true
        Layout.topMargin: -1
        code:'Image{
+    id:image
    width: 800
    height: 600
    source: "qrc:/example/res/image/image_huoyin.webp"
    radius: 8
+    }
    FluAcrylic{
+        sourceItem:image
        width: 100
        height: 100
        anchors.centerIn: parent
-    }
 }'
    }

--- a/example/qml/page/T_Buttons.qml
+++ b/example/qml/page/T_Buttons.qml
@ -109,7 +109,7 @@ FluScrollablePage{
            disabled:filled_button_switch.selected
            text:"Filled Button"
            onClicked: {
-                showWarning("点击FilledButton")
+                showWarning("点击FilledButton"+height)
            }
            anchors{
                verticalCenter: parent.verticalCenter
--- a/example/qml/page/T_Home.qml
+++ b/example/qml/page/T_Home.qml
@ -22,6 +22,7 @@ FluScrollablePage{
        Layout.fillWidth: true
        height: 320
        Image {
+            id: bg
            fillMode:Image.PreserveAspectCrop
            anchors.fill: parent
            verticalAlignment: Qt.AlignTop
@ -46,6 +47,7 @@ FluScrollablePage{
        }

        ListView{
+            id: list
            anchors{
                left: parent.left
                right: parent.right
@ -61,6 +63,7 @@ FluScrollablePage{
            }
            clip: false
            delegate:Item{
+                id: control
                width: 220
                height: 240
                FluArea{
@ -68,6 +71,15 @@ FluScrollablePage{
                    width: 200
                    height: 220
                    anchors.centerIn: parent
+                    color: 'transparent'
+                    FluAcrylic {
+                        sourceItem:bg
+                        anchors.fill: parent
+                        color: FluTheme.dark ? 'black' : 'white'
+                        rectX: list.x-list.contentX+10+(control.width)*index
+                        rectY: list.y+10
+                        acrylicOpacity:0.5
+                    }
                    Rectangle{
                        anchors.fill: parent
                        radius: 8
--- a/example/qml/page/T_Rectangle.qml
+++ b/example/qml/page/T_Rectangle.qml
@ -114,18 +114,17 @@ FluScrollablePage{
                }
            }
            FluRectangle{
-                width: 1080/5
-                height: 1439/5
-                radius:[25,25,25,25]
+                width: 1920/5
+                height: 1200/5
+                radius:[15,15,15,15]
                Image {
                    asynchronous: true
-                    source: "qrc:/example/res/image/image_huoyin.webp"
+                    source: "qrc:/example/res/image/banner_1.jpg"
                    anchors.fill: parent
-                    sourceSize: Qt.size(width,height)
+                    sourceSize: Qt.size(2*width,2*height)
                }
-                Layout.topMargin: 10
+                Layout.topMargin: 20
            }
-
        }
    }
    CodeExpander{
--- a/example/qml/page/T_TableView.qml
+++ b/example/qml/page/T_TableView.qml
@ -34,7 +34,7 @@ FluScrollablePage{
                          {
                              title: '操作',
                              dataIndex: 'action',
-                              width:100
+                              width:120
                          },
                      ];
        table_view.columns = columns
@ -62,20 +62,14 @@ FluScrollablePage{
                spacing: 10
                FluFilledButton{
                    text:"编辑"
-                    topPadding:3
-                    bottomPadding:3
-                    leftPadding:6
-                    rightPadding:6
+                    horizontalPadding: 6
                    onClicked:{
                        showSuccess(JSON.stringify(dataObject))
                    }
                }
                FluFilledButton{
                    text:"删除"
-                    topPadding:3
-                    bottomPadding:3
-                    leftPadding:6
-                    rightPadding:6
+                    horizontalPadding: 6
                    onClicked:{
                        showError(JSON.stringify(dataObject))
                    }
@ -84,20 +78,6 @@ FluScrollablePage{
        }
    }

-    function loadData(page,count){
-        const dataSource = []
-        for(var i=0;i<count;i++){
-            dataSource.push({
-                                name: "孙悟空%1".arg(((page-1)*count+i)),
-                                age: 500,
-                                address: "钟灵毓秀的花果山,如神仙仙境的水帘洞",
-                                nickname: "齐天大圣",
-                                action:com_action
-                            })
-        }
-        table_view.dataSource = dataSource
-    }
-
    CodeExpander{
        Layout.fillWidth: true
        Layout.topMargin: 10
@ -149,6 +129,17 @@ FluScrollablePage{
 }'
    }

-
-
+    function loadData(page,count){
+        const dataSource = []
+        for(var i=0;i<count;i++){
+            dataSource.push({
+                                name: "孙悟空%1".arg(((page-1)*count+i)),
+                                age: 500,
+                                address: "钟灵毓秀的花果山,如神仙仙境的水帘洞",
+                                nickname: "齐天大圣",
+                                action:com_action
+                            })
+        }
+        table_view.dataSource = dataSource
+    }
 }
--- a/example/qml/page/T_Typography.qml
+++ b/example/qml/page/T_Typography.qml
@ -8,6 +8,7 @@ FluContentPage {
    property real textScale: 1

    title: "Typography"
+    rightPadding: 10

    Component.onCompleted: {
        slider.seek(0)
--- a/example/qml/window/AboutWindow.qml
+++ b/example/qml/window/AboutWindow.qml
@ -2,17 +2,15 @@
 import QtQuick.Controls
 import QtQuick.Layouts
 import FluentUI
+import "../component"

-FluWindow {
+CustomWindow {

    id:window
    title:"关于"
    width: 600
    height: 600
-    minimumWidth: 600
-    minimumHeight: 600
-    maximumWidth: 600
-    maximumHeight: 600
+    fixSize: true
    launchMode: FluWindow.SingleTask

    ColumnLayout{
--- a/example/qml/window/LoginWindow.qml
+++ b/example/qml/window/LoginWindow.qml
@ -2,17 +2,15 @@
 import QtQuick.Layouts
 import QtQuick.Controls
 import FluentUI
+import "../component"

-FluWindow {
+CustomWindow {

    id:window
    title:"登录"
    width: 400
    height: 400
-    minimumWidth: 400
-    minimumHeight: 400
-    maximumWidth: 400
-    maximumHeight: 400
+    fixSize: true

    onInitArgument:
        (argument)=>{
--- a/example/qml/window/MainWindow.qml
+++ b/example/qml/window/MainWindow.qml
@ -4,9 +4,10 @@ import QtQuick.Controls
 import QtQuick.Layouts
 import Qt.labs.platform
 import FluentUI
+import "../component"
 import "qrc:///example/qml/global/"

-FluWindow {
+CustomWindow {

    id:window
    title: "FluentUI"
@ -15,6 +16,7 @@ FluWindow {
    closeDestory:false
    minimumWidth: 520
    minimumHeight: 460
+    appBarVisible: false
    launchMode: FluWindow.SingleTask

    closeFunc:function(event){
@ -71,15 +73,32 @@ FluWindow {
            window.deleteWindow()
            FluApp.closeApp()
        }
+    }

+    FluAppBar {
+        id: title_bar
+        anchors {
+            top: parent.top
+            left: parent.left
+            right: parent.right
+        }
+        darkText: lang.dark_mode
+        showDark: true
+        z:7
    }

    FluNavigationView{
        id:nav_view
-        anchors.fill: parent
+        anchors{
+            top: parent.top
+            left: parent.left
+            right: parent.right
+            bottom: parent.bottom
+        }
+        z:999
        items: ItemsOriginal
        footerItems:ItemsFooter
-        z:11
+        topPadding:FluTools.isMacos() ? 20 : 5
        displayMode:MainEvent.displayMode
        logo: "qrc:/example/res/image/favicon.ico"
        title:"FluentUI"
@ -94,32 +113,10 @@ FluWindow {
                    ItemsOriginal.startPageByItem(data)
                }
        }
-        actionItem:Item{
-            height: 40
-            width: 148
-            RowLayout{
-                anchors.centerIn: parent
-                spacing: 5
-                FluText{
-                    text:lang.dark_mode
-                }
-                FluToggleSwitch{
-                    selected: FluTheme.dark
-                    clickFunc:function(){
-                        if(FluTheme.dark){
-                            FluTheme.darkMode = FluDarkMode.Light
-                        }else{
-                            FluTheme.darkMode = FluDarkMode.Dark
-                        }
-                    }
-                }
-            }
-        }
        Component.onCompleted: {
            ItemsOriginal.navigationView = nav_view
            ItemsFooter.navigationView = nav_view
            nav_view.setCurrentIndex(0)
        }
    }
-
 }
--- a/example/qml/window/MediaWindow.qml
+++ b/example/qml/window/MediaWindow.qml
@ -2,8 +2,9 @@
 import QtQuick.Controls
 import QtQuick.Layouts
 import FluentUI
+import "../component"

-FluWindow {
+CustomWindow {

    title:"视频播放器"
    width: 640
--- a/example/qml/window/SingleInstanceWindow.qml
+++ b/example/qml/window/SingleInstanceWindow.qml
@ -2,17 +2,15 @@
 import QtQuick.Controls
 import QtQuick.Layouts
 import FluentUI
+import "../component"

-FluWindow {
+CustomWindow {

    id:window
    title:"SingleInstance"
    width: 500
    height: 600
-    minimumWidth: 500
-    minimumHeight: 600
-    maximumWidth: 500
-    maximumHeight: 600
+    fixSize: true
    launchMode: FluWindow.SingleInstance

    FluTextBox{
@ -34,5 +32,4 @@ FluWindow {
        }
        text:"我是一个SingleInstance模式的窗口，如果我存在，我会销毁之前的窗口，并创建一个新窗口"
    }
-
 }
--- a/example/qml/window/SingleTaskWindow.qml
+++ b/example/qml/window/SingleTaskWindow.qml
@ -2,17 +2,15 @@
 import QtQuick.Controls
 import QtQuick.Layouts
 import FluentUI
+import "../component"

-FluWindow {
+CustomWindow {

    id:window
    title:"SingleTask"
    width: 500
    height: 600
-    minimumWidth: 500
-    minimumHeight: 600
-    maximumWidth: 500
-    maximumHeight: 600
+    fixSize: true
    launchMode: FluWindow.SingleTask

    FluText{
--- a/example/qml/window/StandardWindow.qml
+++ b/example/qml/window/StandardWindow.qml
@ -2,17 +2,15 @@
 import QtQuick.Controls
 import QtQuick.Layouts
 import FluentUI
+import "../component"

-FluWindow {
+CustomWindow {

    id:window
    title:"Standard"
    width: 500
    height: 600
-    minimumWidth: 500
-    minimumHeight: 600
-    maximumWidth: 500
-    maximumHeight: 600
+    fixSize: true
    launchMode: FluWindow.Standard

    FluText{
--- a/example/res/image/image_huoyin.webp
+++ b/example/res/image/image_huoyin.webp
--- a/example/src/main.cpp
+++ b/example/src/main.cpp
@ -4,23 +4,24 @@
 #include <QDir>
 #include <QQuickWindow>
 #include <QProcess>
+#include <FramelessHelper/Quick/framelessquickmodule.h>
+#include <FramelessHelper/Core/private/framelessconfig_p.h>
 #include "lang/Lang.h"
 #include "AppInfo.h"
 #include "tool/IPC.h"

-int main(int argc, char *argv[])
+FRAMELESSHELPER_USE_NAMESPACE
+
+    int main(int argc, char *argv[])
 {
    //将样式设置为Basic，不然会导致组件显示异常
    qputenv("QT_QUICK_CONTROLS_STYLE","Basic");
-    //6.4及以下监听系统深色模式变化
-#ifdef Q_OS_WIN
-    qputenv("QT_QPA_PLATFORM","windows:darkmode=2");
-#endif
+    FramelessHelper::Quick::initialize();
    QGuiApplication::setOrganizationName("ZhuZiChu");
    QGuiApplication::setOrganizationDomain("https://zhuzichu520.github.io");
    QGuiApplication::setApplicationName("FluentUI");
-    //    QQuickWindow::setGraphicsApi(QSGRendererInterface::Software);
    QGuiApplication app(argc, argv);
+    FramelessConfig::instance()->set(Global::Option::ForceHideWindowFrameBorder);
    AppInfo* appInfo = new AppInfo();
    IPC ipc(0);
    QString activeWindowEvent = "activeWindow";
@ -37,6 +38,7 @@ int main(int argc, char *argv[])
    }
    app.setQuitOnLastWindowClosed(false);
    QQmlApplicationEngine engine;
+    FramelessHelper::Quick::registerTypes(&engine);
    QQmlContext * context = engine.rootContext();
    Lang* lang = appInfo->lang();
    context->setContextProperty("lang",lang);
@ -45,7 +47,7 @@ int main(int argc, char *argv[])
    });
    context->setContextProperty("appInfo",appInfo);
    const QUrl url(QStringLiteral("qrc:/example/qml/App.qml"));
-//    const QUrl url(QStringLiteral("qrc:/example/qml/TestWindow.qml"));
+    //    const QUrl url(QStringLiteral("qrc:/example/qml/TestWindow.qml"));
    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
        &app, [url](QObject *obj, const QUrl &objUrl) {
            if (!obj && url == objUrl)
--- a/1
+++ b/1
--- a/src/CMakeLists.txt
+++ b/src/CMakeLists.txt
@ -13,7 +13,7 @@ endif()
 set(QML_PLUGIN_DIRECTORY ${CMAKE_PREFIX_PATH}/qml/FluentUI)

 #设置版本号
-add_definitions(-DVERSION=1,3,0,0)
+add_definitions(-DVERSION=1,3,1,0)

 find_package(Qt6 REQUIRED COMPONENTS Core Quick Qml ShaderTools)

@ -61,9 +61,9 @@ qt_add_qml_module(fluentuiplugin

 #链接库
 target_link_libraries(fluentuiplugin PUBLIC
-    Qt::Core
-    Qt::Quick
-    Qt::Qml
+    Qt::CorePrivate
+    Qt::QuickPrivate
+    Qt::QmlPrivate
 )

 #链接库 win32库 不然mingw会编译错误
--- a/src/FluApp.cpp
+++ b/src/FluApp.cpp
@ -78,7 +78,6 @@ void FluApp::navigate(const QString& route,const QJsonObject& argument,FluRegist
        fluRegister->to(view);
    }
    view->setColor(QColor(Qt::transparent));
-    view->show();
 }

 QJsonArray FluApp::awesomelist(const QString& keyword)
--- a/src/FluApp.h
+++ b/src/FluApp.h
@ -8,9 +8,6 @@
 #include <QQmlContext>
 #include <QJsonObject>
 #include <QQmlEngine>
-#include "FluTheme.h"
-#include "FluTools.h"
-#include "FluColors.h"
 #include "FluRegister.h"
 #include "stdafx.h"

--- a/src/FluTheme.cpp
+++ b/src/FluTheme.cpp
@ -1,8 +1,10 @@
-#include "FluTheme.h"
+#include "FluTheme.h"

 #include "Def.h"
+#include "FluColors.h"
 #include <QPalette>
-#include "FluApp.h"
+#include <QtGui/qpa/qplatformtheme.h>
+#include <QtGui/private/qguiapplication_p.h>
 #include <QGuiApplication>

 FluTheme* FluTheme::m_instance = nullptr;
@ -24,14 +26,16 @@ FluTheme::FluTheme(QObject *parent)
    primaryColor(FluColors::getInstance()->Blue());
    nativeText(false);
    darkMode(Fluent_DarkMode::Fluent_DarkModeType::Light);
+    _systemDark = systemDark();
    qApp->installEventFilter(this);
 }

 bool FluTheme::eventFilter(QObject *obj, QEvent *event)
 {
    Q_UNUSED(obj);
-    if (event->type() == QEvent::ApplicationPaletteChange)
+    if (event->type() == QEvent::ApplicationPaletteChange || event->type() == QEvent::ThemeChange)
    {
+        _systemDark = systemDark();
        Q_EMIT darkChanged();
        event->accept();
        return true;
@ -41,9 +45,10 @@ bool FluTheme::eventFilter(QObject *obj, QEvent *event)

 bool FluTheme::systemDark()
 {
-    QPalette palette = qApp->palette();
-    QColor color = palette.color(QPalette::Window).rgb();
-    return !(color.red() * 0.2126 + color.green() * 0.7152 + color.blue() * 0.0722 > 255 / 2);
+    if (const QPlatformTheme * const theme = QGuiApplicationPrivate::platformTheme()) {
+        return (theme->appearance() == QPlatformTheme::Appearance::Dark);
+    }
+    return false;
 }

 bool FluTheme::dark(){
@ -52,7 +57,7 @@ bool FluTheme::dark(){
    }else if(_darkMode == Fluent_DarkMode::Fluent_DarkModeType::Light){
        return false;
    }else if(_darkMode == Fluent_DarkMode::Fluent_DarkModeType::System){
-        return systemDark();
+        return _systemDark;
    }else{
        return false;
    }
--- a/src/FluTheme.h
+++ b/src/FluTheme.h
@ -47,6 +47,7 @@ public:
    Q_SIGNAL void darkChanged();
 private:
    bool _dark;
+    bool _systemDark;
    bool eventFilter(QObject *obj, QEvent *event);
    bool systemDark();
 };
--- a/src/FluTools.cpp
+++ b/src/FluTools.cpp
@ -39,4 +39,28 @@ QString FluTools::readFile(const QString &fileName)
    return content;
 }

+bool FluTools::isMacos(){
+#if defined(Q_OS_MACOS)
+    return true;
+#else
+    return false;
+#endif
+}
+
+bool FluTools::isLinux(){
+#if defined(Q_OS_LINUX)
+    return true;
+#else
+    return false;
+#endif
+}
+
+bool FluTools::isWin(){
+#if defined(Q_OS_WIN)
+    return true;
+#else
+    return false;
+#endif
+}
+

--- a/src/FluTools.h
+++ b/src/FluTools.h
@ -42,6 +42,12 @@ public:
     */
    Q_INVOKABLE QString readFile(const QString &fileName);

+    Q_INVOKABLE bool isMacos();
+
+    Q_INVOKABLE bool isLinux();
+
+    Q_INVOKABLE bool isWin();
+
 };

 #endif // FLUTOOLS_H
--- a/src/imports/FluentUI/Controls/FluAcrylic.qml
+++ b/src/imports/FluentUI/Controls/FluAcrylic.qml
@ -4,29 +4,34 @@ import FluentUI

 Item {
    id: control
-
    property alias color: rect.color
    property alias acrylicOpacity: rect.opacity
-
-    Rectangle {
-        id: rect
+    property alias radius:bg.radius
+    property alias blurRadius: blur.radius
+    property int rectX: control.x
+    property int rectY: control.y
+    property var sourceItem: control.parent
+    FluRectangle{
+        id:bg
        anchors.fill: parent
-        color: "white"
-        opacity: 0.05
+        radius: [8,8,8,8]
+        ShaderEffectSource {
+            id: effect_source
+            anchors.fill: parent
+            sourceItem: control.sourceItem
+            sourceRect: Qt.rect(rectX, rectY, control.width, control.height)
+            Rectangle {
+                id: rect
+                anchors.fill: parent
+                color: "white"
+                opacity: 0.5
+            }
+        }
+        FastBlur {
+            id:blur
+            radius: 50
+            anchors.fill: effect_source
+            source: effect_source
+        }
    }
-
-    ShaderEffectSource {
-        id: effect_source
-        anchors.fill: parent
-        sourceItem: control.parent
-        sourceRect: Qt.rect(control.x, control.y, control.width, control.height)
-    }
-
-    GaussianBlur {
-        radius: 20
-        anchors.fill: effect_source
-        source: effect_source
-        samples: 1 + radius * 2
-    }
-
 }
--- a/src/imports/FluentUI/Controls/FluAppBar.qml
+++ b/src/imports/FluentUI/Controls/FluAppBar.qml
@ -5,7 +5,6 @@ import QtQuick.Layouts
 import FluentUI

 Rectangle{
-
    property string title: ""
    property string darkText : "夜间模式"
    property string minimizeText : "最小化"
@ -20,48 +19,44 @@ Rectangle{
    property color closeNormalColor: Qt.rgba(0,0,0,0)
    property color closeHoverColor:  Qt.rgba(251/255,115/255,115/255,1)
    property bool showDark: false
+    property bool titleVisible: true
+    property bool isMac: FluTools.isMacos()
    property color borerlessColor : FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
-
+    id:root
+    color: Qt.rgba(0,0,0,0)
+    height: visible ? 30 : 0
+    opacity: visible
+    z: 65535
    Item{
        id:d
        property var win: Window.window
        property bool isRestore: win && Window.Maximized === win.visibility
        property bool resizable: win && !(win.minimumHeight === win.maximumHeight && win.maximumWidth === win.minimumWidth)
    }
-
-    id:root
-    color: Qt.rgba(0,0,0,0)
-    visible: false
-    height: visible ? 30 : 0
-    opacity: visible
-    z: 65535
-
    TapHandler {
-        onTapped: if (tapCount === 2) toggleMaximized()
+        onTapped: if (tapCount === 2) btn_maximize.clicked()
        gesturePolicy: TapHandler.DragThreshold
    }
-
    DragHandler {
        target: null
        grabPermissions: TapHandler.CanTakeOverFromAnything
        onActiveChanged: if (active) { d.win.startSystemMove(); }
    }
-
    FluText {
        text: title
        anchors{
            verticalCenter: parent.verticalCenter
-            left: parent.left
-            leftMargin: 10
+            left: isMac ? undefined : parent.left
+            leftMargin: isMac ? undefined : 10
+            horizontalCenter: isMac ? parent.horizontalCenter : undefined
        }
+        visible: root.titleVisible
        color:root.textColor
    }
-
    RowLayout{
        anchors.right: parent.right
        height: root.height
        spacing: 0
-
        RowLayout{
            Layout.alignment: Qt.AlignVCenter
            Layout.rightMargin: 5
@ -82,8 +77,8 @@ Rectangle{
                }
            }
        }
-
        FluIconButton{
+            id:btn_minimize
            width: 40
            height: 30
            iconSource : FluentIcons.ChromeMinimize
@ -91,33 +86,40 @@ Rectangle{
            iconSize: 11
            text:minimizeText
            radius: 0
+            visible: !isMac
            iconColor: root.textColor
            color: hovered ? minimizeHoverColor : minimizeNormalColor
            onClicked: {
-                d.win.showMinimized()
+                d.win.visibility = Window.Minimized
            }
        }
        FluIconButton{
+            id:btn_maximize
            width: 40
            height: 30
            iconSource : d.isRestore  ? FluentIcons.ChromeRestore : FluentIcons.ChromeMaximize
            color: hovered ? maximizeHoverColor : maximizeNormalColor
            Layout.alignment: Qt.AlignVCenter
-            visible: d.resizable
+            visible: d.resizable && !isMac
            radius: 0
            iconColor: root.textColor
            text:d.isRestore?restoreText:maximizeText
            iconSize: 11
            onClicked: {
-                toggleMaximized()
+                if (d.win.visibility === Window.Maximized)
+                    d.win.visibility = Window.Windowed
+                else
+                    d.win.visibility = Window.Maximized
            }
        }
        FluIconButton{
+            id:btn_close
            iconSource : FluentIcons.ChromeClose
            Layout.alignment: Qt.AlignVCenter
            text:closeText
            width: 40
            height: 30
+            visible: !isMac
            radius: 0
            iconSize: 10
            iconColor: hovered ? Qt.rgba(1,1,1,1) : root.textColor
@ -128,14 +130,16 @@ Rectangle{
        }
    }

-    function toggleMaximized() {
-        if(!d.resizable)
-            return
-        if (d.win.visibility === Window.Maximized) {
-            d.win.showNormal();
-        } else {
-            d.win.showMaximized();
-        }
+    function minimizeButton(){
+        return btn_minimize
+    }
+
+    function maximizeButton(){
+        return btn_maximize
+    }
+
+    function closeButton(){
+        return btn_close
    }

 }
--- a/src/imports/FluentUI/Controls/FluArea.qml
+++ b/src/imports/FluentUI/Controls/FluArea.qml
@ -4,33 +4,28 @@ import QtQuick.Window
 import FluentUI

 Rectangle {
-
    default property alias content: container.data
    property int paddings : 0
    property int leftPadding : 0
    property int rightPadding : 0
    property int topPadding : 0
    property int bottomPadding : 0
-
    radius: 4
    color: FluTheme.dark ? Window.active ?  Qt.rgba(38/255,44/255,54/255,1) : Qt.rgba(39/255,39/255,39/255,1) : Qt.rgba(251/255,251/255,253/255,1)
    border.color: FluTheme.dark ? Window.active ? Qt.rgba(55/255,55/255,55/255,1):Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,229/255,234/255,1)
    border.width: 1
    implicitHeight: height
    implicitWidth: width
-
    Behavior on color{
        ColorAnimation {
            duration: 300
        }
    }
-
    Behavior on border.color{
        ColorAnimation {
            duration: 300
        }
    }
-
    Item {
        id: container
        anchors.fill: parent
@ -39,5 +34,4 @@ Rectangle {
        anchors.topMargin: Math.max(paddings,topPadding)
        anchors.bottomMargin: Math.max(paddings,bottomPadding)
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluAutoSuggestBox.qml
+++ b/src/imports/FluentUI/Controls/FluAutoSuggestBox.qml
@ -3,25 +3,20 @@ import QtQuick.Controls
 import FluentUI

 FluTextBox{
-
    property var items:[]
    property string emptyText: "没有找到结果"
    property int autoSuggestBoxReplacement: FluentIcons.Search
    signal itemClicked(var data)
    signal handleClicked
-
    id:control
    width: 300
-
    Component.onCompleted: {
        loadData()
    }
-
    QtObject{
        id:d
        property bool flagVisible: true
    }
-
    Popup{
        id:control_popup
        y:control.height
@ -126,19 +121,16 @@ FluTextBox{
            control_popup.visible = true
        }
    }
-
    function handleClick(modelData){
        control_popup.visible = false
        control.itemClicked(modelData)
        updateText(modelData.title)
    }
-
    function updateText(text){
        d.flagVisible = false
        control.text = text
        d.flagVisible = true
    }
-
    function loadData(){
        var result = []
        if(items==null){
@ -152,5 +144,4 @@ FluTextBox{
        })
        list_view.model = result
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluBadge.qml
+++ b/src/imports/FluentUI/Controls/FluBadge.qml
@ -3,11 +3,9 @@ import QtQuick.Controls
 import FluentUI

 Rectangle{
-
    property bool isDot: false
    property bool showZero: true
    property int count: 0
-
    id:control
    color:Qt.rgba(255/255,77/255,79/255,1)
    width: {
@ -61,7 +59,6 @@ Rectangle{
            return  -10
        }
    }
-
    Text{
        anchors.centerIn: parent
        color: Qt.rgba(1,1,1,1)
@ -72,7 +69,4 @@ Rectangle{
            return count+"+"
        }
    }
-
-
-
 }
--- a/src/imports/FluentUI/Controls/FluBreadcrumbBar.qml
+++ b/src/imports/FluentUI/Controls/FluBreadcrumbBar.qml
@ -4,26 +4,21 @@ import QtQuick.Layouts
 import FluentUI

 Item {
-
    property int textSize: 15
    property string separator: "/"
    property var items: []
    property int spacing: 5
    signal clickItem(var model)
-
    id:control
    implicitWidth: 300
    height: 30
-
    onItemsChanged: {
        list_model.clear()
        list_model.append(items)
    }
-
    ListModel{
        id:list_model
    }
-
    ListView{
        id:list_view
        width: parent.width
@ -88,13 +83,10 @@ Item {
            }
        }
    }
-
    function remove(index,count){
        list_model.remove(index,count)
    }
-
    function count(){
        return list_model.count
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluButton.qml
+++ b/src/imports/FluentUI/Controls/FluButton.qml
@ -4,23 +4,19 @@ import QtQuick.Controls.Basic
 import FluentUI

 Button {
-
    property bool disabled: false
    property color normalColor: FluTheme.dark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(254/255,254/255,254/255,1)
    property color hoverColor: FluTheme.dark ? Qt.rgba(68/255,68/255,68/255,1) : Qt.rgba(251/255,251/255,251/255,1)
    property color disableColor: FluTheme.dark ? Qt.rgba(59/255,59/255,59/255,1) : Qt.rgba(252/255,252/255,252/255,1)
-
    id: control
-    topPadding:5
-    bottomPadding:5
-    leftPadding:15
-    rightPadding:15
    enabled: !disabled
    focusPolicy:Qt.TabFocus
+    horizontalPadding:12
    Keys.onSpacePressed: control.visualFocus&&clicked()
    font:FluTextStyle.Body
-
    background: Rectangle{
+        implicitWidth: 28
+        implicitHeight: 28
        border.color: FluTheme.dark ? "#505050" : "#DFDFDF"
        border.width: 1
        radius: 4
--- a/src/imports/FluentUI/Controls/FluCalendarPicker.qml
+++ b/src/imports/FluentUI/Controls/FluCalendarPicker.qml
@ -5,13 +5,11 @@ import QtQuick.Window
 import FluentUI

 Rectangle {
-
    property color dividerColor: FluTheme.dark ? Qt.rgba(77/255,77/255,77/255,1) : Qt.rgba(239/255,239/255,239/255,1)
    property color hoverColor: FluTheme.dark ? Qt.rgba(68/255,68/255,68/255,1) : Qt.rgba(251/255,251/255,251/255,1)
    property color normalColor: FluTheme.dark ? Qt.rgba(61/255,61/255,61/255,1) : Qt.rgba(254/255,254/255,254/255,1)
    property string text: "请选择日期"
    property var window : Window.window
-
    id:control
    color: {
        if(mouse_area.containsMouse){
@ -24,7 +22,6 @@ Rectangle {
    radius: 4
    border.width: 1
    border.color: dividerColor
-
    MouseArea{
        id:mouse_area
        hoverEnabled: true
@ -33,7 +30,6 @@ Rectangle {
            popup.showPopup()
        }
    }
-
    FluText{
        id:text_date
        anchors{
@ -47,7 +43,6 @@ Rectangle {
        horizontalAlignment: Text.AlignHCenter
        text:control.text
    }
-
    FluIcon{
        iconSource: FluentIcons.Calendar
        iconSize: 14
@ -58,8 +53,6 @@ Rectangle {
            rightMargin: 12
        }
    }
-
-
    Menu{
        id:popup
        height: container.height
@ -75,7 +68,6 @@ Rectangle {
                duration: 83
            }
        }
-
        exit:Transition {
            NumberAnimation {
                property: "opacity"
@ -84,7 +76,6 @@ Rectangle {
                duration: 83
            }
        }
-
        contentItem: Item{
            clip: true
            FluCalendarView{
--- a/src/imports/FluentUI/Controls/FluCalendarView.qml
+++ b/src/imports/FluentUI/Controls/FluCalendarView.qml
@ -3,27 +3,22 @@ import QtQuick.Controls
 import FluentUI

 Item {
-
    enum DisplayMode {
        Month,
        Year,
        Decade
    }
-
    property int displayMode: FluCalendarView.Month
    property var date: new Date()
    property var currentDate : new Date()
    property var toDay: new Date()
    signal dateClicked(var date)
-
    id:control
    width: 280
    height: 325
-
    Component.onCompleted: {
        updateMouth(date)
    }
-
    Component{
        id:com_week
        Item{
@ -35,7 +30,6 @@ Item {
            }
        }
    }
-
    Component{
        id:com_year
        Button{
@ -94,7 +88,6 @@ Item {
            contentItem: Item{}
        }
    }
-
    Component{
        id:com_month
        Button{
@ -154,8 +147,6 @@ Item {
            contentItem: Item{}
        }
    }
-
-
    Component{
        id:com_day
        Button{
@ -189,7 +180,6 @@ Item {
                        }
                    }
                }
-
                Rectangle{
                    id:backgound_today
                    anchors.centerIn: parent
@ -201,7 +191,6 @@ Item {
                    border.color: FluTheme.primaryColor.dark
                    border.width: 1
                }
-
                Rectangle{
                    id:backgound_selected
                    anchors.centerIn: parent
@ -211,7 +200,6 @@ Item {
                    visible: isToDay
                    color: FluTheme.primaryColor.dark
                }
-
                FluText{
                    text:date.getDate()
                    anchors.centerIn: parent
@ -229,15 +217,12 @@ Item {
            contentItem: Item{}
        }
    }
-
    FluArea{
        anchors.fill: parent
        radius: 5
-
        FluShadow{
            radius: 5
        }
-
        Rectangle{
            id:layout_divider
            height: 1
@ -248,7 +233,6 @@ Item {
                topMargin: 44
            }
        }
-
        Item{
            id:layout_top
            anchors{
@ -257,7 +241,6 @@ Item {
                top: parent.top
                bottom: layout_divider.top
            }
-
            FluTextButton{
                id:title
                leftPadding: 0
@ -278,7 +261,6 @@ Item {
                    }
                }
            }
-
            FluIconButton{
                id:icon_up
                iconSource: FluentIcons.CaretUpSolid8
@ -309,7 +291,6 @@ Item {
                    }
                }
            }
-
            FluIconButton{
                id:icon_down
                iconSource: FluentIcons.CaretDownSolid8
@ -341,11 +322,9 @@ Item {
                }
            }
        }
-
        ListModel {
            id:list_model
        }
-
        Item{
            id:layout_bottom
            anchors{
@ -354,7 +333,6 @@ Item {
                top: layout_divider.bottom
                bottom: parent.bottom
            }
-
            GridView{
                model: list_model
                anchors.fill: parent
@ -388,23 +366,18 @@ Item {
            }
        }
    }
-
    function createItemWeek(name){
        return {type:0,date:new Date(),name:name,isDecade:false}
    }
-
    function createItemDay(date){
        return {type:1,date:date,name:"",isDecade:false}
    }
-
    function createItemMonth(date){
        return {type:2,date:date,name:"",isDecade:false}
    }
-
    function createItemYear(date,isDecade){
        return {type:3,date:date,name:"",isDecade:isDecade}
    }
-
    function updateDecade(date){
        list_model.clear()
        var year = date.getFullYear()
@ -417,7 +390,6 @@ Item {
        }
        title.text = decadeStart+"-"+(decadeStart+10)
    }
-
    function updateYear(date){
        list_model.clear()
        var year = date.getFullYear()
@ -429,7 +401,6 @@ Item {
        }
        title.text = year+"年"
    }
-
    function updateMouth(date){
        list_model.clear()
        list_model.append([createItemWeek("一"),createItemWeek("二"),createItemWeek("三"),createItemWeek("四"),createItemWeek("五"),createItemWeek("六"),createItemWeek("日")])
@ -468,6 +439,4 @@ Item {
        }
        title.text = year+"年"+(month+1)+"月"
    }
-
-
 }
--- a/src/imports/FluentUI/Controls/FluCarousel.qml
+++ b/src/imports/FluentUI/Controls/FluCarousel.qml
@ -3,20 +3,16 @@ import QtQuick.Controls
 import FluentUI

 Item {
-
    property bool flagXChanged: true
    property int radius : 5
    property int loopTime: 2000
    property bool showIndicator: true
-
    id:control
    width: 400
    height: 300
-
    ListModel{
        id:content_model
    }
-
    FluRectangle{
        anchors.fill: parent
        radius: [control.radius,control.radius,control.radius,control.radius]
@ -80,14 +76,6 @@ Item {
            }
        }
    }
-    function setData(data){
-        content_model.clear()
-        content_model.append(data[data.length-1])
-        content_model.append(data)
-        content_model.append(data[0])
-        list_view.currentIndex = 1
-        timer_run.restart()
-    }
    Row{
        spacing: 10
        anchors{
@ -133,4 +121,12 @@ Item {
            timer_anim.start()
        }
    }
+    function setData(data){
+        content_model.clear()
+        content_model.append(data[data.length-1])
+        content_model.append(data)
+        content_model.append(data[0])
+        list_view.currentIndex = 1
+        timer_run.restart()
+    }
 }
--- a/src/imports/FluentUI/Controls/FluCheckBox.qml
+++ b/src/imports/FluentUI/Controls/FluCheckBox.qml
@ -5,7 +5,6 @@ import QtQuick.Layouts
 import FluentUI

 Button {
-
    property bool selected: false
    property var clickFunc
    property bool disabled: false
@ -14,7 +13,6 @@ Button {
    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 selectedColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
    property color hoverColor: FluTheme.dark ? Qt.rgba(72/255,72/255,72/255,1) : Qt.rgba(236/255,236/255,236/255,1)
@ -22,7 +20,6 @@ Button {
    property color selectedPreesedColor: FluTheme.dark ? Qt.darker(selectedColor,1.3) : Qt.lighter(selectedColor,1.3)
    property color selectedDisableColor: FluTheme.dark ? Qt.rgba(82/255,82/255,82/255,1) : Qt.rgba(199/255,199/255,199/255,1)
    property color disableColor: FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(253/255,253/255,253/255,1)
-
    id:control
    enabled: !disabled
    focusPolicy:Qt.TabFocus
--- a/src/imports/FluentUI/Controls/FluColorPicker.qml
+++ b/src/imports/FluentUI/Controls/FluColorPicker.qml
@ -75,5 +75,4 @@ Button{
            popup.open()
        }
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluColorView.qml
+++ b/src/imports/FluentUI/Controls/FluColorView.qml
@ -4,28 +4,21 @@ import FluentUI
 import "ColorPicker"

 Item {
-
    property alias colorValue: color_picker.colorValue
-
    width: color_picker.width+10
    height: color_picker.height
-
    FluArea{
        anchors.fill: parent
        radius: 5
-
        FluShadow{
            radius: 5
        }
-
        ColorPicker{
            id:color_picker
        }
    }
-
    function setColor(color) {
        color_picker.setColor(color)
    }
-
 }

--- a/src/imports/FluentUI/Controls/FluContentDialog.qml
+++ b/src/imports/FluentUI/Controls/FluContentDialog.qml
@ -6,7 +6,6 @@ import FluentUI

 Popup {
    id: popup
-
    property string title: "Title"
    property string message: "Message"
    property string neutralText: "Neutral"
@ -30,7 +29,6 @@ Popup {
    anchors.centerIn: Overlay.overlay
    closePolicy: Popup.CloseOnEscape
    background:Item{}
-
    enter: Transition {
        reversible: true
        NumberAnimation {
@ -58,11 +56,9 @@ Popup {
        implicitHeight: text_title.height + text_message.height + layout_actions.height
        color:FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(249/255,249/255,249/255,1)
        radius:5
-
        FluShadow{
            radius: 5
        }
-
        FluText{
            id:text_title
            font: FluTextStyle.TitleLarge
@ -77,7 +73,6 @@ Popup {
                right: parent.right
            }
        }
-
        FluText{
            id:text_message
            font: FluTextStyle.Body
@ -93,7 +88,6 @@ Popup {
                right: parent.right
            }
        }
-
        Rectangle{
            id:layout_actions
            height: 68
@ -104,7 +98,6 @@ Popup {
                left: parent.left
                right: parent.right
            }
-
            RowLayout{
                anchors
                {
@ -124,7 +117,6 @@ Popup {
                        neutralClicked()
                    }
                }
-
                FluButton{
                    id:negative_btn
                    Layout.fillWidth: true
@ -136,7 +128,6 @@ Popup {
                        negativeClicked()
                    }
                }
-
                FluFilledButton{
                    id:positive_btn
                    Layout.fillWidth: true
--- a/src/imports/FluentUI/Controls/FluContentPage.qml
+++ b/src/imports/FluentUI/Controls/FluContentPage.qml
@ -5,16 +5,15 @@ import QtQuick.Controls
 import FluentUI

 Item {
-
    property alias title: text_title.text
    default property alias content: container.data
-    property int leftPadding: 0
+    property int leftPadding: 10
    property int topPadding: 0
-    property int rightPadding: 0
-    property int bottomPadding: 0
-
+    property int rightPadding: 10
+    property int bottomPadding: 10
+    property int pageMode: FluNavigationView.Standard
+    property string url: ''
    id:control
-
    FluText{
        id:text_title
        font: FluTextStyle.TitleLarge
@ -27,7 +26,6 @@ Item {
            rightMargin: control.rightPadding
        }
    }
-
    Item{
        clip: true
        id:container
@ -41,5 +39,4 @@ Item {
            bottomMargin: control.bottomPadding
        }
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluCopyableText.qml
+++ b/src/imports/FluentUI/Controls/FluCopyableText.qml
@ -3,9 +3,7 @@ import QtQuick.Controls
 import FluentUI

 TextField {
-
    property color textColor: FluTheme.dark ? FluColors.White : FluColors.Grey220
-
    id:control
    color: textColor
    readOnly: true
@ -34,5 +32,4 @@ TextField {
        id:menu
        inputItem: control
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluDatePicker.qml
+++ b/src/imports/FluentUI/Controls/FluDatePicker.qml
@ -5,7 +5,6 @@ import QtQuick.Window
 import FluentUI

 Rectangle {
-
    property color dividerColor: FluTheme.dark ? Qt.rgba(77/255,77/255,77/255,1) : Qt.rgba(239/255,239/255,239/255,1)
    property color hoverColor: FluTheme.dark ? Qt.rgba(68/255,68/255,68/255,1) : Qt.rgba(251/255,251/255,251/255,1)
    property color normalColor: FluTheme.dark ? Qt.rgba(61/255,61/255,61/255,1) : Qt.rgba(254/255,254/255,254/255,1)
@ -13,7 +12,6 @@ Rectangle {
    property bool showYear: true
    property bool changeFlag: true
    readonly property var rowData: ["","",""]
-
    id:root
    color: {
        if(mouse_area.containsMouse){
@ -26,7 +24,6 @@ Rectangle {
    radius: 4
    border.width: 1
    border.color: dividerColor
-
    MouseArea{
        id:mouse_area
        hoverEnabled: true
@ -35,7 +32,6 @@ Rectangle {
            popup.showPopup()
        }
    }
-
    Rectangle{
        id:divider_1
        width: 1
@ -44,8 +40,6 @@ Rectangle {
        color: dividerColor
        visible: showYear
    }
-
-
    Rectangle{
        id:divider_2
        width: 1
@ -53,7 +47,6 @@ Rectangle {
        height: parent.height
        color: dividerColor
    }
-
    FluText{
        id:text_year
        anchors{
@ -67,8 +60,6 @@ Rectangle {
        horizontalAlignment: Text.AlignHCenter
        text:"年"
    }
-
-
    FluText{
        id:text_month
        anchors{
@ -81,8 +72,6 @@ Rectangle {
        horizontalAlignment: Text.AlignHCenter
        text:"月"
    }
-
-
    FluText{
        id:text_day
        anchors{
@ -95,7 +84,6 @@ Rectangle {
        horizontalAlignment: Text.AlignHCenter
        text:"日"
    }
-
    Menu{
        id:popup
        modal: true
@ -111,7 +99,6 @@ Rectangle {
                duration: 83
            }
        }
-
        exit:Transition {
            NumberAnimation {
                property: "opacity"
@ -139,20 +126,16 @@ Rectangle {
                FluShadow{
                    radius: 4
                }
-
                RowLayout{
                    id:layout_content
                    spacing: 0
                    width: parent.width
                    height: 300
-
                    Component{
                        id:list_delegate
-
                        Item{
                            height:38
                            width:getListView().width
-
                            function getListView(){
                                if(type === 0)
                                    return list_view_1
@ -161,8 +144,6 @@ Rectangle {
                                if(type === 2)
                                    return list_view_3
                            }
-
-
                            Rectangle{
                                anchors.fill: parent
                                anchors.topMargin: 2
@ -226,7 +207,6 @@ Rectangle {
                            }
                        }
                    }
-
                    ListView{
                        id:list_view_1
                        width: 100
@ -292,14 +272,12 @@ Rectangle {
                        }
                    }
                }
-
                Rectangle{
                    width: parent.width
                    height: 1
                    anchors.top: layout_content.bottom
                    color: dividerColor
                }
-
                Rectangle{
                    id:layout_actions
                    height: 40
@ -310,14 +288,12 @@ Rectangle {
                        left: parent.left
                        right: parent.right
                    }
-
                    Item {
                        id:divider
                        width: 1
                        height: parent.height
                        anchors.centerIn: parent
                    }
-
                    FluButton{
                        anchors{
                            left: parent.left
@ -331,7 +307,6 @@ Rectangle {
                            popup.close()
                        }
                    }
-
                    FluFilledButton{
                        anchors{
                            right: parent.right
@ -355,23 +330,18 @@ Rectangle {
            rowData[0] = text_year.text
            rowData[1] = text_month.text
            rowData[2] = text_day.text
-
            const now = new Date();
            var year = text_year.text === "年"? now.getFullYear() : Number(text_year.text);
            var month = text_month.text === "月"? now.getMonth() + 1 : Number(text_month.text);
            var day =  text_day.text === "日" ? now.getDate() : Number(text_day.text);
-
            list_view_1.currentIndex = list_view_1.model.indexOf(year)
            text_year.text = year
-
            list_view_2.model = generateMonthArray(1,12)
            list_view_2.currentIndex = list_view_2.model.indexOf(month)
            text_month.text = month
-
            list_view_3.model = generateMonthDaysArray(year,month)
            list_view_3.currentIndex = list_view_3.model.indexOf(day)
            text_day.text = day
-
            var pos = root.mapToItem(null, 0, 0)
            if(window.height>pos.y+root.height+container.height){
                popup.y = root.height
@ -382,7 +352,6 @@ Rectangle {
            }
            popup.open()
        }
-
        onClosed: {
            if(changeFlag){
                text_year.text = rowData[0]
@ -391,7 +360,6 @@ Rectangle {
            }
        }
    }
-
    function generateYearArray(startYear, endYear) {
        const yearArray = [];
        for (let year = startYear; year <= endYear; year++) {
@ -399,7 +367,6 @@ Rectangle {
        }
        return yearArray;
    }
-
    function generateMonthArray(startMonth, endMonth) {
        const monthArray = [];
        for (let month = startMonth; month <= endMonth; month++) {
@ -407,7 +374,6 @@ Rectangle {
        }
        return monthArray;
    }
-
    function generateMonthDaysArray(year, month) {
        const monthDaysArray = [];
        const lastDayOfMonth = new Date(year, month, 0).getDate();
@ -416,6 +382,4 @@ Rectangle {
        }
        return monthDaysArray;
    }
-
-
 }
--- a/src/imports/FluentUI/Controls/FluDivider.qml
+++ b/src/imports/FluentUI/Controls/FluDivider.qml
@ -3,13 +3,10 @@ import QtQuick.Window
 import FluentUI

 Rectangle {
-
    color: FluTheme.dark ? Window.active ? Qt.rgba(55/255,55/255,55/255,1):Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,230/255,234/255,1)
-
    Behavior on color{
        ColorAnimation {
            duration: 300
        }
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluDropDownButton.qml
+++ b/src/imports/FluentUI/Controls/FluDropDownButton.qml
@ -5,25 +5,21 @@ import QtQuick.Window
 import FluentUI

 Button {
-
    property bool disabled: false
    property color normalColor: FluTheme.dark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(254/255,254/255,254/255,1)
    property color hoverColor: FluTheme.dark ? Qt.rgba(68/255,68/255,68/255,1) : Qt.rgba(251/255,251/255,251/255,1)
    property color disableColor: FluTheme.dark ? Qt.rgba(59/255,59/255,59/255,1) : Qt.rgba(252/255,252/255,252/255,1)
    property var window : Window.window
    property alias items: menu.content
-
    id: control
-    topPadding:5
-    bottomPadding:5
-    leftPadding:15
    rightPadding:35
    enabled: !disabled
    focusPolicy:Qt.TabFocus
-
+    horizontalPadding:12
    Keys.onSpacePressed: control.visualFocus&&clicked()
-
    background: Rectangle{
+        implicitWidth: 28
+        implicitHeight: 28
        border.color: FluTheme.dark ? "#505050" : "#DFDFDF"
        border.width: 1
        radius: 4
@ -47,7 +43,6 @@ Button {
            }
            iconColor:title.color
        }
-
    }
    contentItem: FluText {
        id:title
@ -74,23 +69,22 @@ Button {
            }
        }
    }
-
    onClicked: {
-        var pos = control.mapToItem(null, 0, 0)
-        var containerHeight = menu.getContainerHeight()
-        if(window.height>pos.y+control.height+containerHeight){
-            menu.y = control.height
-        }else if(pos.y>containerHeight){
-            menu.y = -containerHeight
-        }else{
-            menu.y = window.height-(pos.y+containerHeight)
+        if(items && menu.getContainerCount()!==0){
+            var pos = control.mapToItem(null, 0, 0)
+            var containerHeight = menu.getContainerHeight()
+            if(window.height>pos.y+control.height+containerHeight){
+                menu.y = control.height
+            }else if(pos.y>containerHeight){
+                menu.y = -containerHeight
+            }else{
+                menu.y = window.height-(pos.y+containerHeight)
+            }
+            menu.open()
        }
-        menu.open()
    }
-
    FluMenu{
        id:menu
        width: control.width
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluExpander.qml
+++ b/src/imports/FluentUI/Controls/FluExpander.qml
@ -4,18 +4,15 @@ import QtQuick.Window
 import FluentUI

 Item {
-
    property string  headerText: "Titlte"
    property bool expand: false
    property int contentHeight : 300
    default property alias content: container.data
-
-    id:root
+    id:control
    height: layout_header.height + container.height
    width: 400
    implicitWidth: width
    implicitHeight: height
-
    Rectangle{
        id:layout_header
        width: parent.width
@ -23,28 +20,24 @@ Item {
        radius: 4
        color: FluTheme.dark ? Window.active ? Qt.rgba(38/255,44/255,54/255,1) : Qt.rgba(39/255,39/255,39/255,1) : Qt.rgba(251/255,251/255,253/255,1)
        border.color: FluTheme.dark ?  Window.active ? Qt.rgba(55/255,55/255,55/255,1) : Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,229/255,234/255,1)
-
        Behavior on color{
            ColorAnimation {
                duration: 300
            }
        }
-
        Behavior on border.color{
            ColorAnimation {
                duration: 300
            }
        }
-
        MouseArea{
-            id:root_mouse
+            id:control_mouse
            anchors.fill: parent
            hoverEnabled: true
            onClicked: {
                expand = !expand
            }
        }
-
        FluText{
            text: headerText
            anchors{
@ -53,7 +46,6 @@ Item {
                leftMargin: 15
            }
        }
-
        FluIconButton{
            anchors{
                verticalCenter: parent.verticalCenter
@ -61,7 +53,7 @@ Item {
                rightMargin: 15
            }
            color:{
-                if(root_mouse.containsMouse || hovered){
+                if(control_mouse.containsMouse || hovered){
                    return FluTheme.dark ? Qt.rgba(73/255,73/255,73/255,1) : Qt.rgba(245/255,245/255,245/255,1)
                }
                return FluTheme.dark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
@ -81,8 +73,6 @@ Item {
            }
        }
    }
-
-
    Rectangle{
        id:container
        width: parent.width
@ -104,5 +94,4 @@ Item {
            }
        }
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluFilledButton.qml
+++ b/src/imports/FluentUI/Controls/FluFilledButton.qml
@ -4,23 +4,20 @@ import QtQuick.Controls.Basic
 import FluentUI

 Button {
-
    property bool disabled: false
    property color normalColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
    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)
-
    id: control
    enabled: !disabled
-    topPadding:5
-    bottomPadding:5
-    leftPadding:15
-    rightPadding:15
    Keys.onSpacePressed: control.visualFocus&&clicked()
    focusPolicy:Qt.TabFocus
    font:FluTextStyle.Body
+    horizontalPadding:12
    background: Rectangle{
+        implicitWidth: 28
+        implicitHeight: 28
        radius: 4
        FluFocusRectangle{
            visible: control.visualFocus
--- a/src/imports/FluentUI/Controls/FluFlipView.qml
+++ b/src/imports/FluentUI/Controls/FluFlipView.qml
@ -4,22 +4,18 @@ import QtQuick.Controls.Basic
 import FluentUI

 Item{
-
    property bool vertical: false
    default property alias content : swipe.contentData
    property alias currentIndex: swipe.currentIndex
-
    id:control
    width: 400
    height: 300
    implicitWidth: width
    implicitHeight: height
-
    QtObject{
        id:d
        property bool flag: true
    }
-
    MouseArea{
        anchors.fill: parent
        preventStealing: true
@ -36,7 +32,6 @@ Item{
                timer.restart()
            }
    }
-
    Timer{
        id:timer
        interval: 250
@ -44,7 +39,6 @@ Item{
            d.flag = true
        }
    }
-
    SwipeView {
        id:swipe
        clip: true
@ -52,7 +46,6 @@ Item{
        orientation:control.vertical ? Qt.Vertical : Qt.Horizontal
        anchors.fill: parent
    }
-
    Button{
        id:btn_start
        height: vertical ? 20 : 40
@ -82,7 +75,6 @@ Item{
            swipe.currentIndex = Math.max(swipe.currentIndex - 1, 0)
        }
    }
-
    Button{
        id:btn_end
        height: vertical ? 20 : 40
@ -112,6 +104,4 @@ Item{
            swipe.currentIndex = Math.min(swipe.currentIndex + 1,swipe.count-1)
        }
    }
-
 }
-
--- a/src/imports/FluentUI/Controls/FluFocusRectangle.qml
+++ b/src/imports/FluentUI/Controls/FluFocusRectangle.qml
@ -3,9 +3,7 @@ import QtQuick.Controls
 import FluentUI

 Item {
-
    property int radius: 4
-
    id:root
    anchors.fill: parent
    anchors.margins: -3
@ -19,5 +17,4 @@ Item {
        border.color: FluTheme.dark ? Qt.rgba(1,1,1,1) : Qt.rgba(0,0,0,1)
        z: 65535
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluIcon.qml
+++ b/src/imports/FluentUI/Controls/FluIcon.qml
@ -3,16 +3,14 @@ import QtQuick.Controls
 import FluentUI

 Text {
-
    property int iconSource
    property int iconSize: 20
    property color iconColor: FluTheme.dark ? "#FFFFFF" : "#000000"
-
    id:text_icon
    font.family: "Segoe Fluent Icons"
    font.pixelSize: iconSize
    horizontalAlignment: Text.AlignHCenter
    verticalAlignment: Text.AlignVCenter
    color: iconColor
-    text: (String.fromCharCode(iconSource).toString(16));
+    text: (String.fromCharCode(iconSource).toString(16))
 }
--- a/src/imports/FluentUI/Controls/FluIconButton.qml
+++ b/src/imports/FluentUI/Controls/FluIconButton.qml
@ -4,7 +4,6 @@ import QtQuick.Controls.Basic
 import FluentUI

 Button {
-
    property int iconSize: 20
    property int iconSource
    property bool disabled: false
@ -35,7 +34,6 @@ Button {
            return Qt.rgba(0,0,0,1)
        }
    }
-
    id:control
    width: 30
    height: 30
--- a/src/imports/FluentUI/Controls/FluInfoBar.qml
+++ b/src/imports/FluentUI/Controls/FluInfoBar.qml
@ -3,21 +3,17 @@ import QtQuick.Controls
 import FluentUI

 FluObject {
-    id:infoBar
-
    property var root;
-    property int layoutY: 75;
-
+    property int layoutY: 75
+    id:control
    FluObject{
        id:mcontrol
-
        property string const_success: "success";
        property string const_info:    "info";
        property string const_warning: "warning";
        property string const_error:   "error";
        property int maxWidth: 300;
        property var screenLayout: null;
-
        function create(type,text,duration,moremsg){
            if(screenLayout){
                var last = screenLayout.getLastloader();
@ -26,7 +22,6 @@ FluObject {
                    return;
                }
            }
-
            initScreenLayout();
            contentComponent.createObject(screenLayout,{
                                              type:type,
@ -35,22 +30,19 @@ FluObject {
                                              moremsg:moremsg,
                                          });
        }
-
        function createCustom(itemcomponent,duration){
            initScreenLayout();
            if(itemcomponent){
                contentComponent.createObject(screenLayout,{itemcomponent:itemcomponent,duration:duration});
            }
        }
-
        function initScreenLayout(){
            if(screenLayout == null){
                screenLayout = screenlayoutComponent.createObject(root);
-                screenLayout.y = infoBar.layoutY;
+                screenLayout.y = control.layoutY;
                screenLayout.z = 100000;
            }
        }
-
        Component{
            id:screenlayoutComponent
            Column{
@ -59,9 +51,7 @@ FluObject {
                move: Transition {
                    NumberAnimation { properties: "y"; easing.type: Easing.OutBack; duration: 300 }
                }
-
                onChildrenChanged: if(children.length === 0)  destroy();
-
                function getLastloader(){
                    if(children.length > 0){
                        return children[children.length - 1];
@ -70,7 +60,6 @@ FluObject {
                }
            }
        }
-
        Component{
            id:contentComponent
            Item{
@ -80,45 +69,35 @@ FluObject {
                property string type
                property string text
                property string moremsg
-
                width:  parent.width;
                height: loader.height;
-
                function close(){
                    content.destroy();
                }
-
                function restart(){
                    delayTimer.restart();
                }
-
                Timer {
                    id:delayTimer
                    interval: duration; running: true; repeat: true
                    onTriggered: content.close();
                }
-
                Loader{
                    id:loader;
                    x:(parent.width - width) / 2;
                    property var _super: content;
-
                    scale: item ? 1 : 0;
                    asynchronous: true
-
                    Behavior on scale {
                        NumberAnimation {
                            easing.type: Easing.OutBack;
                            duration: 100
                        }
                    }
-
                    sourceComponent:itemcomponent ? itemcomponent : mcontrol.fluent_sytle;
                }
-
            }
        }
-
        property Component fluent_sytle:  Rectangle{
            width:  rowlayout.width  + (_super.moremsg ? 25 : 80);
            height: rowlayout.height + 20;
@ -208,26 +187,19 @@ FluObject {
            }
        }
    }
-
    function showSuccess(text,duration=1000,moremsg){
        mcontrol.create(mcontrol.const_success,text,duration,moremsg ? moremsg : "");
    }
-
    function showInfo(text,duration=1000,moremsg){
        mcontrol.create(mcontrol.const_info,text,duration,moremsg ? moremsg : "");
    }
-
    function showWarning(text,duration=1000,moremsg){
        mcontrol.create(mcontrol.const_warning,text,duration,moremsg ? moremsg : "");
    }
-
    function showError(text,duration=1000,moremsg){
        mcontrol.create(mcontrol.const_error,text,duration,moremsg ? moremsg : "");
    }
-
    function showCustom(itemcomponent,duration=1000){
        mcontrol.createCustom(itemcomponent,duration);
    }
-
-
 }
--- a/src/imports/FluentUI/Controls/FluItem.qml
+++ b/src/imports/FluentUI/Controls/FluItem.qml
@ -3,29 +3,24 @@ import QtQuick.Controls
 import Qt5Compat.GraphicalEffects

 Item{
-    id:control
    property var radius:[0,0,0,0]
    default property alias contentItem: container.data
-
+    id:control
    Item{
        id:container
        width: control.width
        height: control.height
        opacity: 0
    }
-
    onWidthChanged: {
        canvas.requestPaint()
    }
-
    onHeightChanged: {
        canvas.requestPaint()
    }
-
    onRadiusChanged: {
        canvas.requestPaint()
    }
-
    Canvas {
        id: canvas
        anchors.fill: parent
@ -55,11 +50,9 @@ Item{
            ctx.restore();
        }
    }
-
    OpacityMask {
        anchors.fill: container
        source: container
        maskSource: canvas
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluMediaPlayer.qml
+++ b/src/imports/FluentUI/Controls/FluMediaPlayer.qml
@ -4,17 +4,14 @@ import QtMultimedia
 import FluentUI

 Rectangle {
-
    property url source
    property bool showControl: false
    property real volume: 30
-
    id:control
    width: 480
    height: 270
    color: FluColors.Black
    clip: true
-
    MouseArea{
        anchors.fill: parent
        preventStealing: true
@ -22,7 +19,6 @@ Rectangle {
            showControl = !showControl
        }
    }
-
    MediaPlayer {
        id: mediaplayer
        property bool autoSeek:true
@ -31,9 +27,9 @@ Rectangle {
        audioOutput: AudioOutput{
            id:audio_output
        }
-        onErrorChanged:
+        onErrorStringChanged:
            (error)=> {
-                console.debug(error)
+                console.debug(errorString)
            }
        onPositionChanged: {
            if(autoSeek){
@ -49,16 +45,13 @@ Rectangle {
                }
            }
    }
-
    onSourceChanged: {
        slider.seek(0)
    }
-
    VideoOutput {
        id:video_output
        anchors.fill: parent
    }
-
    Item{
        height: 100
        y:showControl ? control.height - 110 : control.height
@ -110,7 +103,6 @@ Rectangle {
                mediaplayer.position = val*mediaplayer.duration/slider.maxValue
            }
        }
-
        FluText{
            id:start_time
            anchors{
@ -120,7 +112,6 @@ Rectangle {
            }
            text: formatDuration(slider.value*mediaplayer.duration/slider.maxValue)
        }
-
        FluText{
            id:end_time
            anchors{
@ -130,7 +121,6 @@ Rectangle {
            }
            text: formatDuration(mediaplayer.duration)
        }
-
        Row{
            spacing: 10
            anchors{
@ -164,7 +154,6 @@ Rectangle {
                }
            }
        }
-
        FluIconButton{
            id:btn_volume
            iconSize: 17
@ -179,7 +168,6 @@ Rectangle {
                audio_output.muted = !audio_output.muted
            }
        }
-
        FluSlider{
            id:slider_volume
            size: 80
@ -195,7 +183,6 @@ Rectangle {
            }
        }
    }
-
    function formatDuration(duration) {
        const seconds = Math.floor(duration / 1000);
        const hours = Math.floor(seconds / 3600);
@ -203,18 +190,13 @@ Rectangle {
        const remainingSeconds = seconds % 60;
        return `${pad(hours)}:${pad(minutes)}:${pad(remainingSeconds)}`;
    }
-
    function pad(value) {
        return value.toString().padStart(2, '0');
    }
-
    function pause(){
        mediaplayer.pause()
    }
-
    function play(){
        mediaplayer.play()
    }
-
 }
-
--- a/src/imports/FluentUI/Controls/FluMenu.qml
+++ b/src/imports/FluentUI/Controls/FluMenu.qml
@ -4,7 +4,6 @@ import QtQuick.Controls
 import FluentUI

 Menu {
-
    default property alias content: container.data
    property bool enableAnimation: true
    id: popup
@ -21,7 +20,6 @@ Menu {
            duration: enableAnimation ? 83 : 0
        }
    }
-
    exit:Transition {
        NumberAnimation {
            property: "opacity"
@ -30,7 +28,6 @@ Menu {
            duration: enableAnimation ? 83 : 0
        }
    }
-
    background:Item{
        FluShadow{
            radius: 5
@ -56,9 +53,10 @@ Menu {
            }
        }
    }
-
    function getContainerHeight(){
        return container.height
    }
-
+    function getContainerCount(){
+        return container.children.length
+    }
 }
--- a/src/imports/FluentUI/Controls/FluMenuItem.qml
+++ b/src/imports/FluentUI/Controls/FluMenuItem.qml
@ -3,11 +3,9 @@ import QtQuick.Controls
 import FluentUI

 Item {
-
    property string text: "MenuItem"
    property var onClickFunc
    signal clicked
-
    id:control
    width: {
        if(control.parent){
@ -16,7 +14,6 @@ Item {
        return 140
    }
    height: 32
-
    Rectangle{
        anchors.centerIn: parent
        width: control.width-40
@ -35,12 +32,10 @@ Item {
                return Qt.rgba(0,0,0,0)
            }
        }
-
        FluText{
            text: control.text
            anchors.centerIn: parent
        }
-
        MouseArea{
            id:mouse_area
            hoverEnabled: true
--- a/src/imports/FluentUI/Controls/FluMultilineTextBox.qml
+++ b/src/imports/FluentUI/Controls/FluMultilineTextBox.qml
@ -4,14 +4,12 @@ import QtQuick.Controls.Basic
 import FluentUI

 TextArea{
-
    property bool disabled: false
    property color normalColor: FluTheme.dark ?  Qt.rgba(255/255,255/255,255/255,1) : Qt.rgba(27/255,27/255,27/255,1)
    property color disableColor: FluTheme.dark ? Qt.rgba(131/255,131/255,131/255,1) : Qt.rgba(160/255,160/255,160/255,1)
    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)
-
    id:control
    width: 300
    enabled: !disabled
@ -44,5 +42,4 @@ TextArea{
        id:menu
        inputItem: control
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluNavigationView.qml
+++ b/src/imports/FluentUI/Controls/FluNavigationView.qml
@ -6,14 +6,12 @@ import QtQuick.Layouts
 import FluentUI

 Item {
-
    enum DisplayMode {
        Open,
        Compact,
        Minimal,
        Auto
    }
-
    property url logo
    property string title: ""
    property FluObject items
@ -21,9 +19,13 @@ Item {
    property int displayMode: FluNavigationView.Auto
    property Component autoSuggestBox
    property Component actionItem
-
+    property int topPadding: 0
+    enum PageModeFlag{
+        Standard = 0,
+        SingleTop = 1,
+        SingleTask = 2
+    }
    id:control
-
    QtObject{
        id:d
        property bool enableStack: true
@ -46,11 +48,9 @@ Item {
        property bool isCompactAndPanel: d.displayMode === FluNavigationView.Compact && d.enableNavigationPanel
        property bool isCompactAndNotPanel:d.displayMode === FluNavigationView.Compact && !d.enableNavigationPanel
        property bool isMinimalAndPanel: d.displayMode === FluNavigationView.Minimal && d.enableNavigationPanel
-
        onIsCompactAndNotPanelChanged: {
            collapseAll()
        }
-
        onDisplayModeChanged: {
            if(d.displayMode === FluNavigationView.Compact){
                collapseAll()
@ -61,7 +61,6 @@ Item {
                timer_anim_x_enable.restart()
            }
        }
-
        function handleItems(){
            var idx = 0
            var data = []
@ -97,14 +96,12 @@ Item {
            return data
        }
    }
-
    Component{
        id:com_panel_item_empty
        Item{
            visible: false
        }
    }
-
    Component{
        id:com_panel_item_separatorr
        FluDivider{
@ -124,7 +121,6 @@ Item {
            }
        }
    }
-
    Component{
        id:com_panel_item_header
        Item{
@ -153,7 +149,6 @@ Item {
            }
        }
    }
-
    Component{
        id:com_panel_item_expander
        Item{
@ -259,7 +254,6 @@ Item {
                        iconSize: 15
                    }
                }
-
                Item{
                    id:item_icon
                    width: 30
@ -308,7 +302,6 @@ Item {
            }
        }
    }
-
    Component{
        id:com_panel_item
        Item{
@ -412,7 +405,6 @@ Item {
                        iconSize: 15
                    }
                }
-
                Item{
                    id:item_icon
                    width: 30
@ -432,7 +424,6 @@ Item {
                        }
                    }
                }
-
                FluText{
                    id:item_title
                    text:model.title
@ -462,17 +453,20 @@ Item {
            }
        }
    }
-
-
    Item {
        id:nav_app_bar
        width: parent.width
        height: 40
+        anchors{
+            top: parent.top
+            topMargin: control.topPadding
+        }
        z:999
        RowLayout{
            height:parent.height
            spacing: 0
            FluIconButton{
+                id:btn_back
                iconSource: FluentIcons.ChromeBack
                Layout.leftMargin: 5
                Layout.preferredWidth: 30
@ -535,7 +529,6 @@ Item {
                font: FluTextStyle.Body
            }
        }
-
        Item{
            anchors.right: parent.right
            height: parent.height
@ -552,7 +545,6 @@ Item {
            }
        }
    }
-
    Item{
        anchors{
            left: d.isMinimal || d.isCompactAndPanel  ? parent.left : layout_list.right
@ -591,7 +583,6 @@ Item {
            replaceExit : Transition{}
        }
    }
-
    MouseArea{
        anchors.fill: parent
        visible: d.isMinimalAndPanel||d.isCompactAndPanel
@ -599,7 +590,6 @@ Item {
            d.enableNavigationPanel = false
        }
    }
-
    Rectangle{
        id:layout_list
        width: {
@ -633,16 +623,9 @@ Item {
            if(d.isMinimal || d.isCompactAndPanel){
                return FluTheme.dark ? Qt.rgba(61/255,61/255,61/255,1) : Qt.rgba(243/255,243/255,243/255,1)
            }
-            if(Window.window.active){
-                return FluTheme.dark ? Qt.rgba(26/255,34/255,41/255,1) : Qt.rgba(238/255,244/255,249/255,1)
-            }
-            return FluTheme.dark ? Qt.rgba(32/255,32/255,32/255,1) : Qt.rgba(243/255,243/255,243/255,1)
-        }
-        Behavior on color{
-            ColorAnimation {
-                duration: 300
-            }
+            return "#00000000"
        }
+
        x: {
            if(d.displayMode !== FluNavigationView.Minimal)
                return 0
@ -652,7 +635,7 @@ Item {
            id:layout_header
            width: layout_list.width
            clip: true
-            y:nav_app_bar.height
+            y:nav_app_bar.height+control.topPadding
            height: autoSuggestBox ? 38 : 0
            Loader{
                id:loader_auto_suggest_box
@ -671,7 +654,6 @@ Item {
                    }
                }
            }
-
            FluIconButton{
                visible:opacity
                opacity:d.isCompactAndNotPanel
@ -699,7 +681,6 @@ Item {
                }
            }
        }
-
        ListView{
            id:nav_list
            clip: true
@ -806,7 +787,6 @@ Item {
            }
        }
    }
-
    Popup{
        property var childModel
        id:control_popup
@ -872,7 +852,6 @@ Item {
            control_popup.open()
        }
    }
-
    Timer{
        id:timer_anim_x_enable
        interval: 150
@ -880,7 +859,6 @@ Item {
            anim_layout_list_x.enabled = true
        }
    }
-
    function collapseAll(){
        for(var i=0;i<nav_list.model.length;i++){
            var item = nav_list.model[i]
@ -889,24 +867,44 @@ Item {
            }
        }
    }
-
    function setCurrentIndex(index){
        nav_list.currentIndex = index

    }
-
    function getItems(){
        return nav_list.model
    }
-
    function push(url){
-        nav_swipe.push(url)
+        if (nav_swipe.depth>0)
+        {
+            let page = nav_swipe.find(function(item) {
+                return item.url === url;
+            })
+            if (page)
+            {
+                switch(page.pageMode)
+                {
+                    case FluNavigationView.SingleTask:
+                        while(nav_swipe.currentItem !== page)
+                        {
+                            nav_swipe.pop()
+                            d.stackItems.pop()
+                        }
+                        return
+                    case FluNavigationView.SingleTop:
+                        if (nav_swipe.currentItem.url === url)
+                            return
+                        break
+                    case FluNavigationView.Standard:
+                    default:
+                }
+            }
+        }
+        nav_swipe.push(url,{url:url})
    }
-
    function getCurrentIndex(){
        return nav_list.currentIndex
    }
-
    function startPageByItem(data){
        var items = getItems();
        for(var i=0;i<items.length;i++){
@ -923,5 +921,10 @@ Item {
            }
        }
    }
-
+    function backButton(){
+        return btn_back
+    }
+    function navButton(){
+        return btn_nav
+    }
 }
--- a/src/imports/FluentUI/Controls/FluNavigationView2.qml
+++ b/src/imports/FluentUI/Controls/FluNavigationView2.qml
@ -0,0 +1,57 @@
+import QtQuick
+import QtQuick.Window
+import QtQuick.Controls
+import QtQuick.Controls.Basic
+import QtQuick.Layouts
+import FluentUI
+
+Item {
+
+    property url logo
+    property string title: ""
+    property FluObject items
+    property FluObject footerItems
+    property int displayMode: FluNavigationView.Auto
+    property Component autoSuggestBox
+    property Component actionItem
+    id:control
+    Item {
+        id:nav_app_bar
+        width: parent.width
+        height: 40
+        RowLayout{
+            height:parent.height
+            spacing: 0
+            FluIconButton{
+                iconSource: FluentIcons.ChromeBack
+                Layout.leftMargin: 5
+                Layout.preferredWidth: 30
+                Layout.preferredHeight: 30
+                Layout.alignment: Qt.AlignVCenter
+                iconSize: 15
+            }
+            FluIconButton{
+                id:btn_nav
+                iconSource: FluentIcons.GlobalNavButton
+                iconSize: 15
+                Layout.preferredWidth: 30
+                Layout.preferredHeight: 30
+                Layout.alignment: Qt.AlignVCenter
+            }
+            Image{
+                Layout.preferredHeight: 20
+                Layout.preferredWidth: 20
+                source: control.logo
+                Layout.leftMargin: 12
+                sourceSize: Qt.size(40,40)
+                Layout.alignment: Qt.AlignVCenter
+            }
+            FluText{
+                Layout.alignment: Qt.AlignVCenter
+                text:control.title
+                Layout.leftMargin: 12
+                font: FluTextStyle.Body
+            }
+        }
+    }
+}
--- a/src/imports/FluentUI/Controls/FluObject.qml
+++ b/src/imports/FluentUI/Controls/FluObject.qml
@ -3,7 +3,6 @@ import QtQuick.Controls
 import FluentUI

 QtObject {
-    id:flu_object;
-
    default property list<QtObject> children;
+    id:flu_object;
 }
--- a/src/imports/FluentUI/Controls/FluPagination.qml
+++ b/src/imports/FluentUI/Controls/FluPagination.qml
@ -4,7 +4,6 @@ import QtQuick.Layouts
 import FluentUI

 Item {
-    id: control
    signal requestPage(int page,int count)
    property string previousText: "<上一页"
    property string nextText: "下一页>"
@ -14,18 +13,14 @@ Item {
    property int __itemPerPage: 10
    property int pageButtonCount: 5
    property int __pageButtonHalf: Math.floor(pageButtonCount/2)+1
-
-
+    id: control
    implicitHeight: 40
    implicitWidth: content.width
-
    Row{
        id: content
        height: control.height
-        spacing: 25
+        spacing: 10
        padding: 10
-
-
        FluToggleButton{
            visible: control.pageCount>1
            disabled: control.pageCurrent<=1
@ -34,7 +29,6 @@ Item {
                control.calcNewPage(control.pageCurrent-1);
            }
        }
-
        Row{
            spacing: 5
            FluToggleButton{
@ -94,7 +88,6 @@ Item {
            }
        }
    }
-
    function calcNewPage(page)
    {
        if(!page)
@ -105,6 +98,4 @@ Item {
        control.pageCurrent=page_num
        control.requestPage(page_num,control.__itemPerPage)
    }
-
-
 }
--- a/src/imports/FluentUI/Controls/FluPasswordBox.qml
+++ b/src/imports/FluentUI/Controls/FluPasswordBox.qml
@ -4,7 +4,6 @@ import QtQuick.Controls.Basic
 import FluentUI

 TextField{
-
    property bool disabled: false
    property int iconSource: 0
    property color normalColor: FluTheme.dark ?  Qt.rgba(255/255,255/255,255/255,1) : Qt.rgba(27/255,27/255,27/255,1)
@ -12,7 +11,6 @@ TextField{
    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)
-
    id:control
    width: 300
    enabled: !disabled
@ -74,6 +72,4 @@ TextField{
        id:menu
        inputItem: control
    }
-
 }
-
--- a/src/imports/FluentUI/Controls/FluPivot.qml
+++ b/src/imports/FluentUI/Controls/FluPivot.qml
@ -3,27 +3,22 @@ import QtQuick.Controls
 import FluentUI

 Item {
-
    default property alias content: d.children
    property alias currentIndex: nav_list.currentIndex
    property color normalColor: FluTheme.dark ? FluColors.Grey120 : FluColors.Grey120
    property color hoverColor: FluTheme.dark ? FluColors.Grey10 : FluColors.Black
-
    id:control
    width: 400
    height: 300
    implicitHeight: height
    implicitWidth: width
-
    MouseArea{
        anchors.fill: parent
        preventStealing: true
    }
-
    FluObject{
        id:d
    }
-
    ListView{
        id:nav_list
        height: 40
@ -77,7 +72,6 @@ Item {
            }
        }
    }
-
    Item{
        id:container
        anchors{
@ -87,7 +81,6 @@ Item {
            right: parent.right
            bottom: parent.bottom
        }
-
        Repeater{
            model:d.children
            Loader{
@ -98,6 +91,4 @@ Item {
            }
        }
    }
-
-
 }
--- a/src/imports/FluentUI/Controls/FluProgressBar.qml
+++ b/src/imports/FluentUI/Controls/FluProgressBar.qml
@ -3,17 +3,14 @@ import QtQuick.Controls
 import FluentUI

 FluRectangle {
-
    property real progress: 0.5
    property bool indeterminate: true
-
    id: control
    width: 150
    height: 5
    radius: [3,3,3,3]
    clip: true
    color:  FluTheme.dark ? Qt.rgba(99/255,99/255,99/255,1) : Qt.rgba(214/255,214/255,214/255,1)
-
    Component.onCompleted: {
        if(indeterminate){
            bar.x = -control.width*0.5
@ -23,14 +20,12 @@ FluRectangle {
            bar.x = 0
        }
    }
-
    Rectangle{
        id:bar
        radius: 3
        width: control.width*progress
        height:  control.height
        color:FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
-
        Behavior on x{
            id:behavior
            enabled: false
--- a/src/imports/FluentUI/Controls/FluProgressRing.qml
+++ b/src/imports/FluentUI/Controls/FluProgressRing.qml
@ -3,13 +3,11 @@ import QtQuick.Controls
 import FluentUI

 Rectangle {
-
    property real linWidth : width/8
    property real progress: 0.25
    property bool indeterminate: true
    readonly property real radius2 : radius - linWidth/2
    property color primaryColor : FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
-
    id: control
    width: 44
    height: 44
@ -17,25 +15,21 @@ Rectangle {
    border.width: linWidth
    color: "#00000000"
    border.color: FluTheme.dark ? Qt.rgba(99/255,99/255,99/255,1) : Qt.rgba(214/255,214/255,214/255,1)
-
    onProgressChanged: {
        canvas.requestPaint()
    }
-
-    Connections{
-        target: FluTheme
-        function onDarkChanged(){
-            canvas.requestPaint()
-        }
-    }
-
    Component.onCompleted: {
        if(indeterminate){
            behavior.enabled = true
            control.rotation = 360
        }
    }
-
+    Connections{
+        target: FluTheme
+        function onDarkChanged(){
+            canvas.requestPaint()
+        }
+    }
    Behavior on rotation{
        id:behavior
        enabled: false
@ -53,7 +47,6 @@ Rectangle {
            }
        }
    }
-
    Canvas {
        id:canvas
        anchors.fill: parent
@ -74,6 +67,4 @@ Rectangle {
            ctx.restore();
        }
    }
-
-
 }
--- a/src/imports/FluentUI/Controls/FluRadioButton.qml
+++ b/src/imports/FluentUI/Controls/FluRadioButton.qml
@ -5,10 +5,8 @@ import QtQuick.Layouts
 import FluentUI

 Button {
-
    property bool selected: false
    property bool disabled: false
-
    id:control
    enabled: !disabled
    focusPolicy:Qt.TabFocus
@ -102,4 +100,3 @@ Button {
        }
    }
 }
-
--- a/src/imports/FluentUI/Controls/FluRatingControl.qml
+++ b/src/imports/FluentUI/Controls/FluRatingControl.qml
@ -3,22 +3,18 @@ import QtQuick.Controls
 import FluentUI

 Item {
-
    property int number: 5
    property int spacing: 4
    property int size: 18
    property int value:0
-
    id:control
    implicitWidth: container.width
    implicitHeight: container.height
-
    QtObject{
        id:d
        property int mouseValue: 0
        property int itemSize: control.size+spacing*2
    }
-
    Row{
        id:container
        spacing: 0
@ -42,7 +38,6 @@ Item {
            }
        }
    }
-
    MouseArea{
        anchors.fill: container
        hoverEnabled: true
@ -56,5 +51,4 @@ Item {
            control.value = Number(mouse.x / d.itemSize)+1
        }
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluRectangle.qml
+++ b/src/imports/FluentUI/Controls/FluRectangle.qml
@ -4,12 +4,10 @@ import Qt5Compat.GraphicalEffects
 import FluentUI

 Item{
-
    property var radius:[0,0,0,0]
    property color color : "#FFFFFF"
    property bool shadow: true
    default property alias contentItem: container.data
-
    id:control
    FluShadow{
        anchors.fill: container
@ -21,7 +19,6 @@ Item{
            return false
        }
    }
-
    Rectangle{
        id:container
        width: control.width
@ -29,7 +26,6 @@ Item{
        opacity: 0
        color:control.color
    }
-
    Canvas {
        id: canvas
        anchors.fill: parent
@ -59,11 +55,9 @@ Item{
            ctx.restore();
        }
    }
-
    OpacityMask {
        anchors.fill: container
        source: container
        maskSource: canvas
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluScrollBar.qml
+++ b/src/imports/FluentUI/Controls/FluScrollBar.qml
@ -1,20 +1,17 @@
 import QtQuick
-import QtQuick.Controls
+import QtQuick.Controls.Basic
 import FluentUI

 ScrollBar {
-
    property color handleNormalColor: Qt.rgba(134/255,134/255,134/255,1)
    property color handleHoverColor: Qt.lighter(handleNormalColor)
    property color handlePressColor: Qt.darker(handleNormalColor)
    property bool expand: false
-
    id: control
    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
                            implicitContentWidth + leftPadding + rightPadding)
    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
                             implicitContentHeight + topPadding + bottomPadding)
-
    visible: control.policy !== ScrollBar.AlwaysOff
    minimumSize: 0.3
    topPadding:{
@ -128,7 +125,6 @@ ScrollBar {
            duration: 150
        }
    }
-
    FluIconButton{
        id:btn_top
        iconSource: FluentIcons.CaretSolidUp
@ -190,5 +186,4 @@ ScrollBar {
            increase()
        }
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluScrollablePage.qml
+++ b/src/imports/FluentUI/Controls/FluScrollablePage.qml
@ -5,7 +5,6 @@ import QtQuick.Controls
 import FluentUI

 Item {
-
    property alias title: text_title.text
    default property alias content: container.data
    property int spacing : 0
@ -13,9 +12,9 @@ Item {
    property int topPadding: 0
    property int rightPadding: 10
    property int bottomPadding: 10
-
+    property int pageMode: FluNavigationView.Standard
+    property string url: ''
    id:control
-
    FluText{
        id:text_title
        font: FluTextStyle.Title
@ -31,7 +30,6 @@ Item {
            rightMargin: control.rightPadding
        }
    }
-
    Flickable{
        id:flickview
        clip: true
--- a/src/imports/FluentUI/Controls/FluShadow.qml
+++ b/src/imports/FluentUI/Controls/FluShadow.qml
@ -6,63 +6,61 @@ Item {

    property color color: FluTheme.dark ? "#FFFFFF" : "#999999"
    property int radius: 4
-
-    id:root
+    id:control
    anchors.fill: parent
    anchors.margins: -4
-
    Rectangle{
-        width: root.width
-        height: root.height
+        width: control.width
+        height: control.height
        anchors.centerIn: parent
        color: "#00000000"
        opacity: 0.02
        border.width: 1
-        radius: root.radius
-        border.color: root.color
+        radius: control.radius
+        border.color: control.color
    }

    Rectangle{
-        width: root.width - 2
-        height: root.height - 2
+        width: control.width - 2
+        height: control.height - 2
        anchors.centerIn: parent
        color: "#00000000"
        opacity: 0.04
        border.width: 1
-        radius: root.radius
-        border.color: root.color
+        radius: control.radius
+        border.color: control.color
    }
    Rectangle{
-        width: root.width - 4
-        height: root.height - 4
+        width: control.width - 4
+        height: control.height - 4
        anchors.centerIn: parent
        color: "#00000000"
        opacity: 0.06
        border.width: 1
-        radius: root.radius
-        border.color: root.color
+        radius: control.radius
+        border.color: control.color
    }

    Rectangle{
-        width: root.width - 6
-        height: root.height - 6
+        width: control.width - 6
+        height: control.height - 6
        anchors.centerIn: parent
        color: "#00000000"
        opacity: 0.08
        border.width: 1
-        radius: root.radius
-        border.color: root.color
+        radius: control.radius
+        border.color: control.color
    }

    Rectangle{
-        width: root.width - 8
-        height: root.height - 8
+        width: control.width - 8
+        height: control.height - 8
        anchors.centerIn: parent
        opacity: 0.1
-        radius: root.radius
+        radius: control.radius
        color: "#00000000"
        border.width: 1
-        border.color: root.color
+        border.color: control.color
    }

 }
--- a/src/imports/FluentUI/Controls/FluSlider.qml
+++ b/src/imports/FluentUI/Controls/FluSlider.qml
@ -4,7 +4,6 @@ import Qt5Compat.GraphicalEffects
 import FluentUI

 Item{
-
    property int size: 180
    property int dotSize: 24
    property int value: 50
@ -14,16 +13,13 @@ Item{
    property var onLineClickFunc
    signal pressed
    signal released
-
    id:root
    height: control.height
    width: control.width
    rotation: vertical ? 180 : 0
-
    Component.onCompleted: {
        seek(value)
    }
-
    MouseArea{
        id:mouse_line
        anchors.centerIn: control
@ -45,7 +41,6 @@ Item{
                }
            }
    }
-
    Rectangle {
        id: control
        width: vertical ? 4 :size
@ -61,7 +56,6 @@ Item{
            color:FluTheme.dark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
        }
    }
-
    Rectangle{
        id:dot
        width: dotSize
@ -109,20 +103,17 @@ Item{
                }
                root.pressed()
            }
-
            onReleased: {
                tool_tip.visible  =  false
                root.released()
            }
        }
-
        FluTooltip{
            id:tool_tip
            text:String(root.value)
            y: vertical ? 32 : -40
        }
    }
-
    function seek(val){
        if(vertical){
            dot.y =val/maxValue*control.height - dotSize/2
--- a/src/imports/FluentUI/Controls/FluStatusView.qml
+++ b/src/imports/FluentUI/Controls/FluStatusView.qml
@ -4,7 +4,6 @@ import QtQuick.Layouts
 import FluentUI

 Item{
-
    enum StatusMode  {
        Loading,
        Empty,
@ -14,13 +13,11 @@ Item{
    default property alias content: container.data
    property int statusMode: FluStatusView.Loading
    signal errorClicked
-
    Item{
        id:container
        anchors.fill: parent
        visible: statusMode === FluStatusView.Success
    }
-
    FluArea{
        paddings: 0
        border.width: 0
@ -43,7 +40,6 @@ Item{
            }
        }
    }
-
    FluArea{
        paddings: 0
        border.width: 0
@ -63,7 +59,6 @@ Item{
            }
        }
    }
-
    FluArea{
        paddings: 0
        border.width: 0
@ -90,8 +85,6 @@ Item{
            }
        }
    }
-
-
    function showSuccessView(){
        statusMode = FluStatusView.Success
    }
@ -104,5 +97,4 @@ Item{
    function showErrorView(){
        statusMode = FluStatusView.Error
    }
-
 }
--- a/src/imports/FluentUI/Controls/FluTabView.qml
+++ b/src/imports/FluentUI/Controls/FluTabView.qml
@ -4,25 +4,21 @@ import QtQuick.Layouts
 import FluentUI

 Item {
-
    enum TabWidthBehavior {
        Equal,
        SizeToContent,
        Compact
    }
-
    enum CloseButtonVisibility{
        Nerver,
        Always,
        OnHover
    }
-
    property int tabWidthBehavior : FluTabView.Equal
    property int closeButtonVisibility : FluTabView.Always
    property int itemWidth: 146
    property bool addButtonVisibility: true
    signal newPressed
-
    id:control
    implicitHeight: height
    implicitWidth: width
@ -31,7 +27,6 @@ Item {
            return parent
        return undefined
    }
-
    QtObject {
        id: d
        property int dragIndex: -1
@ -39,16 +34,13 @@ Item {
        property bool itemPress: false
        property int maxEqualWidth: 240
    }
-
    MouseArea{
        anchors.fill: parent
        preventStealing: true
    }
-
    ListModel{
        id:tab_model
    }
-
    FluIconButton{
        id:btn_new
        visible: addButtonVisibility
@ -61,7 +53,6 @@ Item {
            newPressed()
        }
    }
-
    ListView{
        id:tab_nav
        height: 34
@ -88,21 +79,16 @@ Item {
            policy: ScrollBar.AlwaysOff
        }
        delegate:  Item{
-
            width: item_layout.width
            height: item_container.height
            z: item_mouse_drag.pressed ? 1000 : 1
-
            Item{
                id:item_layout
                width: item_container.width
                height: item_container.height
-
                FluItem{
                    id:item_container
-
                    property real timestamp: new Date().getTime()
-
                    height: tab_nav.height
                    width: {
                        if(tabWidthBehavior === FluTabView.Equal){
@ -119,24 +105,20 @@ Item {
                    radius: [6,6,0,0]
                    Behavior on x { enabled: d.dragBehavior; NumberAnimation { duration: 200 } }
                    Behavior on y { enabled: d.dragBehavior; NumberAnimation { duration: 200 } }
-
                    MouseArea{
                        id:item_mouse_hove
                        anchors.fill: parent
                        hoverEnabled: true
                    }
-
                    MouseArea{
                        id:item_mouse_drag
                        anchors.fill: parent
                        drag.target: item_container
                        drag.axis: Drag.XAxis
-
                        onWheel: (wheel)=>{
                                     if (wheel.angleDelta.y > 0) scroll_nav.decrease()
                                     else scroll_nav.increase()
                                 }
-
                        onPressed: {
                            d.itemPress = true
                            item_container.timestamp = new Date().getTime();
@ -147,7 +129,6 @@ Item {
                            item_container.x = pos.x
                            item_container.y = pos.y
                        }
-
                        onReleased: {
                            d.itemPress = false
                            timer.stop()
@ -164,7 +145,6 @@ Item {
                            item_container.x = 0;
                            item_container.y = 0;
                        }
-
                        onPositionChanged: {
                            var pos = tab_nav.mapFromItem(item_container, 0, 0)
                            updatePosition(pos)
@ -211,7 +191,6 @@ Item {
                            }
                        }
                    }
-
                    Rectangle{
                        anchors.fill: parent
                        color: {
@ -234,7 +213,6 @@ Item {
                            }
                        }
                    }
-
                    RowLayout{
                        spacing: 0
                        height: parent.height
@ -271,7 +249,6 @@ Item {
                            }
                        }
                    }
-
                    FluIconButton{
                        id:item_btn_close
                        iconSource: FluentIcons.ChromeClose
@ -294,7 +271,6 @@ Item {
                            tab_model.remove(index)
                        }
                    }
-
                    FluDivider{
                        width: 1
                        height: 16
@ -307,8 +283,6 @@ Item {
            }
        }
    }
-
-
    Item{
        id:container
        anchors{
@ -317,7 +291,6 @@ Item {
            right: parent.right
            bottom: parent.bottom
        }
-
        Repeater{
            model:tab_model
            Loader{
@ -328,23 +301,17 @@ Item {
            }
        }
    }
-
-
    function createTab(icon,text,page,argument={}){
        return {icon:icon,text:text,page:page,argument:argument}
    }
-
    function appendTab(icon,text,page,argument){
        tab_model.append(createTab(icon,text,page,argument))
    }
-
    function setTabList(list){
        tab_model.clear()
        tab_model.append(list)
    }
-
    function count(){
        return tab_nav.count
    }
-
 }
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
zhuzihcu	3eeaae24db	update	2023-05-19 13:50:06 +08:00
zhuzihcu	e67e7e4d3b	update	2023-05-19 09:19:52 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	d5ca61c0f6	update	2023-05-19 08:03:37 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	15f90471dc	update	2023-05-19 07:57:23 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	2129301cd2	update	2023-05-18 23:33:31 +08:00
朱子楚	6366651453	update	2023-05-18 23:27:11 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	8480267127	update	2023-05-18 23:24:53 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	9adc63b3bc	update	2023-05-18 22:58:35 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	0003f8192e	update	2023-05-18 20:57:57 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	1491abc614	update	2023-05-18 20:32:53 +08:00
zhuzihcu	edd1ea90b9	update	2023-05-18 15:19:39 +08:00
zhuzihcu	4aba260eb5	update	2023-05-18 15:09:07 +08:00
zhuzihcu	8668db1587	update	2023-05-18 15:03:34 +08:00
zhuzihcu	56681cb5a3	update	2023-05-18 14:55:28 +08:00
zhuzihcu	ab68770d63	update	2023-05-18 09:40:07 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	594c0222a2	update	2023-05-17 22:51:33 +08:00
zhuzichu	2fb322536e	Merge pull request #113 from mentalfl0w/dev Fix the _systemDark don't get system color while app first boot.	2023-05-17 22:49:13 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	71d3af6d49	update	2023-05-17 22:46:02 +08:00
Mentalflow	323927c3ae	Fix the _systemDark don't get system color while app first boot.	2023-05-17 22:44:38 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	30c99c0907	update	2023-05-17 22:44:35 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	d488ca481c	update	2023-05-17 22:43:46 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	3232ae9a7c	Merge branch 'main' of https://github.com/zhuzichu520/FluentUI	2023-05-17 22:43:08 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	0da8d18467	update	2023-05-17 22:43:00 +08:00
朱子楚	8b531e4637	update	2023-05-17 22:26:16 +08:00
朱子楚	bd422f96cf	update	2023-05-17 22:19:46 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	155960c15b	update	2023-05-17 22:02:09 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	1601b64883	update	2023-05-17 21:27:00 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	5539c59233	update	2023-05-17 21:21:23 +08:00
zhuzichu	4b2cbb542e	Merge pull request #112 from mentalfl0w/dev Fix the blur background in T_Home.qml	2023-05-17 20:46:20 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	b36ceed119	update	2023-05-17 20:43:26 +08:00
Mentalflow	1129a935eb	Fix the blur background in T_Home.qml	2023-05-17 20:34:04 +08:00
朱子楚	1446fd8933	update	2023-05-17 20:20:29 +08:00
zhuzichu	4e4760e37f	Merge pull request #111 from mentalfl0w/dev Improve FluAcrylic.	2023-05-17 19:57:14 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	f365e08fb2	update	2023-05-17 19:52:33 +08:00
Mentalflow	c0b76e6282	Improve FluAcrylic.	2023-05-17 19:29:09 +08:00
zhuzihcu	ac0b0aaaa9	update	2023-05-17 18:24:11 +08:00
zhuzihcu	a89d36fd14	update	2023-05-17 18:15:15 +08:00
zhuzihcu	7d7cd4144c	update	2023-05-17 13:49:20 +08:00
zhuzihcu	68cf87dba9	update	2023-05-17 13:44:38 +08:00
zhuzichu	55e668e95e	Update README.md	2023-05-17 12:58:13 +08:00
zhuzihcu	e1889f7572	update	2023-05-17 12:56:35 +08:00
zhuzihcu	bcb862e316	update	2023-05-17 12:54:08 +08:00
zhuzihcu	b93f91a73f	update	2023-05-17 12:49:41 +08:00
zhuzihcu	09dd381bbc	update	2023-05-17 11:42:03 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	09fa471a10	update	2023-05-16 21:09:37 +08:00
zhuzihcu	fb48ed543b	update	2023-05-16 12:49:20 +08:00
zhuzichu	b8179f0df4	Update README.md	2023-05-16 09:47:50 +08:00
zhuzichu	1dd09ef676	Update README.md	2023-05-16 09:47:12 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	bc6041b5a4	update	2023-05-15 21:32:15 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	75193b216f	update	2023-05-15 21:14:37 +08:00
zhuzichu	c095008042	Merge pull request #105 from parker-int64/test_branch Test branch - Fixed the path of README_zh_CN.md	2023-05-15 18:00:26 +08:00
parker-int64	128bb94742	changed display text and recapture the screenshots	2023-05-15 17:48:09 +08:00
parker-int64	684cf47101	Fixed the wrong path.	2023-05-15 16:38:52 +08:00
zhuzichu	65f0dc2e55	Merge pull request #103 from parker-int64/test_branch Test branch: Add Eng to README.md	2023-05-15 16:32:21 +08:00
parker-int64	0c4ff01732	add some additional pics	2023-05-15 16:07:07 +08:00
parker-int64	48333a2bcc	move the original README to README_zh_CN, new README in Eng.	2023-05-15 16:06:43 +08:00
zhuzichu	3e5d64f086	Merge pull request #100 from mentalfl0w/dev Improve FluAcrylic.	2023-05-15 00:08:00 +08:00
Mentalflow	63354f2d8d	Improve FluAcrylic.	2023-05-14 22:58:31 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	bf5a4ef4f5	update	2023-05-14 20:28:41 +08:00
zhuzichu	ea04380bd5	Merge pull request #99 from mentalfl0w/dev Add PageMode for FluNavigationView.	2023-05-14 19:26:03 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	0c7fa3e5bb	update	2023-05-14 19:06:10 +08:00
Mentalflow	57fa166da3	Add PageMode for FluNavigationView.	2023-05-14 18:31:17 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	87a1e4744c	update	2023-05-14 16:54:13 +08:00
zhuzichu	308e2407c3	Merge pull request #98 from mentalfl0w/dev Use Qt6 compatible blur effect.	2023-05-14 14:17:20 +08:00
Mentalflow	74afdeaf49	Use Qt6 compatible blur effect.	2023-05-14 13:05:06 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	84e863f664	update	2023-05-13 17:56:26 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	8475ec7f03	update	2023-05-13 17:30:07 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	fdcf2de3ee	update	2023-05-13 00:20:12 +08:00
$朱子楚\zhuzi$ 朱子楚\zhuzi	a648b683d9	update	2023-05-12 22:22:55 +08:00