diff --git a/FluentUI/Controls/InfoBadge.qml b/FluentUI/Controls/InfoBadge.qml index 7c32172..fc2a0b0 100644 --- a/FluentUI/Controls/InfoBadge.qml +++ b/FluentUI/Controls/InfoBadge.qml @@ -12,13 +12,14 @@ Item{ property var dotSize: Qt.size(6,6) property bool showZero: false property int count: 0 + property color tcolor: Colors.white property color color: control.accentColor.defaultBrushFor(control.FluentUI.dark) implicitHeight: dot ? rect_dot.height : label_count.height implicitWidth: dot ? rect_dot.width : label_count.width Label { id: label_count font: Typography.caption - color: Colors.white + color: tcolor leftPadding: 2 rightPadding: 2 topPadding: 0 diff --git a/FluentUI/Controls/TreeDataGrid.qml b/FluentUI/Controls/TreeDataGrid.qml index 63b074d..303481f 100644 --- a/FluentUI/Controls/TreeDataGrid.qml +++ b/FluentUI/Controls/TreeDataGrid.qml @@ -47,6 +47,7 @@ Item{ property alias selectionModel: selected_items signal rowClicked(var model) signal rowRightClicked(var model) + property Component cellBackground: Component{ Rectangle{ color: { diff --git a/Gallery/CMakeLists.txt b/Gallery/CMakeLists.txt index 5d65d36..77669e0 100644 --- a/Gallery/CMakeLists.txt +++ b/Gallery/CMakeLists.txt @@ -165,6 +165,68 @@ set(RESOURCES_FILES res/image/icons/gc.png res/image/icons/mime.png res/image/antlogo.png + res/image/components/rect.png + res/image/components/down.png + res/image/icons/point.png + res/image/icons/circle.png + res/image/icons/curve.png + res/image/icons/ellipse.png + res/image/icons/free_area.png + res/image/icons/free_line.png + res/image/icons/polygon.png + res/image/icons/triangle.png + res/image/icons/edit.png + res/image/icons/delete.png + res/image/components/edit.png + res/image/img/map.png + res/image/avatars/300-1.jpg + res/image/img/lg.png + res/image/components/home_black.png + res/image/components/home_white.png + res/image/components/folder_black.png + res/image/components/folder_white.png + res/image/components/tab_gf.png + res/image/components/user_add.png + res/image/components/plus.png + res/image/components/ico_project.png + res/image/components/ico_tp_car.png + res/image/components/ico_tp_com.png + res/image/components/ico_tp_ele.png + res/image/components/ico_tp_h2.png + res/image/img/style1.png + res/image/img/add.png + res/image/components/tb_menu.png + res/image/components/ico_loc.png + res/image/components/ico_line.png + res/image/components/ico_area.png + res/image/components/ico_plugin.png + res/image/components/expand.png + res/image/components/icon_tree_line.png + res/image/components/ico_tree_area.png + res/image/components/ico_tree_line.png + res/image/components/ico_tree_car.png + res/image/components/ico_tree_folder.png + res/image/components/tree/ico_eye.png + res/image/components/tree/ico_unlock.png + res/image/components/map/ico_route.png + res/image/components/map/nav_bike.png + res/image/components/map/nav_car.png + res/image/components/map/nav_truck.png + res/image/components/map/nav_walk.png + res/image/components/map/ico_exchange.png + res/image/components/map/ico_plus.png + res/image/components/map/ico_add_lay.png + res/image/components/map/nav_start.png + res/image/components/map/nav_stop.png + res/image/components/map/nav_right.png + res/image/components/map/nav_right_zhi.png + res/image/components/map/nav_mid.png + res/image/components/ico_lg.png + res/image/components/ico_zs.png + res/image/components/ico_cy.png + res/image/components/ico_font.png + res/image/components/map/ico_phone.png + res/image/components/map/ico_nav.png Gallery_zh_CN.qm Gallery_en_US.qm ) @@ -253,6 +315,29 @@ qt_add_qml_module(${PROJECT_NAME} QML_FILES res/qml/component/MyTabButton.qml QML_FILES res/qml/component/MyTabBar.qml QML_FILES res/qml/component/base/IconDropdownButton.qml + QML_FILES res/qml/component/base/BaseMenuItem.qml + QML_FILES res/qml/dataconnect/DataConnect.qml + QML_FILES res/qml/component/RightMainIntro.qml + QML_FILES res/qml/component/base/MyTabButton.qml + QML_FILES res/qml/component/base/MyDialogWindow.qml + QML_FILES res/qml/component/base/MyContentDialog.qml + QML_FILES res/qml/component/base/StyleButton.qml + QML_FILES res/qml/component/base/ProjectList.qml + QML_FILES res/qml/component/base/MyBreadcrumb.qml + QML_FILES res/qml/component/base/MyTreeView.qml + QML_FILES res/qml/component/SearchRoute.qml + QML_FILES res/qml/component/base/MyImgButton.qml + QML_FILES res/qml/component/nav/RouteResult.qml + QML_FILES res/qml/component/nav/SearchInput.qml + QML_FILES res/qml/component/RightCommon.qml + QML_FILES res/qml/component/base/CommonTitle.qml + QML_FILES res/qml/component/window/SearchNearWindow.qml + QML_FILES res/qml/component/window/AddPointWindow.qml + QML_FILES res/qml/component/base/AttachmenButton.qml + QML_FILES res/qml/component/window/FontEditWindow.qml + QML_FILES res/qml/component/window/EditIconWindow.qml + QML_FILES res/qml/component/base/AnchorChoose.qml + QML_FILES res/qml/component/base/IconRadioGroup.qml ) if (NOT CMAKE_SYSTEM_NAME STREQUAL "Emscripten") diff --git a/Gallery/Gallery_en_US.ts b/Gallery/Gallery_en_US.ts index 86ac9ae..0dfbb2f 100644 --- a/Gallery/Gallery_en_US.ts +++ b/Gallery/Gallery_en_US.ts @@ -127,50 +127,6 @@ - - LeftMainMenu - - - Key - - - - - LeftProjectMenu - - - Key - - - - - LoginScreen - - - Please enter the credentials: - - - - - Username - - - - - Password - - - - - Cancel - - - - - Login - - - MainScreen @@ -738,22 +694,22 @@ MyAppBar - + Minimized - + Restore - + Maximized - + Close @@ -1069,7 +1025,7 @@ - + Key @@ -1964,57 +1920,57 @@ ToolBar - + File - + New... - + Open... - + Save - + Quit - + Search - + Disable - + Check - + Save As... - + Doc - + PDF diff --git a/Gallery/Gallery_zh_CN.qm b/Gallery/Gallery_zh_CN.qm index abcde58..5f169bc 100644 Binary files a/Gallery/Gallery_zh_CN.qm and b/Gallery/Gallery_zh_CN.qm differ diff --git a/Gallery/Gallery_zh_CN.ts b/Gallery/Gallery_zh_CN.ts index 0eeb177..b96c480 100644 --- a/Gallery/Gallery_zh_CN.ts +++ b/Gallery/Gallery_zh_CN.ts @@ -221,6 +221,17 @@ 一位热衷于烹饪实验的厨师。 + + IconDropdownButton + + Quit + 退出 + + + Search + 搜索 + + LeftMainMenu @@ -228,9 +239,8 @@ 文件树 - Key - 唯一值 + 唯一值 @@ -243,37 +253,31 @@ LeftProjectMenu - Key - 唯一值 + 唯一值 LoginScreen - Please enter the credentials: - 请输入凭据: + 请输入凭据: - Username - 用户名 + 用户名 - Password - 密码 + 密码 - Cancel - 取消 + 取消 - Login - 登录 + 登录 @@ -1069,22 +1073,22 @@ MyAppBar - + Minimized - + Restore - + Maximized - + Close @@ -1438,7 +1442,7 @@ 文件树 - + Key 唯一值 @@ -2697,57 +2701,57 @@ ToolBar - + File - + New... - + Open... - + Save - + Quit 退出 - + Search 搜索 - + Disable - + Check - + Save As... - + Doc - + PDF diff --git a/Gallery/res/image/avatars/300-1.jpg b/Gallery/res/image/avatars/300-1.jpg new file mode 100644 index 0000000..c11d6c8 Binary files /dev/null and b/Gallery/res/image/avatars/300-1.jpg differ diff --git a/Gallery/res/image/avatars/300-10.jpg b/Gallery/res/image/avatars/300-10.jpg new file mode 100644 index 0000000..94b3e12 Binary files /dev/null and b/Gallery/res/image/avatars/300-10.jpg differ diff --git a/Gallery/res/image/avatars/300-11.jpg b/Gallery/res/image/avatars/300-11.jpg new file mode 100644 index 0000000..b7082f5 Binary files /dev/null and b/Gallery/res/image/avatars/300-11.jpg differ diff --git a/Gallery/res/image/avatars/300-12.jpg b/Gallery/res/image/avatars/300-12.jpg new file mode 100644 index 0000000..2e34c3f Binary files /dev/null and b/Gallery/res/image/avatars/300-12.jpg differ diff --git a/Gallery/res/image/avatars/300-13.jpg b/Gallery/res/image/avatars/300-13.jpg new file mode 100644 index 0000000..5234adc Binary files /dev/null and b/Gallery/res/image/avatars/300-13.jpg differ diff --git a/Gallery/res/image/avatars/300-14.jpg b/Gallery/res/image/avatars/300-14.jpg new file mode 100644 index 0000000..65a7272 Binary files /dev/null and b/Gallery/res/image/avatars/300-14.jpg differ diff --git a/Gallery/res/image/avatars/300-15.jpg b/Gallery/res/image/avatars/300-15.jpg new file mode 100644 index 0000000..d348093 Binary files /dev/null and b/Gallery/res/image/avatars/300-15.jpg differ diff --git a/Gallery/res/image/avatars/300-16.jpg b/Gallery/res/image/avatars/300-16.jpg new file mode 100644 index 0000000..c629ec4 Binary files /dev/null and b/Gallery/res/image/avatars/300-16.jpg differ diff --git a/Gallery/res/image/avatars/300-17.jpg b/Gallery/res/image/avatars/300-17.jpg new file mode 100644 index 0000000..d94c8ea Binary files /dev/null and b/Gallery/res/image/avatars/300-17.jpg differ diff --git a/Gallery/res/image/avatars/300-18.jpg b/Gallery/res/image/avatars/300-18.jpg new file mode 100644 index 0000000..19762e8 Binary files /dev/null and b/Gallery/res/image/avatars/300-18.jpg differ diff --git a/Gallery/res/image/avatars/300-19.jpg b/Gallery/res/image/avatars/300-19.jpg new file mode 100644 index 0000000..36c4c89 Binary files /dev/null and b/Gallery/res/image/avatars/300-19.jpg differ diff --git a/Gallery/res/image/avatars/300-2.jpg b/Gallery/res/image/avatars/300-2.jpg new file mode 100644 index 0000000..d9dd909 Binary files /dev/null and b/Gallery/res/image/avatars/300-2.jpg differ diff --git a/Gallery/res/image/avatars/300-20.jpg b/Gallery/res/image/avatars/300-20.jpg new file mode 100644 index 0000000..7331d99 Binary files /dev/null and b/Gallery/res/image/avatars/300-20.jpg differ diff --git a/Gallery/res/image/avatars/300-21.jpg b/Gallery/res/image/avatars/300-21.jpg new file mode 100644 index 0000000..7de78f2 Binary files /dev/null and b/Gallery/res/image/avatars/300-21.jpg differ diff --git a/Gallery/res/image/avatars/300-22.jpg b/Gallery/res/image/avatars/300-22.jpg new file mode 100644 index 0000000..bf65f7a Binary files /dev/null and b/Gallery/res/image/avatars/300-22.jpg differ diff --git a/Gallery/res/image/avatars/300-23.jpg b/Gallery/res/image/avatars/300-23.jpg new file mode 100644 index 0000000..40def14 Binary files /dev/null and b/Gallery/res/image/avatars/300-23.jpg differ diff --git a/Gallery/res/image/avatars/300-24.jpg b/Gallery/res/image/avatars/300-24.jpg new file mode 100644 index 0000000..793bfe4 Binary files /dev/null and b/Gallery/res/image/avatars/300-24.jpg differ diff --git a/Gallery/res/image/avatars/300-25.jpg b/Gallery/res/image/avatars/300-25.jpg new file mode 100644 index 0000000..9958320 Binary files /dev/null and b/Gallery/res/image/avatars/300-25.jpg differ diff --git a/Gallery/res/image/avatars/300-26.jpg b/Gallery/res/image/avatars/300-26.jpg new file mode 100644 index 0000000..f01ac21 Binary files /dev/null and b/Gallery/res/image/avatars/300-26.jpg differ diff --git a/Gallery/res/image/avatars/300-27.jpg b/Gallery/res/image/avatars/300-27.jpg new file mode 100644 index 0000000..017de5e Binary files /dev/null and b/Gallery/res/image/avatars/300-27.jpg differ diff --git a/Gallery/res/image/avatars/300-28.jpg b/Gallery/res/image/avatars/300-28.jpg new file mode 100644 index 0000000..9a7b92f Binary files /dev/null and b/Gallery/res/image/avatars/300-28.jpg differ diff --git a/Gallery/res/image/avatars/300-29.jpg b/Gallery/res/image/avatars/300-29.jpg new file mode 100644 index 0000000..bea812b Binary files /dev/null and b/Gallery/res/image/avatars/300-29.jpg differ diff --git a/Gallery/res/image/avatars/300-3.jpg b/Gallery/res/image/avatars/300-3.jpg new file mode 100644 index 0000000..ef369a1 Binary files /dev/null and b/Gallery/res/image/avatars/300-3.jpg differ diff --git a/Gallery/res/image/avatars/300-30.jpg b/Gallery/res/image/avatars/300-30.jpg new file mode 100644 index 0000000..f87edbd Binary files /dev/null and b/Gallery/res/image/avatars/300-30.jpg differ diff --git a/Gallery/res/image/avatars/300-4.jpg b/Gallery/res/image/avatars/300-4.jpg new file mode 100644 index 0000000..d9d0f68 Binary files /dev/null and b/Gallery/res/image/avatars/300-4.jpg differ diff --git a/Gallery/res/image/avatars/300-5.jpg b/Gallery/res/image/avatars/300-5.jpg new file mode 100644 index 0000000..7fe72fd Binary files /dev/null and b/Gallery/res/image/avatars/300-5.jpg differ diff --git a/Gallery/res/image/avatars/300-6.jpg b/Gallery/res/image/avatars/300-6.jpg new file mode 100644 index 0000000..c820176 Binary files /dev/null and b/Gallery/res/image/avatars/300-6.jpg differ diff --git a/Gallery/res/image/avatars/300-7.jpg b/Gallery/res/image/avatars/300-7.jpg new file mode 100644 index 0000000..15c04b8 Binary files /dev/null and b/Gallery/res/image/avatars/300-7.jpg differ diff --git a/Gallery/res/image/avatars/300-8.jpg b/Gallery/res/image/avatars/300-8.jpg new file mode 100644 index 0000000..8d77f46 Binary files /dev/null and b/Gallery/res/image/avatars/300-8.jpg differ diff --git a/Gallery/res/image/avatars/300-9.jpg b/Gallery/res/image/avatars/300-9.jpg new file mode 100644 index 0000000..c152401 Binary files /dev/null and b/Gallery/res/image/avatars/300-9.jpg differ diff --git a/Gallery/res/image/avatars/blank.png b/Gallery/res/image/avatars/blank.png new file mode 100644 index 0000000..e31a57d Binary files /dev/null and b/Gallery/res/image/avatars/blank.png differ diff --git a/Gallery/res/image/components/down.png b/Gallery/res/image/components/down.png new file mode 100644 index 0000000..1af960b Binary files /dev/null and b/Gallery/res/image/components/down.png differ diff --git a/Gallery/res/image/components/edit.png b/Gallery/res/image/components/edit.png new file mode 100644 index 0000000..9bd141f Binary files /dev/null and b/Gallery/res/image/components/edit.png differ diff --git a/Gallery/res/image/components/expand.png b/Gallery/res/image/components/expand.png new file mode 100644 index 0000000..0157e35 Binary files /dev/null and b/Gallery/res/image/components/expand.png differ diff --git a/Gallery/res/image/components/folder_black.png b/Gallery/res/image/components/folder_black.png new file mode 100644 index 0000000..ff2e61f Binary files /dev/null and b/Gallery/res/image/components/folder_black.png differ diff --git a/Gallery/res/image/components/folder_white.png b/Gallery/res/image/components/folder_white.png new file mode 100644 index 0000000..a8fd446 Binary files /dev/null and b/Gallery/res/image/components/folder_white.png differ diff --git a/Gallery/res/image/components/home_black.png b/Gallery/res/image/components/home_black.png new file mode 100644 index 0000000..ff83720 Binary files /dev/null and b/Gallery/res/image/components/home_black.png differ diff --git a/Gallery/res/image/components/home_white.png b/Gallery/res/image/components/home_white.png new file mode 100644 index 0000000..dccc7a2 Binary files /dev/null and b/Gallery/res/image/components/home_white.png differ diff --git a/Gallery/res/image/components/ico_area.png b/Gallery/res/image/components/ico_area.png new file mode 100644 index 0000000..91795bc Binary files /dev/null and b/Gallery/res/image/components/ico_area.png differ diff --git a/Gallery/res/image/components/ico_cy.png b/Gallery/res/image/components/ico_cy.png new file mode 100644 index 0000000..d90edd4 Binary files /dev/null and b/Gallery/res/image/components/ico_cy.png differ diff --git a/Gallery/res/image/components/ico_font.png b/Gallery/res/image/components/ico_font.png new file mode 100644 index 0000000..17ff702 Binary files /dev/null and b/Gallery/res/image/components/ico_font.png differ diff --git a/Gallery/res/image/components/ico_lg.png b/Gallery/res/image/components/ico_lg.png new file mode 100644 index 0000000..fc7a316 Binary files /dev/null and b/Gallery/res/image/components/ico_lg.png differ diff --git a/Gallery/res/image/components/ico_line.png b/Gallery/res/image/components/ico_line.png new file mode 100644 index 0000000..bc025f6 Binary files /dev/null and b/Gallery/res/image/components/ico_line.png differ diff --git a/Gallery/res/image/components/ico_loc.png b/Gallery/res/image/components/ico_loc.png new file mode 100644 index 0000000..7999f3e Binary files /dev/null and b/Gallery/res/image/components/ico_loc.png differ diff --git a/Gallery/res/image/components/ico_plugin.png b/Gallery/res/image/components/ico_plugin.png new file mode 100644 index 0000000..f25628d Binary files /dev/null and b/Gallery/res/image/components/ico_plugin.png differ diff --git a/Gallery/res/image/components/ico_project.png b/Gallery/res/image/components/ico_project.png new file mode 100644 index 0000000..0bae1ec Binary files /dev/null and b/Gallery/res/image/components/ico_project.png differ diff --git a/Gallery/res/image/components/ico_tp_car.png b/Gallery/res/image/components/ico_tp_car.png new file mode 100644 index 0000000..365829e Binary files /dev/null and b/Gallery/res/image/components/ico_tp_car.png differ diff --git a/Gallery/res/image/components/ico_tp_com.png b/Gallery/res/image/components/ico_tp_com.png new file mode 100644 index 0000000..f234a61 Binary files /dev/null and b/Gallery/res/image/components/ico_tp_com.png differ diff --git a/Gallery/res/image/components/ico_tp_ele.png b/Gallery/res/image/components/ico_tp_ele.png new file mode 100644 index 0000000..0bae1ec Binary files /dev/null and b/Gallery/res/image/components/ico_tp_ele.png differ diff --git a/Gallery/res/image/components/ico_tp_h2.png b/Gallery/res/image/components/ico_tp_h2.png new file mode 100644 index 0000000..1554177 Binary files /dev/null and b/Gallery/res/image/components/ico_tp_h2.png differ diff --git a/Gallery/res/image/components/ico_tree_area.png b/Gallery/res/image/components/ico_tree_area.png new file mode 100644 index 0000000..7d040da Binary files /dev/null and b/Gallery/res/image/components/ico_tree_area.png differ diff --git a/Gallery/res/image/components/ico_tree_car.png b/Gallery/res/image/components/ico_tree_car.png new file mode 100644 index 0000000..4f9bda3 Binary files /dev/null and b/Gallery/res/image/components/ico_tree_car.png differ diff --git a/Gallery/res/image/components/ico_tree_folder.png b/Gallery/res/image/components/ico_tree_folder.png new file mode 100644 index 0000000..adf87e6 Binary files /dev/null and b/Gallery/res/image/components/ico_tree_folder.png differ diff --git a/Gallery/res/image/components/ico_tree_line.png b/Gallery/res/image/components/ico_tree_line.png new file mode 100644 index 0000000..ed9c141 Binary files /dev/null and b/Gallery/res/image/components/ico_tree_line.png differ diff --git a/Gallery/res/image/components/ico_zs.png b/Gallery/res/image/components/ico_zs.png new file mode 100644 index 0000000..4c0610b Binary files /dev/null and b/Gallery/res/image/components/ico_zs.png differ diff --git a/Gallery/res/image/components/icon_tree_line.png b/Gallery/res/image/components/icon_tree_line.png new file mode 100644 index 0000000..e4a4ef3 Binary files /dev/null and b/Gallery/res/image/components/icon_tree_line.png differ diff --git a/Gallery/res/image/components/map/ico_add_lay.png b/Gallery/res/image/components/map/ico_add_lay.png new file mode 100644 index 0000000..fb17763 Binary files /dev/null and b/Gallery/res/image/components/map/ico_add_lay.png differ diff --git a/Gallery/res/image/components/map/ico_exchange.png b/Gallery/res/image/components/map/ico_exchange.png new file mode 100644 index 0000000..dd84645 Binary files /dev/null and b/Gallery/res/image/components/map/ico_exchange.png differ diff --git a/Gallery/res/image/components/map/ico_nav.png b/Gallery/res/image/components/map/ico_nav.png new file mode 100644 index 0000000..430737f Binary files /dev/null and b/Gallery/res/image/components/map/ico_nav.png differ diff --git a/Gallery/res/image/components/map/ico_phone.png b/Gallery/res/image/components/map/ico_phone.png new file mode 100644 index 0000000..3fb0adc Binary files /dev/null and b/Gallery/res/image/components/map/ico_phone.png differ diff --git a/Gallery/res/image/components/map/ico_plus.png b/Gallery/res/image/components/map/ico_plus.png new file mode 100644 index 0000000..dd96fdf Binary files /dev/null and b/Gallery/res/image/components/map/ico_plus.png differ diff --git a/Gallery/res/image/components/map/ico_route.png b/Gallery/res/image/components/map/ico_route.png new file mode 100644 index 0000000..d800997 Binary files /dev/null and b/Gallery/res/image/components/map/ico_route.png differ diff --git a/Gallery/res/image/components/map/nav_bike.png b/Gallery/res/image/components/map/nav_bike.png new file mode 100644 index 0000000..048707f Binary files /dev/null and b/Gallery/res/image/components/map/nav_bike.png differ diff --git a/Gallery/res/image/components/map/nav_car.png b/Gallery/res/image/components/map/nav_car.png new file mode 100644 index 0000000..7749df7 Binary files /dev/null and b/Gallery/res/image/components/map/nav_car.png differ diff --git a/Gallery/res/image/components/map/nav_mid.png b/Gallery/res/image/components/map/nav_mid.png new file mode 100644 index 0000000..0ff5628 Binary files /dev/null and b/Gallery/res/image/components/map/nav_mid.png differ diff --git a/Gallery/res/image/components/map/nav_right.png b/Gallery/res/image/components/map/nav_right.png new file mode 100644 index 0000000..f6479a3 Binary files /dev/null and b/Gallery/res/image/components/map/nav_right.png differ diff --git a/Gallery/res/image/components/map/nav_right_zhi.png b/Gallery/res/image/components/map/nav_right_zhi.png new file mode 100644 index 0000000..29cee9c Binary files /dev/null and b/Gallery/res/image/components/map/nav_right_zhi.png differ diff --git a/Gallery/res/image/components/map/nav_start.png b/Gallery/res/image/components/map/nav_start.png new file mode 100644 index 0000000..9b55c5b Binary files /dev/null and b/Gallery/res/image/components/map/nav_start.png differ diff --git a/Gallery/res/image/components/map/nav_stop.png b/Gallery/res/image/components/map/nav_stop.png new file mode 100644 index 0000000..9500b14 Binary files /dev/null and b/Gallery/res/image/components/map/nav_stop.png differ diff --git a/Gallery/res/image/components/map/nav_truck.png b/Gallery/res/image/components/map/nav_truck.png new file mode 100644 index 0000000..c8a28a6 Binary files /dev/null and b/Gallery/res/image/components/map/nav_truck.png differ diff --git a/Gallery/res/image/components/map/nav_walk.png b/Gallery/res/image/components/map/nav_walk.png new file mode 100644 index 0000000..7c29945 Binary files /dev/null and b/Gallery/res/image/components/map/nav_walk.png differ diff --git a/Gallery/res/image/components/plus.png b/Gallery/res/image/components/plus.png new file mode 100644 index 0000000..3937aad Binary files /dev/null and b/Gallery/res/image/components/plus.png differ diff --git a/Gallery/res/image/components/rect.png b/Gallery/res/image/components/rect.png new file mode 100644 index 0000000..3c7c65c Binary files /dev/null and b/Gallery/res/image/components/rect.png differ diff --git a/Gallery/res/image/components/tab_gf.png b/Gallery/res/image/components/tab_gf.png new file mode 100644 index 0000000..0bae1ec Binary files /dev/null and b/Gallery/res/image/components/tab_gf.png differ diff --git a/Gallery/res/image/components/tb_menu.png b/Gallery/res/image/components/tb_menu.png new file mode 100644 index 0000000..4b3f87e Binary files /dev/null and b/Gallery/res/image/components/tb_menu.png differ diff --git a/Gallery/res/image/components/tree/ico_eye.png b/Gallery/res/image/components/tree/ico_eye.png new file mode 100644 index 0000000..cce36f9 Binary files /dev/null and b/Gallery/res/image/components/tree/ico_eye.png differ diff --git a/Gallery/res/image/components/tree/ico_unlock.png b/Gallery/res/image/components/tree/ico_unlock.png new file mode 100644 index 0000000..ce37129 Binary files /dev/null and b/Gallery/res/image/components/tree/ico_unlock.png differ diff --git a/Gallery/res/image/components/user_add.png b/Gallery/res/image/components/user_add.png new file mode 100644 index 0000000..51f9054 Binary files /dev/null and b/Gallery/res/image/components/user_add.png differ diff --git a/Gallery/res/image/icons/circle.png b/Gallery/res/image/icons/circle.png new file mode 100644 index 0000000..d4a79b7 Binary files /dev/null and b/Gallery/res/image/icons/circle.png differ diff --git a/Gallery/res/image/icons/curve.png b/Gallery/res/image/icons/curve.png new file mode 100644 index 0000000..30af0b4 Binary files /dev/null and b/Gallery/res/image/icons/curve.png differ diff --git a/Gallery/res/image/icons/delete.png b/Gallery/res/image/icons/delete.png new file mode 100644 index 0000000..4a854b6 Binary files /dev/null and b/Gallery/res/image/icons/delete.png differ diff --git a/Gallery/res/image/icons/edit.png b/Gallery/res/image/icons/edit.png new file mode 100644 index 0000000..a476766 Binary files /dev/null and b/Gallery/res/image/icons/edit.png differ diff --git a/Gallery/res/image/icons/ellipse.png b/Gallery/res/image/icons/ellipse.png new file mode 100644 index 0000000..b266e88 Binary files /dev/null and b/Gallery/res/image/icons/ellipse.png differ diff --git a/Gallery/res/image/icons/free_area.png b/Gallery/res/image/icons/free_area.png new file mode 100644 index 0000000..2e089e8 Binary files /dev/null and b/Gallery/res/image/icons/free_area.png differ diff --git a/Gallery/res/image/icons/free_line.png b/Gallery/res/image/icons/free_line.png new file mode 100644 index 0000000..0b2b186 Binary files /dev/null and b/Gallery/res/image/icons/free_line.png differ diff --git a/Gallery/res/image/icons/point.png b/Gallery/res/image/icons/point.png new file mode 100644 index 0000000..46c0a7d Binary files /dev/null and b/Gallery/res/image/icons/point.png differ diff --git a/Gallery/res/image/icons/polygon.png b/Gallery/res/image/icons/polygon.png new file mode 100644 index 0000000..60bbbe6 Binary files /dev/null and b/Gallery/res/image/icons/polygon.png differ diff --git a/Gallery/res/image/icons/triangle.png b/Gallery/res/image/icons/triangle.png new file mode 100644 index 0000000..bbf4795 Binary files /dev/null and b/Gallery/res/image/icons/triangle.png differ diff --git a/Gallery/res/image/img/add.png b/Gallery/res/image/img/add.png new file mode 100644 index 0000000..16de18a Binary files /dev/null and b/Gallery/res/image/img/add.png differ diff --git a/Gallery/res/image/img/lg.png b/Gallery/res/image/img/lg.png new file mode 100644 index 0000000..e81ebd8 Binary files /dev/null and b/Gallery/res/image/img/lg.png differ diff --git a/Gallery/res/image/img/map.png b/Gallery/res/image/img/map.png new file mode 100644 index 0000000..476c003 Binary files /dev/null and b/Gallery/res/image/img/map.png differ diff --git a/Gallery/res/image/img/style1.png b/Gallery/res/image/img/style1.png new file mode 100644 index 0000000..bba60f0 Binary files /dev/null and b/Gallery/res/image/img/style1.png differ diff --git a/Gallery/res/qml/App.qml b/Gallery/res/qml/App.qml index 35a9f0b..cd6c201 100644 --- a/Gallery/res/qml/App.qml +++ b/Gallery/res/qml/App.qml @@ -40,6 +40,6 @@ Starter { "/page": R.resolvedUrl("res/qml/window/PageWindow.qml"), "/testDesign": R.resolvedUrl("res/qml/window/TestDesignWindow.qml") } - WindowRouter.go("/") + WindowRouter.go("/") // newFolder, searchNear } } diff --git a/Gallery/res/qml/DB/database.js b/Gallery/res/qml/DB/database.js new file mode 100644 index 0000000..3598b38 --- /dev/null +++ b/Gallery/res/qml/DB/database.js @@ -0,0 +1,100 @@ +var db; + +function initDatabase() { + db = LocalStorage.openDatabaseSync("AntSEV", "1.0", "基本数据看", 100000); + try { + db.transaction(function (tx) { + tx.executeSql(`CREATE TABLE ProjectMenuTree ( + id TEXT PRIMARY KEY, + pid TEXT, -- 父级ID，可以用于表示层级关系 + project_id TEXT NOT NULL, -- 项目ID，非空 + title TEXT NOT NULL, -- 标题，非空 + ico TEXT -- 图标，可以存储图标路径或名称 + );`); + + tx.executeSql(`INSERT INTO ProjectMenuTree (id,pid,project_id,title,ico) VALUES + ('1','-1','1','节点1','ico_tree_folder.png'), + ('2','-1','1','节点2','ico_tree_folder.png'), + ('3','-1','1','节点3','ico_tree_folder.png'), + ('4','6','1','节点61','ico_tree_folder.png'), + ('5','-1','1','节点5','ico_tree_folder.png'), + ('6','7','1','节点6','ico_tree_line.png'), + ('7','3','1','节点节点节点节点613','ico_tree_car.png');`) + }) + } catch (err) { + // console.log("Error creating table in database: " + err) + }; +} + +function buildTree(data) { + // 创建一个映射表，用于快速查找每个节点 + const map = new Map(); + data.forEach(item => { + map.set(item.id, { id: item.id, title: item.title, ico: item.ico, items: [] }); // 初始化每个节点，并添加 children 属性 + }); + + // 构建树结构 + const tree = []; + data.forEach(item => { + if (item.pid !== "-1") { // 如果有父节点 + const parent = map.get(item.pid); + if (parent) { + parent.items.push(map.get(item.id)); // 将当前节点添加到父节点的 children 中 + } + } else { + tree.push(map.get(item.id)); // 如果没有父节点，则为根节点 + } + }); + + return tree; +} + +function readMenuTree(project_id) { + var res = [] + var datas = [] + if (!db) { return; } + db.transaction(function (tx) { + var result = tx.executeSql('select * from ProjectMenuTree where project_id=?', [project_id]); + if (result.rows.length > 0) { + res = result.rows + for (let i = 0; i < res.length; i++) { + let d = res.item(i) + datas.push(d) + } + res = buildTree(datas) + + } else { + res = [] + } + }) + console.log(JSON.stringify(res)) + return res +} + +function readData(name) { + var res = ""; + if (!db) { return; } + db.transaction(function (tx) { + var result = tx.executeSql('select value from data where name=?', [name]); + if (result.rows.length > 0) { + res = result.rows.item(0).value; + } else { + res = "Unknown"; + } + }) + return res +} + +function insertData(name, value) { + var res = ""; + if (!db) { return; } + db.transaction(function (tx) { + var result = tx.executeSql('INSERT OR REPLACE INTO data VALUES (?,?);', [name, value]); + if (result.rowsAffected > 0) { + res = "OK"; + } else { + res = "Error"; + } + }) + return res +} \ No newline at end of file diff --git a/Gallery/res/qml/component/ComDesignInfo.qml b/Gallery/res/qml/component/ComDesignInfo.qml index 3e4319d..73ce57e 100644 --- a/Gallery/res/qml/component/ComDesignInfo.qml +++ b/Gallery/res/qml/component/ComDesignInfo.qml @@ -62,7 +62,7 @@ ColumnLayout { onResult: (data)=>{ icon_img.source = data.image - control.iconChanged(data.key) + control.iconChanged({key: data.key, image: data.key}) } } @@ -182,7 +182,8 @@ ColumnLayout { control.isNeedSignal = false com_tb.text = data.title - com_color.current = data.textColor + console.log(JSON.stringify(data)) + com_color.current = data.textColor ? data.textColor : "#ffffff" icon_img.source = "qrc:/qt/qml/Gallery/res/image/icons/" + data.img control.entityId = data.id } else { diff --git a/Gallery/res/qml/component/LeftMainMenu.qml b/Gallery/res/qml/component/LeftMainMenu.qml index d83da17..a90f864 100644 --- a/Gallery/res/qml/component/LeftMainMenu.qml +++ b/Gallery/res/qml/component/LeftMainMenu.qml @@ -8,16 +8,19 @@ import Gallery Item { id: control property int depthPadding: 15 - property var current + property var current: "0" property var initData: [] + property var homeChecked: true + signal clickItem(var data) + signal clickHome() Component{ id: comp_row_key Item{ id: item_layout - height: 500 + anchors.fill: parent property var __display: display property bool chekced: { if(!control.current){ @@ -83,6 +86,7 @@ Item { width: 3 visible: item_layout.chekced color: Theme.accentColor.defaultBrushFor() + anchors{ verticalCenter: parent.verticalCenter left: parent.left @@ -100,54 +104,239 @@ Item { } } } - TreeDataGridModel{ + // TreeDataGridModel{ + // id: dataModel + // } + + ListModel { id: dataModel + ListElement { + uuid: "1" + title: "分组1" + icon: "qrc:/qt/qml/Gallery/res/image/ico_tab.png" + checked: false + } + ListElement { + uuid: "2" + title: "分组2" + icon: "qrc:/qt/qml/Gallery/res/image/ico_tab.png" + checked: false + } + ListElement { + uuid: "3" + title: "分组1" + icon: "qrc:/qt/qml/Gallery/res/image/ico_tab.png" + checked: false + } + ListElement { + uuid: "4" + title: "分组2" + icon: "qrc:/qt/qml/Gallery/res/image/ico_tab.png" + checked: false + } + ListElement { + uuid: "5" + title: "分组1" + icon: "qrc:/qt/qml/Gallery/res/image/ico_tab.png" + checked: false + } + ListElement { + uuid: "6" + title: "分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2分组2" + icon: "qrc:/qt/qml/Gallery/res/image/ico_tab.png" + checked: false + } + } + + Component{ + id: list_item + Rectangle{ + width: parent.width + height: 38 + color: "transparent" + Rectangle{ + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + height: 34 + color: "transparent" + RowLayout{ + anchors.fill: parent + spacing: 5 + z: 2 + Image{ + Layout.leftMargin: 10 + Layout.preferredHeight: 12 + Layout.preferredWidth: 14 + source: "qrc:/qt/qml/Gallery/res/image/components/" + (control.current == model.uuid ? "folder_black.png" : "folder_white.png") + } + Label{ + text: model.title + Layout.preferredWidth: parent.width - 80 + elide: Text.ElideRight + color: control.current == model.uuid ? "#2a2a2a" : "#ffffff" + } + Item{ + Layout.fillWidth: true + } + } + MouseArea { + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#2d2d2d" + onExited: { + parent.color = "transparent" + } + onClicked: { + control.current = model.uuid + control.clickItem(model) + } + } + + Rectangle{ + // width: 3 + anchors.fill: parent + height: 20 + // anchors.top: parent.top + // anchors.topMargin: 7 + color: "#4CA0E0" + radius: 5 + z: 1 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + visible: control.current == model.uuid + } + } + + InfoBadge { + anchors.right: parent.right + anchors.top: parent.top + anchors.rightMargin: 10 + anchors.topMargin: 10 + count: 5 + color: "#ffffff" + tcolor: "#2a2a2a" + } + } } ColumnLayout{ + spacing: 5 anchors.fill: parent - TreeDataGrid{ - Layout.fillHeight: true + Rectangle{ Layout.fillWidth: true - id: dataGrid - // anchors{ - // top: parent.top - // bottom: parent.bottom - // left: parent.left - // bottomMargin: 10 - // } - verticalHeaderVisible: false - horizonalHeaderVisible: false - width: 240 - sourceModel: dataModel - columnSourceModel: ListModel{ - ListElement{ - title: qsTr("Key") - dataIndex: "id" - width: 240 - frozen: false - rowDelegate: function(){return comp_row_key} + Layout.preferredHeight: 35 + color: "transparent" + RowLayout{ + anchors.fill: parent + spacing: 5 + z: 2 + Image{ + Layout.leftMargin: 10 + Layout.preferredHeight: 12 + Layout.preferredWidth: 14 + source: "qrc:/qt/qml/Gallery/res/image/components/" + (control.current == "0" ? "home_black.png" : "home_white.png") + } + Label{ + text: "主页" + color: control.current == "0" ? "#2a2a2a": "#ffffff" + } + Item{ + Layout.fillWidth: true } } - cellBackground: Item{} - cellForeground: Item{} + MouseArea { + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#2d2d2d" + onExited: parent.color = "transparent" + onClicked: { + control.current = "0" + control.clickHome() + } + } + + Rectangle{ + // width: 3 + // height: 20 + z: 1 + anchors.fill: parent + anchors.top: parent.top + anchors.topMargin: 0 + radius: 5 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + + visible: control.current == "0" + } + } + + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 1 + color: Qt.rgba(216/255,216/255,216/255, 0.2) + } + + ScrollView{ + Layout.fillWidth: true + Layout.fillHeight: true + ListView{ + anchors.fill: parent + id: list_view + model: dataModel + clip: true + delegate: list_item + highlight: Item{} + } } Rectangle{ Layout.fillWidth: true Layout.preferredHeight: 35 - color: "transparent" - IconButton{ - anchors.verticalCenter: parent.verticalCenter + Layout.leftMargin: -10 + Layout.rightMargin: -10 + color: Qt.rgba(255/255,255/255,255/255, 0.05) + radius: 5 + RowLayout{ anchors.fill: parent - text: "添加目录" - icon.name: FluentIcons.graph_Add - icon.width: 18 - icon.height: 18 spacing: 5 - onClicked: { - console.log(dataGrid) - folderNew.launch({ title: "" }) + IconButton{ + Layout.fillWidth: true + Layout.fillHeight: true + Layout.topMargin: 5 + Layout.leftMargin: 5 + Layout.bottomMargin: 5 + icon.name: FluentIcons.graph_DictionaryAdd + icon.width: 14 + icon.height: 14 + spacing: 5 + backgroundColor: "#535353" + onClicked: { + console.log(dataGrid) + folderNew.launch({ title: "" }) + } + } + IconButton{ + Layout.fillWidth: true + Layout.fillHeight: true + Layout.topMargin: 5 + Layout.rightMargin: 5 + Layout.bottomMargin: 5 + icon.name: FluentIcons.graph_Delete + icon.width: 14 + icon.height: 14 + backgroundColor: "#535353" + spacing: 5 + onClicked: { + console.log(dataGrid) + folderNew.launch({ title: "" }) + } } } } @@ -165,23 +354,24 @@ Item { //////////// Component.onCompleted: { - var data = {id: "1", title: "充电站规划", height: 35, icon: "qrc:/qt/qml/Gallery/res/image/ico_tab.png", cdata: null} - control.setMenuData(data) - var data = {id: "12", title: "运输计划", height: 35, icon: "qrc:/qt/qml/Gallery/res/image/ico_tab.png", cdata: null} - control.setMenuData(data) + // var data = {id: "1", title: "充电站规划", height: 35, icon: "qrc:/qt/qml/Gallery/res/image/ico_tab.png", cdata: null} + // control.setMenuData(data) + // var data = {id: "12", title: "运输计划", height: 35, icon: "qrc:/qt/qml/Gallery/res/image/ico_tab.png", cdata: null} + // control.setMenuData(data) } function setMenuData(data) { - var tmp = initData.find((v) => v.id == data.id) - if (!tmp) { - tmp = { id: data.id, key: data.title ? data.title : "未命名", height: 35, icon: data.icon, cdata: data } - initData.push(tmp) - } else { - tmp.key = data.title - tmp.cdata = data - } + // var tmp = initData.find((v) => v.id == data.id) + // if (!tmp) { + // tmp = { id: data.id, key: data.title ? data.title : "未命名", height: 35, icon: data.icon, cdata: data } + // initData.push(tmp) + // } else { + // tmp.key = data.title + // tmp.cdata = data + // } - dataModel.sourceData = initData + // dataModel.sourceData = initData + dataModel.append({title: data.title, icon: data.icon,uuid:data.id,checked:false}) } function generateUUID() { diff --git a/Gallery/res/qml/component/LeftMainMenuTab.qml b/Gallery/res/qml/component/LeftMainMenuTab.qml index a1593b6..5fa303f 100644 --- a/Gallery/res/qml/component/LeftMainMenuTab.qml +++ b/Gallery/res/qml/component/LeftMainMenuTab.qml @@ -4,9 +4,12 @@ import QtQuick.Controls import FluentUI.Controls import FluentUI.impl -Item { +Rectangle { id: control + color: Qt.rgba(255/255,255/255,255/255, 0.05) + radius: 5 + signal clickMenuItem(var data) signal clickResource(var data) @@ -30,21 +33,26 @@ Item { MyTabBar { id: bar width: parent.width + clip: true - palette.window: "green" spacing: 20 Repeater { model: tab_model MyTabButton { id: btn_tab text: model.title - font.pointSize: 12 - implicitHeight: 50 - implicitWidth: 40 - // topPadding: 30 - palette.windowText: "#1B806A" + font.pointSize: 10 + implicitHeight: 30 + p_color: "#cccccc" } } + background: Rectangle { + anchors.fill: parent + color: '#242424' + radius: 5 + border.color: Qt.rgba(74/255,74/255,74/255, 0.5) + border.width: 1 + } } Component{ @@ -64,8 +72,9 @@ Item { right: bar.right top: bar.bottom bottom: parent.bottom - topMargin: 10 + topMargin: 3 } + // 元素 LeftProjectMenu{ id: com_menu Layout.fillWidth: true diff --git a/Gallery/res/qml/component/LeftProjectMenu.qml b/Gallery/res/qml/component/LeftProjectMenu.qml index f74c046..a72bfa0 100644 --- a/Gallery/res/qml/component/LeftProjectMenu.qml +++ b/Gallery/res/qml/component/LeftProjectMenu.qml @@ -4,6 +4,10 @@ import QtQuick.Controls import FluentUI.Controls import FluentUI.impl import Gallery +import "../component/base" + +import QtQuick.LocalStorage 2.0 +import "../DB/database.js" as DB Item { id: control @@ -29,7 +33,6 @@ Item { id: comp_row_key Item{ id: item_layout - height: 500 property var __display: display property bool chekced: { if(!control.current){ @@ -71,7 +74,8 @@ Item { height: 15 source: rowModel.icon ? rowModel.icon : "qrc:/qt/qml/Gallery/res/image/ic_file_text.png" // rowModel.hasChildren ? "qrc:/qt/qml/Gallery/res/image/ic_folder.png" : "qrc:/qt/qml/Gallery/res/image/ic_file_text.png" anchors{ - verticalCenter: parent.verticalCenter + top: parent.top + topMargin: 3 } } Item{ @@ -159,32 +163,171 @@ Item { TreeDataGridModel{ id: dataModel } - TreeDataGrid{ - id: dataGrid - anchors{ - top: parent.top - bottom: parent.bottom - left: parent.left - bottomMargin: 10 - } - verticalHeaderVisible: false - horizonalHeaderVisible: false - width: 240 - sourceModel: dataModel - columnSourceModel: ListModel{ - ListElement{ - title: qsTr("Key") - dataIndex: "id" - width: 240 - frozen: false - rowDelegate: function(){return comp_row_key} + + ColumnLayout{ + anchors.fill: parent + spacing: 5 + + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 30 + Layout.topMargin: 5 + color: 'transparent' + TextBox{ + id: tb_searcn + anchors.fill: parent + placeholderText: "请输入图层名称" + trailing: IconButton{ + implicitWidth: 30 + implicitHeight: 20 + icon.name: FluentIcons.graph_Search + icon.width: 14 + icon.height: 14 + padding: 0 + } + background: InputBackground { + implicitWidth: 200 + implicitHeight: 32 + radius: 5 + activeColor: "#22C55E" + color: { + if(!tb_searcn.enabled){ + return tb_searcn.FluentUI.theme.res.controlFillColorDisabled + }else if(tb_searcn.activeFocus){ + return tb_searcn.FluentUI.theme.res.controlFillColorInputActive + }else if(tb_searcn.hovered){ + return tb_searcn.FluentUI.theme.res.controlFillColorSecondary + }else{ + return tb_searcn.FluentUI.theme.res.controlFillColorDefault + } + } + target: tb_searcn + } + } + } + + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 1 + color: Qt.rgba(125/255,125/255,125/255, 0.2) + } + + // TreeDataGrid{ + // id: dataGrid + + // Layout.fillWidth: true + // Layout.fillHeight: true + + // columnWidthProvider: function(c) { + // return dataGrid.width + // } + + // verticalHeaderVisible: false + // horizonalHeaderVisible: false + // sourceModel: dataModel + // columnSourceModel: ListModel{ + // ListElement{ + // title: qsTr("Key") + // dataIndex: "id" + // frozen: false + // rowDelegate: function(){return comp_row_key} + // } + // } + // cellBackground: Item{} + // cellForeground: Item{} + // } + + MyTreeView { + id: tree + Layout.fillWidth: true + Layout.fillHeight: true + model: modelTree2 + onSelectedItemChanged: console.log(item.text) + } + ListModel { + id: modelTree2 + Component.onCompleted: { + DB.initDatabase() + var result = DB.readMenuTree("1") + modelTree2.append(result) + // modelTree2.append([ + // {id: "1", title: "Node 1", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "2", title: "Node 2", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: [ + // {id: "21", title: "Node 21", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items:[ + // {id: "211", title: "Node 211", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_car.png", items: []}, + // {id: "212", title: "Node 212", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_car.png", items: []} + // ]}, + // {id: "22", title: "Node 22", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_line.png", items: []} + // ] + // }, + // {id: "3", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "4", title: "多文字多文字多文字多文字多文字多文字多文字多文字多文字多文字多文字多文字", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "31", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "32", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "33", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "34", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "35", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "36", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "37", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "38", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "39", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "30", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "300", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // {id: "3000", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + // ]); + } + } + + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 35 + Layout.leftMargin: 0 + Layout.rightMargin: 0 + color: Qt.rgba(255/255,255/255,255/255, 0.05) + radius: 5 + RowLayout{ + anchors.fill: parent + spacing: 5 + IconButton{ + Layout.fillWidth: true + Layout.fillHeight: true + Layout.topMargin: 5 + Layout.leftMargin: 5 + Layout.bottomMargin: 5 + icon.name: FluentIcons.graph_DictionaryAdd + icon.width: 14 + icon.height: 14 + spacing: 5 + backgroundColor: "#535353" + onClicked: { + console.log('') + } + } + IconButton{ + Layout.fillWidth: true + Layout.fillHeight: true + Layout.topMargin: 5 + Layout.rightMargin: 5 + Layout.bottomMargin: 5 + icon.name: FluentIcons.graph_Delete + icon.width: 14 + icon.height: 14 + backgroundColor: "#535353" + spacing: 5 + onClicked: { + console.log("") + } + } } } - cellBackground: Item{} - cellForeground: Item{} } + Component.onCompleted: { controller.loadData() + setMenuData({ + id: "1", + title: "多边形1" + }) } Pane{ id: panel_loading @@ -202,10 +345,16 @@ Item { function setMenuData(data) { var tmp = initData.find((v) => v.id == data.id) if (!tmp) { - tmp = { id: data.id, key: data.title ? data.title : "未命名", height: 35, icon: "", cdata: data, lock: false, show: true } + tmp = { id: data.id, key: data.title ? data.title : "未命名", height: 35, icon: data.image ? "qrc:/qt/qml/Gallery/res/image/icons/" + data.image : "", cdata: data, lock: false, show: true } initData.push(tmp) } else { - tmp.key = data.title + if (data.title) { + tmp.key = data.title + } + if (data.image) { + tmp.icon = "qrc:/qt/qml/Gallery/res/image/icons/" + data.image + } + tmp.cdata = data } diff --git a/Gallery/res/qml/component/MapContainer.qml b/Gallery/res/qml/component/MapContainer.qml index 61e9abf..1cccd29 100644 --- a/Gallery/res/qml/component/MapContainer.qml +++ b/Gallery/res/qml/component/MapContainer.qml @@ -53,13 +53,17 @@ Item { Layout.preferredWidth: 500 Layout.preferredHeight: 60230 id: webQues - url: "http://123.6.102.119:85/maptool/" // http://123.6.102.119:85/ + url: "http://localhost:8077/maptool/" // http://123.6.102.119:85/ settings.localContentCanAccessRemoteUrls: true settings.localContentCanAccessFileUrls: false settings.pluginsEnabled: false settings.fullScreenSupportEnabled: true settings.screenCaptureEnabled: false webChannel: myChannel + onContextMenuRequested: { + request.accepted = true + } + } } diff --git a/Gallery/res/qml/component/MyAppBar.qml b/Gallery/res/qml/component/MyAppBar.qml index 088a80e..c8699fa 100644 --- a/Gallery/res/qml/component/MyAppBar.qml +++ b/Gallery/res/qml/component/MyAppBar.qml @@ -3,6 +3,8 @@ import QtQuick.Controls import QtQuick.Layouts import FluentUI.Controls import FluentUI.impl +import "../dataconnect" +import "base" import Qt5Compat.GraphicalEffects @@ -17,20 +19,23 @@ Rectangle { property alias buttonMaximized: btn_maximized property alias buttonMinimized: btn_minimized property Component windowIcon: comp_window_icon - property string windowTitle + property string windowTitle: "AntsEV Studio" + signal clickHome() width: { if(parent){ return parent.width } return 0 } - implicitHeight: 40 + implicitHeight: 45 color: "#202124" //Colors.transparent Component{ id: comp_window_icon Image{ width: 16 height: 20 + anchors.left: parent.left + anchors.leftMargin: 1 source: "qrc:/qt/qml/Gallery/res/image/antlogo.png" // R.windowIcon } } @@ -47,6 +52,21 @@ Rectangle { Item{ width: parent.width height: 40 + + Rectangle{ + anchors.left: parent.left + anchors.leftMargin: 5 + anchors.top: parent.top + anchors.topMargin: 3 + opacity: 0.05 + radius: 5 + + width: 220 + height: parent.height + + color: "#ffffff" + } + Row{ id: layout_title anchors{ @@ -56,7 +76,7 @@ Rectangle { top: parent.top bottom: parent.bottom leftMargin: 10 - topMargin: 2 + topMargin: 5 } spacing: 6 state: Qt.platform.os @@ -82,9 +102,12 @@ Rectangle { id: logoText text: control.windowTitle elide: Qt.ElideRight - font: Typography.bodyStrong + // font: Typography.bodyStrong anchors.verticalCenter: parent.verticalCenter visible: false + font.pointSize: 11 + font.bold: true + // font.family: Typography.bodyStrong } LinearGradient { anchors.left: logoText.left @@ -104,7 +127,9 @@ Rectangle { RowLayout{ anchors.left: layout_title.left - anchors.leftMargin: logoText.width + 20 + anchors.leftMargin: logoText.width + 53 + anchors.top: parent.top + anchors.topMargin: 3 height: parent.height width: parent.width - 160 - 150 AutoLoader{ @@ -112,12 +137,12 @@ Rectangle { sourceComponent: control.action } Rectangle{ - color: "#292929" - Layout.preferredHeight: 34 - Layout.preferredWidth: 34 + color: Qt.rgba(255/255,255/255,255/255, 0.05) + Layout.preferredHeight: 31 + Layout.preferredWidth: 31 radius: 5 - Layout.leftMargin: 10 - Layout.topMargin: 2 + Layout.leftMargin: 12 + Layout.topMargin: 1 Image{ source: "qrc:/qt/qml/Gallery/res/image/ico_home.png" anchors.horizontalCenter: parent.horizontalCenter @@ -127,66 +152,109 @@ Rectangle { anchors.fill: parent hoverEnabled: true onEntered: parent.color = "#000000" - onExited: parent.color = "#292929" + onExited: parent.color = Qt.rgba(255/255,255/255,255/255, 0.05) onClicked: { - // control.clickNav("home", "") + DataConnect.goHome("") } } + Component.onCompleted: { + d.setHitTestVisible(this) + } } + // tabview Rectangle{ Layout.preferredWidth: parent.width Layout.preferredHeight: 40 + // Layout.fillWidth: true color: 'transparent' - MyTabView{ - anchors.left: parent.left - anchors.leftMargin: 0 - anchors.top: parent.top - anchors.topMargin: 5 - id: tab_view - closeButtonVisibility: TabViewType.OnHover - tabWidthBehavior: TabViewType.Equal - addButtonVisibility: false - Component.onCompleted: { - newTab() - newTab() - newTab() - newTab() - newTab() - } - Component{ - id:com_page - Rectangle{ - anchors.fill: parent - color: "transparent" + Item{ + anchors.fill: parent + MyTabView{ + parentD: d + anchors.left: parent.left + anchors.leftMargin: 10 + anchors.top: parent.top + anchors.topMargin: 4 + id: tab_view + closeButtonVisibility: TabViewType.OnHover + tabWidthBehavior: TabViewType.Equal + addButtonVisibility: false + Component.onCompleted: { + newTab() + // newTab() + // newTab() } - } - onClickNav: function(data) { - //control.clickNav("other", data.argument.path) - } - onCloseTabed: function(index) { - console.log("tab count=" + tab_view.count()) - //control.mapTabs[index.argument.path] = undefined - } - onCloseTabOk: { - if (tab_view.count() > 0) { - tab_view.choose(tab_view.count() - 1) - var curt = tab_view.get_cur_tab() - var uuid = curt.argument.path - // control.clickNav("other", uuid) - } else { - // control.clickNav("home", "") + Component{ + id:com_page + Rectangle{ + // anchors.fill: parent + color: "transparent" + } + } + onClickNav: function(data) { + //control.clickNav("other", data.argument.path) + console.log(tab_view.width) + } + onCloseTabed: function(index) { + console.log("tab count=" + tab_view.count()) + //control.mapTabs[index.argument.path] = undefined + } + onCloseTabOk: { + if (tab_view.count() > 0) { + tab_view.choose(tab_view.count() - 1) + var curt = tab_view.get_cur_tab() + var uuid = curt.argument.path + // control.clickNav("other", uuid) + } else { + // control.clickNav("home", "") + } + } + function newTab(){ + tab_view.appendTab("qrc:/qt/qml/Gallery/res/image/components/tab_gf.png","耳字壕充换电站规划",com_page,"green") } - } - function newTab(){ - tab_view.appendTab("qrc:/qt/qml/Gallery/res/image/ico_tab.png","耳字壕充换电站规划",com_page,"green") } } } + } - Component.onCompleted: { - d.setHitTestVisible(this) + Menu { + id:menu_person + width: 160 + BaseMenuItem{ + m_text: "查看主页" + m_key: "" + show_key: false + show_img: false + onClickItem: { + + } } + BaseMenuItem{ + m_text: "关闭标签" + m_key: "" + show_key: false + show_img: false + onClickItem: { + + } + } + BaseMenuItem{ + m_text: "退出" + m_key: "" + show_key: false + show_img: false + onClickItem: { + + } + } + background: Rectangle{ + width: 166 + color: "#191919" + radius: 8 + x: -3 + } + } RowLayout{ @@ -199,6 +267,29 @@ Rectangle { Layout.fillHeight: true sourceComponent: control.action } + Item{ + Layout.topMargin: 5 + Layout.rightMargin: 40 + RoundImageView{ + width: 32 + height: 32 + radius: 32/2 + borderWidth: 2 + sourceSize: Qt.size(32*2,32*2) + source: "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg" + anchors{ + verticalCenter: parent.verticalCenter + } + MouseArea{ + anchors.fill: parent + onClicked: { + menu_person.popup(this) + menu_person.x = -60 + menu_person.y = 33 + } + } + } + } IconButton{ id: btn_minimized implicitWidth: d.buttonWidth diff --git a/Gallery/res/qml/component/MyFramelessWindow.qml b/Gallery/res/qml/component/MyFramelessWindow.qml index 21a1b71..a315b48 100644 --- a/Gallery/res/qml/component/MyFramelessWindow.qml +++ b/Gallery/res/qml/component/MyFramelessWindow.qml @@ -7,16 +7,21 @@ Window { id: control FluentUI.theme: Theme.of(control) required property var initialItem + property bool showAppBar: true property alias containerItem: layout_container property alias framelessHelper: frameless property int launchMode: WindowType.Standard property bool fitsAppBarWindows: false property bool topmost: false property bool fixSize: false - property MyAppBar appBar: MyAppBar{ + property var appBar: MyAppBar{ showMaximize: !control.fixSize windowTitle: control.title + onClickHome: { + control.clickHome() + } } + signal clickHome() property int __margins: 0 property var __windowRegister property string __route @@ -102,7 +107,7 @@ Window { data: [appBar] width: parent.width height: childrenRect.height - visible: !frameless.disabled + visible: showAppBar//!frameless.disabled y: control.visibility === Window.FullScreen ? -childrenRect.height : 0 Behavior on y { NumberAnimation{ diff --git a/Gallery/res/qml/component/MyTabBar.qml b/Gallery/res/qml/component/MyTabBar.qml index 1bda463..96fa0f9 100644 --- a/Gallery/res/qml/component/MyTabBar.qml +++ b/Gallery/res/qml/component/MyTabBar.qml @@ -34,11 +34,13 @@ T.TabBar { preferredHighlightEnd: width - 40 } - // background: Rectangle { - // height: 3 - // width: 30 - // anchors.bottom: parent.bottom - - // color: '#1B806A' - // } + background: Rectangle { + height: 2 + width: parent.width + anchors.bottom: parent.bottom + anchors.bottomMargin: -5 + anchors.left: parent.left + anchors.leftMargin: 5 + color: '#ccc' + } } diff --git a/Gallery/res/qml/component/MyTabButton.qml b/Gallery/res/qml/component/MyTabButton.qml index 17f8b6f..3abbc0d 100644 --- a/Gallery/res/qml/component/MyTabButton.qml +++ b/Gallery/res/qml/component/MyTabButton.qml @@ -20,11 +20,14 @@ T.TabButton { padding: 6 spacing: 3 + property var p_color: "#1B806A" + icon.width: 24 icon.height: 24 icon.color: checked ? control.palette.windowText : control.palette.brightText contentItem: IconLabel { + id: lbl_tab spacing: control.spacing mirrored: control.mirrored display: control.display @@ -32,13 +35,54 @@ T.TabButton { icon: control.icon text: control.text font: control.font - color: control.checked ? "#1B806A" : "#ffffff" + color: control.checked ? p_color : "#ffffff" + } + + onCheckedChanged: { + if (!control.checked && bg_rect) { + bg_rect.color = "#242424" + } } background: Rectangle { - anchors.bottom: parent.bottom - implicitHeight: 2 - color: control.checked ? "#1B806A" : "transparent" + id: bg_rect + implicitHeight: 30 + implicitWidth: parent.width + color: control.checked ? Qt.rgba(74/255,74/255,74/255, 0.5) : "#242424" + radius: 5 + anchors{ + left: parent.left + leftMargin: control.checked ? 0 : 1 + top: parent.top + topMargin: control.checked ? 0 : 1 + bottom: parent.bottom + bottomMargin: control.checked ? 0 : 1 + right: parent.right + rightMargin: control.checked ? 0 : 1 + } + MouseArea { + anchors.fill: parent + hoverEnabled: true + onEntered: { + if (!control.checked) + parent.color = Qt.rgba(74/255,74/255,74/255, 0.5) + } + onExited: { + if (!control.checked) + parent.color = "#242424" + } + } + border.color: '#717171' //Qt.rgba(74/255,74/255,74/255, 0.2) + border.width: control.checked ? 1 : 0 + Rectangle{ + visible: control.checked + width: control.text.length * 18 + height: 3 + color: "#22C55E" + radius: 3 + anchors.bottom: parent.bottom + anchors.horizontalCenter: parent.horizontalCenter + } } } diff --git a/Gallery/res/qml/component/MyTabView.qml b/Gallery/res/qml/component/MyTabView.qml index 70a7ee0..743cbac 100644 --- a/Gallery/res/qml/component/MyTabView.qml +++ b/Gallery/res/qml/component/MyTabView.qml @@ -10,6 +10,7 @@ Item { property int closeButtonVisibility : TabViewType.Always property int itemWidth: 146 property bool addButtonVisibility: true + property var parentD; signal newPressed signal closeTabed(var item) signal closeTabOk() @@ -153,8 +154,8 @@ Item { radius: 6 width: item_container.width - 5 height: item_container.height - visible: item_container.isCurrent - color: control.FluentUI.theme.res.solidBackgroundFillColorQuarternary + visible: true//item_container.isCurrent + color: item_container.isCurrent ? Qt.rgba(0/255,0/255,0/255, 0.5) : Qt.rgba(255/255,255/255,255/255, 0.05) } RowLayout{ @@ -227,6 +228,11 @@ Item { id: hover_handler } } + + Component.onCompleted: { + parentD.setHitTestVisible(this) + } + } WheelHandler{ onWheel: @@ -236,6 +242,7 @@ Item { } } } + // Item{ id:container anchors{ @@ -273,4 +280,7 @@ Item { function get_cur_tab() { return tab_model.get(tab_nav.currentIndex) } + function get_list() { + return tab_nav + } } diff --git a/Gallery/res/qml/component/RightCommon.qml b/Gallery/res/qml/component/RightCommon.qml new file mode 100644 index 0000000..f188bb9 --- /dev/null +++ b/Gallery/res/qml/component/RightCommon.qml @@ -0,0 +1,345 @@ +import QtQuick 2.15 +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt.labs.qmlmodels +import Qt5Compat.GraphicalEffects +import "base" as BS + +Rectangle { + id: control + height: parent.height + color: Qt.rgba(255/255,255/255,255/255, 0.05) + radius: 6 + + property var p_padding: 10 + + ListModel{ + id: tab_model + ListElement{ + title: "属性" + } + ListElement{ + title: "数据" + } + ListElement{ + title: "分析" + } + } + + MyTabBar { + id: bar + width: parent.width + anchors.left: parent.left + anchors.top: parent.top + anchors.right: parent.right + anchors.leftMargin: p_padding + anchors.topMargin: p_padding + anchors.rightMargin: p_padding + + clip: true + spacing: 20 + Repeater { + model: tab_model + MyTabButton { + id: btn_tab + text: model.title + font.pointSize: 10 + implicitHeight: 30 + p_color: "#cccccc" + } + } + background: Rectangle { + anchors.fill: parent + color: '#242424' + radius: 5 + border.color: Qt.rgba(74/255,74/255,74/255, 0.5) + border.width: 1 + } + } + + StackLayout { + currentIndex: bar.currentIndex + anchors{ + left: bar.left + right: bar.right + top: bar.bottom + bottom: parent.bottom + topMargin: 3 + } + Rectangle{ + Layout.fillWidth: true + Layout.fillHeight: true + color: 'transparent' + ScrollView{ + width: 260 + height: parent.height + ColumnLayout{ + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + anchors.topMargin: 5 + + BS.CommonTitle{ + p_title: "封面" + } + + Rectangle{ + Layout.preferredWidth: 250 + Layout.preferredHeight: 138 + radius: 8 + color: Qt.rgba(216/255,216/255,216/255, 0.05) + Rectangle{ + radius: 8 + anchors.fill: parent + anchors.leftMargin: 5 + anchors.topMargin: 5 + anchors.rightMargin: 5 + anchors.bottomMargin: 5 + border.color: Qt.rgba(216/255,216/255,216/255, 0.2) + border.width: 1 + color: Qt.rgba(216/255,216/255,216/255, 0.05) + MouseArea{ + + } + } + } + + BS.CommonTitle{ + Layout.topMargin: 10 + p_title: "背景" + } + + Item{ + Layout.fillWidth: true + Layout.preferredHeight: 35 + + RowLayout{ + anchors.fill: parent + RadioButton { + text: "颜色" + checked: true + FluentUI.primaryColor: "#77ED8B" + } + RadioButton { + text: "天空盒" + checked: false + FluentUI.primaryColor: "#77ED8B" + } + RadioButton { + text: "图片" + checked: false + FluentUI.primaryColor: "#77ED8B" + } + } + } + + BS.CommonTitle{ + Layout.topMargin: 10 + p_title: "选择地图风格" + } + + GridView{ + id: gv + Layout.preferredWidth: parent.width + Layout.preferredHeight: gv.contentHeight + cellWidth: 125 + cellHeight: 102 + model: ListModel{ + ListElement{ + title: "风格1" + ico: "qrc:/qt/qml/Gallery/res/image/img/style1.png" + checked: true + } + ListElement{ + title: "风格1" + ico: "qrc:/qt/qml/Gallery/res/image/img/style1.png" + checked: false + } + ListElement{ + title: "风格2" + ico: "qrc:/qt/qml/Gallery/res/image/img/style1.png" + checked: false + } + ListElement{ + title: "风格3" + ico: "qrc:/qt/qml/Gallery/res/image/img/style1.png" + checked: false + } + } + + delegate: BS.StyleButton{ + p_icon: model.ico + p_txt: model.title + p_check: model.checked + p_w: 120 + p_h: 92 + p_fontSize: 9 + } + + clip: true + interactive: false + boundsBehavior: Flickable.StopAtBounds + } + + + BS.CommonTitle{ + Layout.topMargin: 10 + p_title: "地理坐标系" + } + + Item{ + Layout.fillWidth: true + Layout.preferredHeight: 35 + + RowLayout{ + anchors.fill: parent + RadioButton { + text: "WGS84坐标" + checked: true + FluentUI.primaryColor: "#77ED8B" + } + RadioButton { + text: "本地坐标系" + checked: false + FluentUI.primaryColor: "#77ED8B" + } + } + } + + Rectangle{ + Layout.topMargin: 10 + Layout.fillWidth: true + Layout.preferredHeight: 40 + radius: 8 + color: "transparent" + Rectangle{ + anchors.top: parent.top + width: parent.width + height: 1 + color: Qt.rgba(216/255,216/255,216/255, 0.1) + } + RowLayout{ + anchors.fill: parent + Label{ + text: "最小级别" + } + ComboBox{ + spacing: 0 + model: [1,2,3,4,5,6,7,8,9,10] + Layout.preferredWidth: 70 + Layout.preferredHeight: 25 + } + Label{ + text: "最大级别" + } + ComboBox{ + model: [10,11,12,13,14,15,16,17,18,19,20] + Layout.preferredWidth: 70 + Layout.preferredHeight: 25 + } + } + } + + Rectangle{ + Layout.topMargin: 10 + Layout.fillWidth: true + Layout.preferredHeight: 40 + radius: 8 + color: "transparent" + Rectangle{ + anchors.top: parent.top + width: parent.width + height: 1 + color: Qt.rgba(216/255,216/255,216/255, 0.1) + } + Row{ + anchors.fill: parent + Label{ + text: "显示路网或叠加层" + anchors.verticalCenter: parent.verticalCenter + } + Switch { + anchors.right: parent.right + text: "" + checked: true + FluentUI.primaryColor: "#77ED8B" + anchors.verticalCenter: parent.verticalCenter + } + } + } + + Rectangle{ + Layout.topMargin: 10 + Layout.fillWidth: true + Layout.preferredHeight: 40 + radius: 8 + color: "transparent" + Rectangle{ + anchors.top: parent.top + width: parent.width + height: 1 + color: Qt.rgba(216/255,216/255,216/255, 0.1) + } + Row{ + anchors.fill: parent + Label{ + text: "阴影" + anchors.verticalCenter: parent.verticalCenter + } + Switch { + anchors.right: parent.right + text: "" + checked: true + FluentUI.primaryColor: "#77ED8B" + anchors.verticalCenter: parent.verticalCenter + } + } + } + + Rectangle{ + Layout.topMargin: 10 + Layout.fillWidth: true + Layout.preferredHeight: 40 + radius: 8 + color: "transparent" + Rectangle{ + anchors.top: parent.top + width: parent.width + height: 1 + color: Qt.rgba(216/255,216/255,216/255, 0.1) + } + Row{ + anchors.fill: parent + Label{ + text: "大字体模式" + anchors.verticalCenter: parent.verticalCenter + } + Switch { + anchors.right: parent.right + text: "" + checked: false + FluentUI.primaryColor: "#77ED8B" + anchors.verticalCenter: parent.verticalCenter + } + } + } + + + } + } + } + Rectangle{ + Layout.fillWidth: true + Layout.fillHeight: true + color: 'blue' + } + + Rectangle{ + Layout.fillWidth: true + Layout.fillHeight: true + color: 'cyan' + } + } +} diff --git a/Gallery/res/qml/component/RightComponentInfo.qml b/Gallery/res/qml/component/RightComponentInfo.qml index 3dc84ac..5e99acf 100644 --- a/Gallery/res/qml/component/RightComponentInfo.qml +++ b/Gallery/res/qml/component/RightComponentInfo.qml @@ -88,6 +88,7 @@ Item { Layout.fillWidth: true Layout.fillHeight: true onIconChanged: function(data) { + data.id = com_design.entityId control.iconChanged(data) } onTextChanged: function(data) { diff --git a/Gallery/res/qml/component/RightMainIntro.qml b/Gallery/res/qml/component/RightMainIntro.qml new file mode 100644 index 0000000..e9c1f4a --- /dev/null +++ b/Gallery/res/qml/component/RightMainIntro.qml @@ -0,0 +1,595 @@ +import QtQuick 2.15 +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt.labs.qmlmodels +import Qt5Compat.GraphicalEffects + +import "base" + +ColumnLayout { + id: control + signal clickSee(var data); + + property var show_type: "card" + property var show_banner: true + property var show_tab: true + + anchors.fill: parent + // 头部banner + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 160 + color: "transparent" + visible: show_banner + RowLayout{ + anchors.fill: parent + spacing: 20 + Rectangle{ + Layout.preferredHeight: 80 + Layout.preferredWidth: 80 + radius: 40 + layer.enabled: true + layer.effect: OpacityMask{ + maskSource: Rectangle{ + width: 80 + height: 80 + radius: 40 + } + } + Layout.leftMargin: 30 + Image{ + anchors.fill: parent + source: "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg" + clip: true + } + } + Rectangle{ + Layout.fillWidth: true + Layout.fillHeight: true + color: "transparent" + + ColumnLayout{ + anchors.fill: parent + Item{ + height: 50 + RowLayout{ + Layout.fillWidth: true + Layout.fillHeight: true + Label{ + id: lbl_name + text: "公司名称" + font.pointSize: 16 + visible: false + } + LinearGradient { + Layout.preferredHeight: lbl_name.height + Layout.preferredWidth: lbl_name.width + source: lbl_name + start: Qt.point(0, 0) + end: Qt.point(lbl_name.width, 0) + gradient: Gradient { + GradientStop { position: 0.0; color: "#5BE49B" } + GradientStop { position: 1.0; color: "#00A76F" } + } + } + Rectangle{ + Layout.preferredWidth: 56 + Layout.preferredHeight: 24 + Layout.leftMargin: 10 + color: "#4D4D4D" + radius: 5 + Label{ + text: "免费版" + anchors.centerIn: parent + } + } + } + RowLayout{ + anchors.top: parent.top + anchors.topMargin: 35 + Label{ + text: "下一代新能源创新团队" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + } + } + } + } + } + Rectangle{ + Layout.preferredWidth: 230 + Layout.fillHeight: true + color: "transparent" + RowLayout{ + anchors.fill: parent + Rectangle{ + Layout.preferredWidth: 97 + Layout.preferredHeight: 36 + color: Qt.rgba(255/255,255/255,255/255, 0.1) + radius: 5 + RowLayout{ + anchors.fill: parent + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/user_add.png" + // anchors.left: parent.left + Layout.leftMargin: 6 + } + + Label{ + text: "邀请成员" + Layout.leftMargin: 0 + } + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = Qt.rgba(255/255,255/255,255/255, 0.2) + onExited: parent.color = Qt.rgba(255/255,255/255,255/255, 0.1) + } + } + + Rectangle{ + Layout.preferredWidth: 97 + Layout.preferredHeight: 36 + color: Qt.rgba(255/255,255/255,255/255, 0.1) + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + + radius: 5 + RowLayout{ + anchors.fill: parent + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/plus.png" + // anchors.left: parent.left + // anchors.leftMargin: 10 + Layout.leftMargin: 5 + } + + Label{ + text: "添加项目" + color: "#2a2a2a" + // anchors.left: parent.left + // anchors.leftMargin: 32 + // anchors.top: parent.top + // anchors.topMargin: 9 + } + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.gradient.stops[1].color = "#77ED8B" + onExited: parent.gradient.stops[1].color = "#22C55E" + onClicked: { + console.log("open") + dia_newproject.open() + } + } + } + } + } + } + } + + + + ListModel{ + id: radio_type + ListElement{ + uuid: "1" + title: "通用" + icon: "qrc:/qt/qml/Gallery/res/image/components/ico_tp_com.png" + } + ListElement{ + uuid: "2" + title: "充换电" + icon: "qrc:/qt/qml/Gallery/res/image/components/ico_tp_ele.png" + } + ListElement{ + uuid: "3" + title: "加氢制氢" + icon: "qrc:/qt/qml/Gallery/res/image/components/ico_tp_h2.png" + } + ListElement{ + uuid: "4" + title: "车辆管理" + icon: "qrc:/qt/qml/Gallery/res/image/components/ico_tp_car.png" + } + } + + ListModel{ + id: style_type + ListElement{ + uuid: "1" + title: "风格1" + } + ListElement{ + uuid: "2" + title: "风格2" + } + ListElement{ + uuid: "3" + title: "风格3" + } + } + + // 新建项目弹框 + MyDialogWindow { + id: dia_newproject + + property var cur_type: "1" + + title: "新建项目" + Rectangle { + implicitWidth: 610 + implicitHeight: 390 + color: "transparent" + ColumnLayout{ + anchors.fill: parent + anchors.leftMargin: 10 + anchors.topMargin: 10 + anchors.rightMargin: 10 + RowLayout{ + spacing: 20 + Layout.fillWidth: true + TextBox{ + Layout.preferredWidth: 400 + Layout.preferredHeight: 44 + placeholderText: "标题" + } + ComboBox{ + Layout.preferredWidth: 170 + Layout.preferredHeight: 44 + model: ListModel { + ListElement { text: "充换电" } + ListElement { text: "制加氢" } + ListElement { text: "车辆" } + } + } + } + + Label{ + Layout.topMargin: 15 + text: "选择项目类型：" + color: "#9E9E9E" + } + + IconRadioGroup{ + models: radio_type + } + + RowLayout{ + Layout.topMargin: 50 + Label{ + text: "选择地图风格：" + color: "#9E9E9E" + } + Switch { + text: "" + checked: true + FluentUI.primaryColor: "#77ED8B" + } + } + + RowLayout{ + spacing: 20 + Layout.fillWidth: true + Repeater { + model: style_type + StyleButton{ + p_txt: model.title + p_check: dia_newproject.cur_type == model.uuid + onClicked: { + dia_newproject.cur_type = model.uuid + } + } + } + } + + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 70 + color: "#1b1b1b" + Layout.topMargin: 10 + Layout.leftMargin: -20 + Layout.rightMargin: -20 + Layout.bottomMargin: 0 + RowLayout{ + anchors.fill: parent + anchors.leftMargin: 20 + anchors.rightMargin: 20 + spacing: 20 + Button{ + Layout.fillWidth: true + Layout.preferredHeight: 36 + text: "取消" + onClicked: { + dia_newproject.close() + } + } + Button{ + Layout.fillWidth: true + Layout.preferredHeight: 36 + text: "确认" + highlighted: true + background: Rectangle{ + radius: 5 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + } + } + } + } + + Item{ + Layout.fillHeight: true + } + } + } + } + + // 标签切换！！！ + ListModel{ + id: tab_model + ListElement{ + title: "全部" + } + ListElement{ + title: "成员" + } + ListElement{ + title: "设置" + } + ListElement{ + title: "回收站" + } + } + + // tabs + Rectangle{ + visible: show_tab + Layout.leftMargin: 30 + Layout.rightMargin: 30 + Layout.fillWidth: true + Layout.preferredHeight: 40 + color: "transparent" + MyTabBar { + anchors.fill: parent + id: bar + clip: true + bottomPadding: 0 + Repeater { + model: tab_model + MyTabButton { + id: btn_tab + text: model.title + font.pointSize: 12 + height: 33 + width: 80 + } + } + background: Rectangle { + height: 2 + width: parent.width + anchors.bottom: parent.bottom + anchors.bottomMargin: 1 + anchors.left: parent.left + anchors.leftMargin: 5 + color: '#404143' + } + } + + IconButton{ + text: "" + icon.name: control.show_type == 'list' ? FluentIcons.graph_ViewAll : FluentIcons.graph_GlobalNavButton + icon.width: 18 + icon.height: 18 + spacing: 5 + anchors.right: parent.right + anchors.top: parent.top + anchors.topMargin: 3 + onClicked: { + if (control.show_type == "list") { + control.show_type = "card" + } else { + control.show_type = 'list' + } + } + } + // FluentIcons.graph_GlobalNavButton + // FluentIcons.graph_ViewAll + } + Rectangle{ + visible: !show_tab + Layout.leftMargin: 30 + Layout.rightMargin: 30 + Layout.fillWidth: true + Layout.preferredHeight: 30 + color: "transparent" + IconButton{ + text: "" + icon.name: control.show_type == 'list' ? FluentIcons.graph_ViewAll : FluentIcons.graph_GlobalNavButton + icon.width: 18 + icon.height: 18 + spacing: 5 + anchors.right: parent.right + anchors.top: parent.top + anchors.topMargin: 3 + onClicked: { + if (control.show_type == "list") { + control.show_type = "card" + } else { + control.show_type = 'list' + } + } + } + } + + Component{ + id:comp_page + Frame{ + anchors.fill: parent + Label{ + anchors.centerIn: parent + text: modelData.title + } + } + } + + + + + ListModel{ + id: list_model + ListElement { + uuid: "0" + title: "" + company: "" + time: "" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/add.png" + } + + ListElement { + uuid: "1" + title: "赋新站25年1月计费（充电）" + company: "绿电智联（浙江）数据科技有限公司" + time: "2025-01-05 12:00:00" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/map.png" + } + ListElement { + uuid: "2" + title: "河津站" + company: "绿电智联（浙江）数据科技有限公司" + time: "2025-01-05 12:00:00" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/map.png" + } + ListElement { + uuid: "2" + title: "河津站" + company: "绿电智联（浙江）数据科技有限公司" + time: "2025-01-05 12:00:00" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/map.png" + } + ListElement { + uuid: "2" + title: "河津站" + company: "绿电智联（浙江）数据科技有限公司" + time: "2025-01-05 12:00:00" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/map.png" + } + ListElement { + uuid: "2" + title: "河津站" + company: "绿电智联（浙江）数据科技有限公司" + time: "2025-01-05 12:00:00" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/map.png" + } + ListElement { + uuid: "2" + title: "河津站" + company: "绿电智联（浙江）数据科技有限公司" + time: "2025-01-05 12:00:00" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/map.png" + } + ListElement { + uuid: "2" + title: "河津站" + company: "绿电智联（浙江）数据科技有限公司" + time: "2025-01-05 12:00:00" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/map.png" + } + ListElement { + uuid: "2" + title: "河津站" + company: "绿电智联（浙江）数据科技有限公司" + time: "2025-01-05 12:00:00" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/map.png" + } + ListElement { + uuid: "2" + title: "河津站" + company: "绿电智联（浙江）数据科技有限公司" + time: "2025-01-05 12:00:00" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/map.png" + } + ListElement { + uuid: "2" + title: "河津站" + company: "绿电智联（浙江）数据科技有限公司" + time: "2025-01-05 12:00:00" + desc: "" + img: "qrc:/qt/qml/Gallery/res/image/img/map.png" + } + } + + Rectangle{ + Layout.fillWidth: true + Layout.fillHeight: true + color: "transparent" + StackLayout { + anchors.fill: parent + anchors.leftMargin: 30 + anchors.rightMargin: 30 + anchors.bottomMargin: 20 + currentIndex: bar.currentIndex + + // 主内容区域 + ProjectList{ + id: pl_com + show_type: control.show_type + p_data: list_model + p_cellW: { + var width1 = parent.width / 4 + var width2 = parent.width / 3 + var width3 = parent.width / 2 + + if (width1 < 290) { + if (width2 < 180) { + return width3 + } + return width2 + } + return width1 + } + + p_cellH: pl_com.p_cellW * 0.8 + + onClickItem: function(item) { + control.clickSee(item) + } + onClickNewItem: function() { + dia_newproject.open() + } + } + + + Rectangle{ + color: "yellow" + } + Rectangle{ + color: "blue" + } + Rectangle{ + color: "cyan" + } + } + } + + +} diff --git a/Gallery/res/qml/component/SearchRoute.qml b/Gallery/res/qml/component/SearchRoute.qml new file mode 100644 index 0000000..84cabd7 --- /dev/null +++ b/Gallery/res/qml/component/SearchRoute.qml @@ -0,0 +1,399 @@ +import QtQuick 2.15 +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt.labs.qmlmodels +import Qt5Compat.GraphicalEffects + +import "base" +import "nav" +ColumnLayout { + id: control + + property var p_show_nav: false + property var p_nav_type: 'car' + + Rectangle{ + id: search_bar + // Layout.fillWidth: true + Layout.preferredWidth: 350 + Layout.preferredHeight: 55 + color: Qt.rgba(0/255,0/255,0/255, 0.5) + radius: 10 + + Rectangle{ + width: parent.width - 20 - 42 + anchors.left: parent.left + anchors.leftMargin: 10 + anchors.verticalCenter: parent.verticalCenter + height: 32 + color: '#000' + TextBox{ + id: tb_searcn + anchors.fill: parent + placeholderText: "请输入图层名称" + trailing: IconButton{ + implicitWidth: 30 + implicitHeight: 20 + icon.name: FluentIcons.graph_Search + icon.width: 14 + icon.height: 14 + padding: 0 + } + background: InputBackground { + implicitWidth: 200 + implicitHeight: 32 + activeColor: "#22C55E" + radius: 0 + color: { + if(!tb_searcn.enabled){ + return tb_searcn.FluentUI.theme.res.controlFillColorDisabled + }else if(tb_searcn.activeFocus){ + return tb_searcn.FluentUI.theme.res.controlFillColorInputActive + }else if(tb_searcn.hovered){ + return tb_searcn.FluentUI.theme.res.controlFillColorSecondary + }else{ + return tb_searcn.FluentUI.theme.res.controlFillColorDefault + } + } + target: tb_searcn + } + } + } + + Rectangle{ + id: btn_search + width: 32 + height: 32 + radius: 8 + anchors.right: parent.right + anchors.rightMargin: 10 + anchors.verticalCenter: parent.verticalCenter + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: control.p_show_nav ? "#77ED8B" : Qt.rgba(255/255,255/255,255/255, 0.05) } + GradientStop { position: 1.0; color: control.p_show_nav ? "#22C55E" : Qt.rgba(255/255,255/255,255/255, 0.05) } + } + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/ico_route.png" + anchors.centerIn: parent + ColorOverlay{ + id: co_img + anchors.fill: parent + color: "#2a2a2a" + source: parent + visible: false + } + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + if (!control.p_show_nav) { + parent.gradient.stops[0].color = "#77ED8B" + parent.gradient.stops[1].color = "#22C55E" + co_img.visible = true + } + } + onExited: { + if (!control.p_show_nav) { + parent.gradient.stops[0].color = Qt.rgba(255/255,255/255,255/255, 0.05) + parent.gradient.stops[1].color = Qt.rgba(255/255,255/255,255/255, 0.05) + co_img.visible = false + } + } + onClicked: { + console.log("open") + control.p_show_nav = !control.p_show_nav + } + } + } + } + + ListModel{ + id: key_point_model + ListElement{ + p_txt: "起" + p_tip_txt: "请输入起点" + p_del: false + } + ListElement{ + p_txt: "终" + p_tip_txt: "请输入终点" + p_del: false + } + } + + Item{ + // Layout.fillWidth: true + id: it_height + Layout.preferredWidth: 350 + Layout.fillHeight: true + Layout.topMargin: 0 + clip: true + visible: control.p_show_nav + + Rectangle{ + id: result_panel + color: "transparent"//Qt.rgba(0/255,0/255,0/255, 0.5)//Qt.rgba(255/255,255/255,255/255, 0.05) + radius: 10 + width: parent.width + height: { + console.log(it_input.height + "--" + parent.height) + return it_input.implicitHeight + tp_container.implicitHeight + cl_ranges.height + 80 + 30 + 25// + cl_detail.height + } + + Rectangle{ + id: blur_bg + anchors.fill: parent + color: Qt.rgba(0/255,0/255,0/255, 0.5) + radius: 10 + } + + // layer.effect: ShaderEffect { + // id: effectSource + // anchors.fill: parent + + // FastBlur{ + // id: blur + // anchors.fill: blur_bg + // source: blur_bg + // radius: 32 + // } + // } + + // FastBlur{ + // anchors.fill: parent + // source: blur_bg + // radius: 64 + // } + + ColumnLayout{ + id: cl_container + width: parent.width + spacing: 10 + Item{ + Layout.preferredHeight: 40 + Layout.preferredWidth: result_panel.width + RowLayout{ + id: tp_container + width: 140 + anchors.centerIn: parent + spacing: 10 + MyImgButton{ + p_img: "nav_car.png" + p_checked: control.p_nav_type === 'car' ? true : false + onClickItem: control.p_nav_type = 'car' + } + MyImgButton{ + p_img: "nav_truck.png" + p_checked: control.p_nav_type === 'truck' ? true : false + onClickItem: control.p_nav_type = 'truck' + } + MyImgButton{ + p_img: "nav_walk.png" + p_checked: control.p_nav_type === 'walk' ? true : false + onClickItem: control.p_nav_type = 'walk' + } + MyImgButton{ + p_img: "nav_bike.png" + p_checked: control.p_nav_type === 'bike' ? true : false + onClickItem: control.p_nav_type = 'bike' + } + } + } + + Item{ + Layout.preferredHeight: key_point_model.count * 30 + (key_point_model.count - 1) * 10 + Layout.preferredWidth: result_panel.width + RowLayout{ + id: it_input + anchors.fill: parent + + Item{ + Layout.leftMargin: 8 + width: 22 + Layout.preferredHeight: parent.height + Image{ + anchors.centerIn: parent + source: "qrc:/qt/qml/Gallery/res/image/components/map/ico_exchange.png" + ColorOverlay{ + id: img_ex + anchors.fill: parent + color: "#77ED8B" + source: parent + visible: false + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + img_ex.visible = true + } + onExited: { + img_ex.visible = false + } + onClicked: { + console.log("open") + } + } + } + } + + ColumnLayout{ + Layout.preferredWidth: result_panel.width - 60 + spacing: 10 + + Repeater { + model: key_point_model + SearchInput { + p_txt: model.p_txt + p_tip_txt: model.p_tip_txt + p_del: model.p_del + onClickClose: { + key_point_model.remove(index, 1) + } + } + } + } + + + Item{ + width: 22 + height: parent.height + Layout.rightMargin: 8 + Image{ + anchors.centerIn: parent + source: "qrc:/qt/qml/Gallery/res/image/components/map/ico_plus.png" + ColorOverlay{ + id: img_plus + anchors.fill: parent + color: "#77ED8B" + source: parent + visible: false + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + img_plus.visible = true + } + onExited: { + img_plus.visible = false + } + onClicked: { + key_point_model.insert(key_point_model.count - 1, { + p_txt: "途", + p_tip_txt: "请输入途径点", + p_del: true + }) + } + } + } + } + + } + } + + Item{ + Layout.preferredHeight: 30 + Layout.preferredWidth: result_panel.width + RowLayout{ + anchors.fill: parent + RadioButton { + text: "推荐方案" + checked: true + FluentUI.primaryColor: "#77ED8B" + } + RadioButton { + text: "高速优先" + checked: false + FluentUI.primaryColor: "#77ED8B" + } + RadioButton { + text: "收费最少" + checked: false + FluentUI.primaryColor: "#77ED8B" + } + } + } + + Item{ + Layout.preferredHeight: 30 + Layout.preferredWidth: result_panel.width - 20 + Layout.leftMargin: 10 + Layout.rightMargin: 10 + Layout.bottomMargin: 10 + RowLayout{ + anchors.fill: parent + spacing: 20 + Button { + Layout.fillWidth: true + Layout.fillHeight: true + text: "清除路线" + } + Button { + Layout.fillWidth: true + Layout.fillHeight: true + text: "搜索路线" + highlighted: true + background: Rectangle { + anchors.fill: parent + radius: 6 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + } + } + } + } + + + ScrollView{ + Layout.preferredWidth: 350 + Layout.preferredHeight: { + var hei = it_height.height - (it_input.implicitHeight + 156) + return hei + } + + Layout.bottomMargin: 0 + + // contentHeight: result_panel.height + + ColumnLayout{ + id: cl_ranges + anchors.left: parent.left + anchors.right: parent.right + width: result_panel.width - 20 + // anchors.leftMargin: 10 + // anchors.rightMargin: 10 + // Layout.preferredWidth: result_panel.width - 20 + RouteResult{ + p_show_detail: true + } + RouteResult{ + + } + RouteResult{ + + } + RouteResult{ + + } + } + } + + + } + } + + } + Item{ + visible: !control.p_show_nav + Layout.fillWidth: true + Layout.fillHeight: true + } +} diff --git a/Gallery/res/qml/component/ToolBar.qml b/Gallery/res/qml/component/ToolBar.qml index d88bd8b..c04b439 100644 --- a/Gallery/res/qml/component/ToolBar.qml +++ b/Gallery/res/qml/component/ToolBar.qml @@ -4,6 +4,7 @@ import QtQuick.Layouts import QtQuick.Controls import FluentUI.Controls import FluentUI.impl +import "base" Item { id: control @@ -11,8 +12,11 @@ Item { anchors.topMargin: 0 anchors.leftMargin: 10 Rectangle{ - anchors.fill: parent - color: '#272727' + height: 42 + width: parent.width + radius: 5 + // anchors.fill: parent + color: Qt.rgba(255/255,255/255,255/255, 0.05) Menu { id:menu @@ -51,9 +55,10 @@ Item { spacing: 5 IconButton{ - icon.name: FluentIcons.graph_GlobalNavButton - icon.width: 16 - icon.height: 16 + // icon.name: FluentIcons.graph_OEM + icon.source: "qrc:/qt/qml/Gallery/res/image/components/tb_menu.png" + icon.width: 12 + icon.height: 13 topPadding: 10 //bottomPadding Layout.leftMargin: 5 Layout.preferredHeight: 30 @@ -65,15 +70,16 @@ Item { } Rectangle{ - Layout.minimumWidth: parent.width / 3 + Layout.minimumWidth: 300 Layout.preferredHeight: parent.height Layout.leftMargin: 10 color: "transparent" - Breadcrumb { + MyBreadcrumb { id: breadCrumb - items: [{title: "充换电"}, {title: "耳字壕充换电站规划"}] - width: parent.width + anchors.fill: parent + moreSize: 14 + items: [{title: "充换电"}, {title: "河津一号充换电站设计", children: [{title: "河津一号充换电站设计"},{title: "河津一号充换电站设计2"}]}] anchors.verticalCenter: parent.verticalCenter onClickItem: (model)=>{ showSuccess(model.title) @@ -81,6 +87,107 @@ Item { } } + Menu { + id:menu_line + width: 140 + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/curve.png" + m_text: "曲线" + m_key: "P" + m_width: 16 + m_height: 16 + onClickItem: { + // control.clickItem("StartAddPoint") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/free_line.png" + m_text: "自由线" + m_key: "P" + m_width: 16 + m_height: 16 + onClickItem: { + // control.clickItem("StartAddPoint") + } + } + background: Rectangle{ + width: 146 + color: "#191919" + radius: 8 + x: -3 + } + } + + Menu { + id:menu_area + width: 140 + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/polygon.png" + m_text: "多边形" + m_key: "D" + onClickItem: { + control.clickItem("StartAddPoly") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/triangle.png" + m_text: "三角形" + m_key: "T" + onClickItem: { + control.clickItem("StartTriangle") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/circle.png" + m_text: "圆" + m_key: "C" + onClickItem: { + control.clickItem("StartCircle") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/ellipse.png" + m_text: "椭圆" + m_key: "E" + onClickItem: { + control.clickItem("StartEllipse") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/free_area.png" + m_text: "自由面" + m_key: "A" + onClickItem: { + control.clickItem("StartFreeSurface") + } + } + background: Rectangle{ + width: 146 + color: "#191919" + radius: 8 + x: -3 + } + } + + Menu { + id:menu_plugin + width: 140 + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/polygon.png" + m_text: "暂无" + m_key: "D" + onClickItem: { + control.clickItem("StartAddPoly") + } + } + background: Rectangle{ + width: 146 + color: "#191919" + radius: 8 + x: -3 + } + } + Rectangle{ Layout.fillWidth: true Layout.fillHeight: true @@ -89,90 +196,52 @@ Item { RowLayout{ anchors.top: parent.top anchors.bottom: parent.bottom + anchors.centerIn: parent spacing: 10 - ToggleButton{ - // FluentIcons.graph_GripperResize FluentIcons.graph_Stop - } - - ToggleButton{ - Layout.fillWidth: false - text: "点" + IconButton{ + icon.source: "qrc:/qt/qml/Gallery/res/image/components/ico_loc.png" + icon.width: 12 + icon.height: 15 + topPadding: 10 //bottomPadding + Layout.leftMargin: 5 + Layout.preferredHeight: 30 + Layout.preferredWidth: 30 onClicked: { + console.log("click") control.clickButton("StartAddPoint") } } - // ToggleButton{ - // Layout.fillWidth: false - // text: "线" - // onClicked: { - // control.clickButton("StartAddPoint") - // } - // } - ToggleButton{ - Layout.fillWidth: false - text: "曲线" - onClicked: { - control.clickButton("StartCurve") - } + + IconDropdownButton{ + p_img: "qrc:/qt/qml/Gallery/res/image/components/ico_line.png" + p_menu: menu_line + Layout.preferredWidth: 30 + Layout.preferredHeight: 30 + p_others: [menu_area, menu_plugin] } - ToggleButton{ - Layout.fillWidth: false - text: "面" - onClicked: { - control.clickButton("StartAddPoly") - } + IconDropdownButton{ + p_img: "qrc:/qt/qml/Gallery/res/image/components/ico_area.png" + p_menu: menu_area + Layout.preferredWidth: 30 + Layout.preferredHeight: 30 + p_others: [menu_line, menu_plugin] } - ToggleButton{ - Layout.fillWidth: false - text: "三角" - onClicked: { - control.clickButton("StartTriangle") - } - } - ToggleButton{ - Layout.fillWidth: false - text: "圆" - onClicked: { - control.clickButton("StartCircle") - } - } - ToggleButton{ - Layout.fillWidth: false - text: "椭圆" - onClicked: { - control.clickButton("StartEllipse") - } - } - ToggleButton{ - Layout.fillWidth: false - text: "自由线" - onClicked: { - control.clickButton("StartFreeLine") - } - } - ToggleButton{ - Layout.fillWidth: false - text: "自由面" - onClicked: { - control.clickButton("StartFreeSurface") - } + IconDropdownButton{ + p_img: "qrc:/qt/qml/Gallery/res/image/components/ico_plugin.png" + p_menu: menu_plugin + Layout.preferredWidth: 30 + Layout.preferredHeight: 30 + p_others: [menu_area, menu_line] } } } Rectangle{ - Layout.preferredWidth: 100 + Layout.preferredWidth: 300 Layout.preferredHeight: 30 color: "transparent" - // Button{ - // text: "运输仿真" - // highlighted: true - // onClicked: { - // WindowRouter.go("/sim",{type:"WindowType.Standard"}) - // } - // } } } diff --git a/Gallery/res/qml/component/base/AnchorChoose.qml b/Gallery/res/qml/component/base/AnchorChoose.qml new file mode 100644 index 0000000..f43b431 --- /dev/null +++ b/Gallery/res/qml/component/base/AnchorChoose.qml @@ -0,0 +1,147 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl + +Rectangle{ + width: 26 + height: 26 + color: "transparent" + anchors.verticalCenter: parent.verticalCenter + Rectangle{ + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 0 + anchors.topMargin: 0 + width: 5 + height: 5 + color: Qt.rgba(216/255,216/255,216/255, 0.2) + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#ffffff" + onExited: parent.color = Qt.rgba(216/255,216/255,216/255, 0.2) + } + } + Rectangle{ + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 0 + anchors.topMargin: 10 + width: 5 + height: 5 + color: Qt.rgba(216/255,216/255,216/255, 0.2) + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#ffffff" + onExited: parent.color = Qt.rgba(216/255,216/255,216/255, 0.2) + } + } + Rectangle{ + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 0 + anchors.topMargin: 20 + width: 5 + height: 5 + color: Qt.rgba(216/255,216/255,216/255, 0.2) + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#ffffff" + onExited: parent.color = Qt.rgba(216/255,216/255,216/255, 0.2) + } + } + Rectangle{ + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 10 + anchors.topMargin: 0 + width: 5 + height: 5 + color: Qt.rgba(216/255,216/255,216/255, 0.2) + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#ffffff" + onExited: parent.color = Qt.rgba(216/255,216/255,216/255, 0.2) + } + } + Rectangle{ + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 10 + anchors.topMargin: 10 + width: 5 + height: 5 + color: Qt.rgba(216/255,216/255,216/255, 0.2) + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#ffffff" + onExited: parent.color = Qt.rgba(216/255,216/255,216/255, 0.2) + } + } + Rectangle{ + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 10 + anchors.topMargin: 20 + width: 5 + height: 5 + color: Qt.rgba(216/255,216/255,216/255, 0.2) + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#ffffff" + onExited: parent.color = Qt.rgba(216/255,216/255,216/255, 0.2) + } + } + Rectangle{ + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 20 + anchors.topMargin: 0 + width: 5 + height: 5 + color: Qt.rgba(216/255,216/255,216/255, 0.2) + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#ffffff" + onExited: parent.color = Qt.rgba(216/255,216/255,216/255, 0.2) + } + } + Rectangle{ + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 20 + anchors.topMargin: 10 + width: 5 + height: 5 + color: Qt.rgba(216/255,216/255,216/255, 0.2) + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#ffffff" + onExited: parent.color = Qt.rgba(216/255,216/255,216/255, 0.2) + } + } + Rectangle{ + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 20 + anchors.topMargin: 20 + width: 5 + height: 5 + color: Qt.rgba(216/255,216/255,216/255, 0.2) + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = "#ffffff" + onExited: parent.color = Qt.rgba(216/255,216/255,216/255, 0.2) + } + } +} diff --git a/Gallery/res/qml/component/base/AttachmenButton.qml b/Gallery/res/qml/component/base/AttachmenButton.qml new file mode 100644 index 0000000..68ff4d6 --- /dev/null +++ b/Gallery/res/qml/component/base/AttachmenButton.qml @@ -0,0 +1,97 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt5Compat.GraphicalEffects + +Item{ + id: control + + property var p_btnChoose: true + property var p_btnClear: true + property var p_label: "" + property var p_title: "" + + signal clickItem() + + Layout.preferredWidth: 100 + Layout.preferredHeight: 136 + Label{ + text: control.p_label + color: Qt.rgba(255/255,255/255,255/255, 0.6) + } + Rectangle{ + width: 96 + height: 96 + anchors.top: parent.top + anchors.topMargin: 20 + color: Qt.rgba(255/255,255/255,255/255, 0.1) + radius: 10 + + Image{ + source: "qrc:/qt/qml/Gallery/res/image/icons/dw.png" + anchors.centerIn: parent + width: 40 + fillMode: Image.PreserveAspectFit + } + + Rectangle{ + id: mb_icon + radius: 10 + z: 10 + border.color: Qt.rgba(255/255,255/255,255/255, 0.1) + border.width: 1 + anchors.fill: parent + color: Qt.rgba(0/255,0/255,0/255, 0.6) + visible: false + Item{ + width: 70 + height: 60 + anchors.centerIn: parent + ColumnLayout{ + anchors.fill: parent + Button{ + visible: control.p_btnChoose + Layout.preferredWidth: parent.width + text: "重新选择" + background: Rectangle { + color: Qt.rgba(255/255,255/255,255/255, 0.3) + radius: 5 + } + onClicked: { + control.clickItem() + } + } + Button{ + visible: control.p_btnClear + Layout.preferredWidth: parent.width + text: "清除" + background: Rectangle { + color: Qt.rgba(255/255,255/255,255/255, 0.3) + radius: 5 + } + } + } + } + } + + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + mb_icon.visible = true + } + onExited: { + mb_icon.visible = false + } + } + } + Label{ + width: parent.width - 10 + anchors.bottom: parent.bottom + anchors.horizontalCenter: parent.horizontalCenter + text: control.p_title + elide: Text.ElideRight + } +} diff --git a/Gallery/res/qml/component/base/BaseMenuItem.qml b/Gallery/res/qml/component/base/BaseMenuItem.qml new file mode 100644 index 0000000..4bfbec2 --- /dev/null +++ b/Gallery/res/qml/component/base/BaseMenuItem.qml @@ -0,0 +1,88 @@ +import QtQuick 2.15 +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt5Compat.GraphicalEffects + +MenuItem{ + id: mt + + property var m_icon; + property var m_text; + property var m_key; + property var show_key: true + property var show_img: true + property var m_width: 14 + property var m_height: 14 + property var m_hover: true + signal clickItem(var type) + + contentItem: Rectangle { + anchors.fill: parent + color: 'transparent' + Image{ + anchors{ + left: parent.left + leftMargin: 10 + } + anchors.verticalCenter: parent.verticalCenter + width: mt.m_width + height: mt.m_height + source: mt.m_icon + visible: mt.show_img + ColorOverlay{ + anchors.fill: parent + color: "#2a2a2a" + source: parent + visible: mt.m_hover && mt.highlighted + } + } + Label{ + text: mt.m_text + color: mt.highlighted ? "#2a2a2a" : "#cccccc" + anchors{ + left: parent.left + leftMargin: 30 + (mt.m_width - 14) + } + anchors.verticalCenter: parent.verticalCenter + } + Rectangle{ + anchors{ + right: parent.right + top: parent.top + rightMargin: 10 + topMargin: 9 + } + width: 16 + height: 16 + color: show_key ? mt.highlighted ? Qt.rgba(0/255,0/255,0/255, 0.2) : Qt.rgba(255/255,255/255,255/255, 0.2): "transparent" + radius: 3 + Label{ + anchors.right: parent.right + anchors.rightMargin: 5 + text: mt.m_key + color: mt.highlighted ? "#2a2a2a" : "#888" + font.pointSize: 9 + anchors.centerIn: parent + } + } + } + background: Rectangle { + anchors.fill: parent + anchors.leftMargin: 5 + anchors.rightMargin: 5 + anchors.bottomMargin: 4 + anchors.topMargin: 4 + radius: 5 + color: mt.down ? "#77ED8B" : mt.highlighted ? "#77ED8B" : "transparent" + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: mt.highlighted ? "#77ED8B" : "transparent" } + GradientStop { position: 1.0; color: mt.highlighted ? "#22C55E" : "transparent" } + } + } + onClicked: { + mt.clickItem("") + } +} diff --git a/Gallery/res/qml/component/base/CommonTitle.qml b/Gallery/res/qml/component/base/CommonTitle.qml new file mode 100644 index 0000000..b6c248d --- /dev/null +++ b/Gallery/res/qml/component/base/CommonTitle.qml @@ -0,0 +1,23 @@ +import QtQuick 2.15 +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls + +Item{ + property var p_title: "" + + Layout.preferredWidth: parent.width + Layout.preferredHeight: 35 + Rectangle{ + anchors.top: parent.top + width: parent.width + height: 1 + color: Qt.rgba(216/255,216/255,216/255, 0.1) + } + Label{ + text: p_title + font.pointSize: 12 + anchors.top: parent.top + anchors.topMargin: 8 + } +} diff --git a/Gallery/res/qml/component/base/IconDropdownButton.qml b/Gallery/res/qml/component/base/IconDropdownButton.qml index a8ea5ca..0dfff11 100644 --- a/Gallery/res/qml/component/base/IconDropdownButton.qml +++ b/Gallery/res/qml/component/base/IconDropdownButton.qml @@ -6,16 +6,141 @@ import FluentUI.impl Rectangle { id: control - anchors.fill: parent color: "transparent" + radius: 5 + property var p_img: "qrc:/qt/qml/Gallery/res/image/components/rect.png" + property var p_menu + property var p_others: [] + + signal clickItem(var type) + + Image{ + width: 15 + height: 15 + source: p_img + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter + } + + Image{ + width: 5 + height: 5 + source: "qrc:/qt/qml/Gallery/res/image/components/down.png" + anchors.right: parent.right + anchors.bottom: parent.bottom + anchors.rightMargin: 3 + anchors.bottomMargin: 3 + } MouseArea { anchors.fill: parent hoverEnabled: true - onEntered: parent.color = "#000000" + onEntered: parent.color = "#424242" onExited: parent.color = "transparent" - onClicked: { - console.log("123123") + } + + Menu { + id:menu + width: 140 + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/point.png" + m_text: "点" + m_key: "P" + m_width: 16 + m_height: 16 + onClickItem: { + control.clickItem("StartAddPoint") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/curve.png" + m_text: "曲线" + m_key: "Q" + onClickItem: { + control.clickItem("StartCurve") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/polygon.png" + m_text: "多边形" + m_key: "D" + onClickItem: { + control.clickItem("StartAddPoly") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/triangle.png" + m_text: "三角形" + m_key: "T" + onClickItem: { + control.clickItem("StartTriangle") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/circle.png" + m_text: "圆" + m_key: "C" + onClickItem: { + control.clickItem("StartCircle") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/ellipse.png" + m_text: "椭圆" + m_key: "E" + onClickItem: { + control.clickItem("StartEllipse") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/free_line.png" + m_text: "自由线" + m_key: "L" + onClickItem: { + control.clickItem("StartFreeLine") + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/free_area.png" + m_text: "自由面" + m_key: "A" + onClickItem: { + control.clickItem("StartFreeSurface") + } + } + + } + + Rectangle{ + anchors.right: parent.right + anchors.bottom: parent.bottom + anchors.rightMargin: 4 + anchors.bottomMargin: 4 + width: 8 + height: 8 + color: "transparent" + MouseArea { + anchors.fill: parent + hoverEnabled: true + onExited: { + } + onEntered: { + if (!p_menu) { + for (var d of p_others) { + d.close() + } + menu.popup(control) + menu.x = -50 + menu.y = 30 + } else { + for (var d of p_others) { + d.close() + } + p_menu.popup(control) + p_menu.x = -50 + p_menu.y = 30 + } + } } } } diff --git a/Gallery/res/qml/component/base/IconRadioGroup.qml b/Gallery/res/qml/component/base/IconRadioGroup.qml new file mode 100644 index 0000000..3ab1cba --- /dev/null +++ b/Gallery/res/qml/component/base/IconRadioGroup.qml @@ -0,0 +1,36 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl + +RowLayout{ + id: control + property var models + property var cur: "1" + + Repeater { + model: control.models + Item{ + Layout.fillWidth: true + RowLayout{ + RadioButton { + text: model.title + checked: model.uuid == cur + FluentUI.primaryColor: "#77ED8B" + onClicked: { + control.cur = model.uuid + } + } + Image{ + source: model.icon + Layout.preferredHeight: 15 + Layout.preferredWidth: 15 + } + } + } + } + + + +} diff --git a/Gallery/res/qml/component/base/MyBreadcrumb.qml b/Gallery/res/qml/component/base/MyBreadcrumb.qml new file mode 100644 index 0000000..63a3130 --- /dev/null +++ b/Gallery/res/qml/component/base/MyBreadcrumb.qml @@ -0,0 +1,210 @@ +import QtQuick +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl + +Item{ + id:control + FluentUI.theme: Theme.of(control) + property Component separator: comp_separator + property var items: [] + property int spacing: 10 + property int moreSpacing: 0 + property font font: Typography.body + property int moreSize: 24 + property string textRole: "title" + property var lastWidth: 0 + signal clickItem(var model) + height: 30 + onItemsChanged: { + d.cacheItems = [] + list_model.clear() + list_model.append(items) + } + Component{ + id: comp_separator + Icon{ + source: FluentIcons.graph_ChevronRightMed + implicitHeight: 14 + implicitWidth: 14 + color: control.FluentUI.theme.res.textFillColorTertiary + } + } + ListModel{ + id:list_model + } + QtObject{ + id: d + property var cacheItems: [] + onCacheItemsChanged: { + list_view.leftMargin = -cacheItems.reduce((sum, item) => sum + item.width, 0) + } + } + + RowLayout { + anchors.fill: parent + spacing: 0 + IconButton{ + id: btn_more + icon.name: FluentIcons.graph_More + icon.width: control.moreSize + icon.height: control.moreSize + Layout.preferredWidth: visible ? control.moreSize : 0 + Layout.fillHeight: true + visible: d.cacheItems.length !== 0 + background: Item{} + onClicked: { + loader_menu.sourceComponent = comp_menu + } + FluentUI.textColor: { + if(btn_more.hovered){ + return control.FluentUI.theme.res.textFillColorPrimary + } + return control.FluentUI.theme.res.textFillColorTertiary + } + } + Item{ + implicitWidth: visible ? control.moreSpacing : 0 + Layout.fillHeight: true + visible: btn_more.visible + } + ListView{ + id:list_view + Layout.fillWidth: true + Layout.fillHeight: true + orientation: ListView.Horizontal + model: list_model + clip: true + spacing: 0 + interactive: false + boundsBehavior: ListView.StopAtBounds + cacheBuffer: 65535 + delegate: Item{ + height: item_layout.height + width: item_layout.width + property var dataModel: model + property var index: model.index + property bool hide: x-list_view.contentWidth+list_view.width < 0 + property bool isLast: index === list_view.count-1 + property color textColor: { + if(item_mouse.containsMouse){ + return control.FluentUI.theme.res.textFillColorPrimary + } + return isLast ? control.FluentUI.theme.res.textFillColorPrimary : control.FluentUI.theme.res.textFillColorTertiary + } + visible: !hide + clip: true + onHideChanged: { + if(hide){ + d.cacheItems.push(this) + }else{ + var pos = d.cacheItems.indexOf(this) + if (pos > -1) { + d.cacheItems.splice(pos, 1) + } + } + d.cacheItems = d.cacheItems.sort(function(a, b){return a.index - b.index}) + } + RowLayout{ + id:item_layout + height: list_view.height + spacing: control.spacing + AutoLoader{ + sourceComponent: control.separator + Layout.leftMargin: control.spacing + Layout.alignment: Qt.AlignVCenter + visible: 0 !== index + } + Label{ + text: model[control.textRole] + font: control.font + Layout.alignment: Qt.AlignVCenter + color: textColor + MouseArea{ + id:item_mouse + anchors.fill: parent + hoverEnabled: true + onClicked: { + control.clickItem(model) + } + } + visible: !isLast + } + Label{ + id: last_txt + text: model[control.textRole] + visible: false + } + + ComboBox{ + id: cb_com + visible: isLast + model: ["河津一号充换电站设计", "河津一号充换电站设计2", "河津一号充换电站设计3"] + Layout.preferredWidth: cb_com.displayText.length * 17.7 + Layout.preferredHeight: 35 + Layout.topMargin: -1 + Layout.leftMargin: -2 + background: { + color: "transparent" + implicitWidth: last_txt.width + // { + // console.log(cb_com.displayText) + // return cb_com.displayText.length + // } + + implicitHeight: 35 + } + } + } + } + } + } + AutoLoader{ + id: loader_menu + } + Component{ + id: comp_menu + Menu{ + id: menu + Component.onCompleted: { + menu.popup() + } + onClosed:{ + loader_menu.sourceComponent = undefined + } + FluentUI.dark: control.FluentUI.dark + FluentUI.primaryColor: control.FluentUI.primaryColor + Repeater{ + model: d.cacheItems + delegate: MenuItem{ + text: { + if(modelData.dataModel){ + return modelData.dataModel.title + } + return "" + } + onClicked: { + menu.close() + control.clickItem(modelData.dataModel) + } + } + } + } + } + function remove(index,count){ + for(var i=index;i -1) { + d.cacheItems.splice(pos, 1) + } + } + d.cacheItems.sort(function(a, b){return a.index - b.index}) + list_model.remove(index,count) + } + function count(){ + return list_model.count + } +} + diff --git a/Gallery/res/qml/component/base/MyContentDialog.qml b/Gallery/res/qml/component/base/MyContentDialog.qml new file mode 100644 index 0000000..97fff63 --- /dev/null +++ b/Gallery/res/qml/component/base/MyContentDialog.qml @@ -0,0 +1,103 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import QtQuick.Templates as T +import FluentUI.Controls +import FluentUI.impl + +T.Dialog { + id: control + + FluentUI.theme: Theme.of(control) + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + contentWidth + leftPadding + rightPadding, + implicitHeaderWidth, + implicitFooterWidth) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + contentHeight + topPadding + bottomPadding + + (implicitHeaderHeight > 0 ? implicitHeaderHeight + spacing : 0) + + (implicitFooterHeight > 0 ? implicitFooterHeight + spacing : 0)) + leftPadding: 12 + rightPadding: 12 + topPadding: 12 + + FluentUI.radius: 8 + background: Rectangle { + color: control.FluentUI.theme.res.solidBackgroundFillColorQuarternary + border.color: control.FluentUI.theme.res.dividerStrokeColorDefault + radius: control.FluentUI.radius + } + enter: Transition { + ParallelAnimation{ + NumberAnimation { + property: "opacity" + from: 0.0 + to: 1.0 + duration: Theme.fasterAnimationDuration + } + NumberAnimation { + property: "scale" + from: 0.8 + to: 1.0 + duration: Theme.fastAnimationDuration + } + } + } + exit: Transition { + ParallelAnimation{ + NumberAnimation { + property: "opacity" + from: 1.0 + to: 0.0 + duration: Theme.fasterAnimationDuration + } + NumberAnimation { + property: "scale" + from: 1.0 + to: 0.8 + duration: Theme.fastAnimationDuration + } + } + } + header: Label { + text: control.title + visible: control.title + elide: Label.ElideRight + font: Typography.subtitle + leftPadding: 22 + rightPadding: 22 + topPadding: 22 + background: Rectangle { + x: 1; y: 1 + width: parent.width - 2 + height: parent.height - 1 + color: "transparent" //control.FluentUI.theme.res.solidBackgroundFillColorQuarternary + radius: control.FluentUI.radius + + IconButton{ + anchors.top: parent.top + anchors.right: parent.right + anchors.topMargin: 12 + anchors.rightMargin: 15 + implicitWidth: 25 + implicitHeight: 25 + icon.name: FluentIcons.graph_ChromeClose + icon.width: 12 + icon.height: 12 + padding: 0 + onClicked: { + control.close() + } + } + } + } + footer: DialogButtonBox { + visible: count > 0 + } + T.Overlay.modal: Rectangle { + color: Colors.withOpacity(Colors.black, 0.3) + } + T.Overlay.modeless: Rectangle { + color: Colors.withOpacity(Colors.black, 0.15) + } +} diff --git a/Gallery/res/qml/component/base/MyDialogWindow.qml b/Gallery/res/qml/component/base/MyDialogWindow.qml new file mode 100644 index 0000000..7a236bf --- /dev/null +++ b/Gallery/res/qml/component/base/MyDialogWindow.qml @@ -0,0 +1,58 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl + +Window { + id: control + default property alias content: content_dialog.contentData + property alias dialog: content_dialog + property alias standardButtons: content_dialog.standardButtons + flags: Qt.FramelessWindowHint | Qt.Window + visible: dialog.visible + width: content_dialog.implicitWidth + height: content_dialog.implicitHeight + FluentUI.radius: 8 + FluentUI.theme: Theme.of(control) + FluentUI.dark: Theme.dark + FluentUI.primaryColor: Theme.primaryColor + color: Colors.transparent + MyContentDialog{ + id: content_dialog + title: control.title + background: Rectangle { + color: "#191919" + radius: 8 + Rectangle{ + anchors.fill: parent + anchors.leftMargin: 10 + anchors.rightMargin: 10 + anchors.topMargin: 10 + anchors.bottomMargin: 10 + color: "#282828" + border.color: control.FluentUI.theme.res.dividerStrokeColorDefault + radius: 8 + Rectangle{ + width: parent.width + height: 50 + color: "transparent" + MouseArea{ + anchors.fill: parent + cursorShape: Qt.SizeAllCursor + onPositionChanged: { + control.startSystemMove() + } + } + } + } + } + } + + function close(){ + content_dialog.close() + } + function open(){ + content_dialog.open() + } +} diff --git a/Gallery/res/qml/component/base/MyImgButton.qml b/Gallery/res/qml/component/base/MyImgButton.qml new file mode 100644 index 0000000..4397c2c --- /dev/null +++ b/Gallery/res/qml/component/base/MyImgButton.qml @@ -0,0 +1,67 @@ +import QtQuick 2.15 +import Qt5Compat.GraphicalEffects + +Rectangle{ + id: control + + property var p_width: 25 + property var p_height: 25 + property var p_img: "nav_car.png" + property var p_checked: false + + signal clickItem(var type); + + onP_checkedChanged: function(nv) { + if (control.p_checked) { + control.gradient.stops[0].color = "#77ED8B" + control.gradient.stops[1].color = "#22C55E" + img_nav.visible = true + } else { + control.gradient.stops[0].color = Qt.rgba(255/255,255/255,255/255, 0.05) + control.gradient.stops[1].color = Qt.rgba(255/255,255/255,255/255, 0.05) + img_nav.visible = false + } + } + + width: p_width + height: p_height + radius: 5 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: control.p_checked ? "#77ED8B" : Qt.rgba(255/255,255/255,255/255, 0.05) } + GradientStop { position: 1.0; color: control.p_checked ? "#22C55E" : Qt.rgba(255/255,255/255,255/255, 0.05) } + } + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/" + p_img + anchors.centerIn: parent + ColorOverlay{ + id: img_nav + anchors.fill: parent + color: "#2a2a2a" + source: parent + visible: control.p_checked + } + } + + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + if (!control.p_checked) { + parent.gradient.stops[0].color = "#77ED8B" + parent.gradient.stops[1].color = "#22C55E" + img_nav.visible = true + } + } + onExited: { + if (!control.p_checked) { + parent.gradient.stops[0].color = Qt.rgba(255/255,255/255,255/255, 0.05) + parent.gradient.stops[1].color = Qt.rgba(255/255,255/255,255/255, 0.05) + img_nav.visible = false + } + } + onClicked: { + control.clickItem("") + } + } +} diff --git a/Gallery/res/qml/component/base/MyTabButton.qml b/Gallery/res/qml/component/base/MyTabButton.qml new file mode 100644 index 0000000..2109f1c --- /dev/null +++ b/Gallery/res/qml/component/base/MyTabButton.qml @@ -0,0 +1,47 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import QtQuick.Controls.impl +import QtQuick.Templates as T + +T.TabButton { + id: control + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding) + + padding: 6 + spacing: 6 + + icon.width: 24 + icon.height: 24 + icon.color: checked ? control.palette.windowText : control.palette.brightText + + contentItem: Rectangle { + color: "transparent" + Label { + id: lbl_txt + text: control.text + color: "#fff" + } + Rectangle{ + color: "#fff" + width: lbl_txt.width + height: 2 + anchors.left: parent.left + anchors.bottom: parent.bottom + anchors.bottomMargin: -8 + visible: checked + } + } + + background: Rectangle { + implicitHeight: 40 + color: "transparent" + } +} + diff --git a/Gallery/res/qml/component/base/MyTreeView.qml b/Gallery/res/qml/component/base/MyTreeView.qml new file mode 100644 index 0000000..e88b977 --- /dev/null +++ b/Gallery/res/qml/component/base/MyTreeView.qml @@ -0,0 +1,491 @@ +import QtQuick +import QtQuick.Controls +import FluentUI.Controls +import QtQuick.Layouts +import Qt5Compat.GraphicalEffects + + +/** +树控件 +作者：surfsky.cnblogs.com 2014-10 +协议：MIT 请保留本文档说明 +功能 + /递归树显示 + /左侧一个箭头，点击可展开显示子树 + /选中节点变色 + /节点点击事件 + /tag属性，携带类似id的数据 + 异步方式，点击箭头后请求子数据。异步模式的话，节点要加上isLeaf属性，点击箭头后动态加载数据 +使用 + TreeView { + anchors.fill: parent + id: tree + model: modelTree2 + onSelectedItemChanged: console.log(item.text) + } + ListModel { + id: modelTree2 + Component.onCompleted: { + modelTree2.append([ + {title: "Node 1"}, + {title: "Node 2", items: [ + {title: "Node 21", items:[ + {title: "Node 211"}, + {title: "Node 212"} + ]}, + {title: "Node 22"} + ] + }, + {title: "Node 3"} + ]); + } + } +参考 http://qt-project.org/forums/viewthread/30521/ +*/ +ScrollView { + id: view + // frameVisible: true + clip: true + + // 输入属性 + property var model + property int rowHeight: 30 + property int columnIndent: 15 + property int lineHeight: 1 + property string expanderImage : "qrc:/qt/qml/Gallery/res/image/components/expand.png" + + // 私有属性 + property var currentNode // 当前节点数据 + property var currentItem // 当前节点UI + property var start_drag: false + + // 信号 + signal selectedItemChanged(var item) + + Timer { + id: timer + + // Start the timer and execute the provided callback on every X milliseconds + function startTimer(callback, milliseconds) { + timer.interval = milliseconds; + timer.repeat = false; + timer.triggered.connect(callback); + timer.start(); + } + + // Stop the timer and unregister the callback + function stopTimer(callback) { + timer.stop(); + timer.triggered.disconnect(callback); + } + } + + + // 节点数据展示的UI + property Component delegate: Label { + id: label + text: model.title ? model.title : 0 + color: currentItem === model ? "#2a2a2a" : "white" + elide: Text.ElideRight + property var tag : model.tag + } + + // + Loader { + id: content + onLoaded: item.isRoot = true + sourceComponent: treeBranch + property var items: model + + // 背景条纹 + // Column { + // anchors.fill: parent + // Repeater { + // model: 1 + Math.max(view.contentItem.height, view.height) / rowHeight + // Rectangle { + // objectName: "Faen" + // color: index % 2 ? "#eee" : "white" + // width: view.width ; height: rowHeight + // } + // } + // } + + // 树节点组件 + Component { + id: treeBranch + Item { + id: root + property bool isRoot: false + implicitHeight: column.implicitHeight + implicitWidth: column.implicitWidth + + // Rectangle{ + // width: { + // console.log(column.implicitHeight + "," + column.implicitWidth) + // return 0 + // } + // height: column.implicitHeight + // color: "cyan" + // } + + Column { + id: column + x: 2 + Item { + height: isRoot ? 0 : rowHeight; width: 1 + } + + Repeater { + model: items + Item { + id: filler + width: Math.max(loader.width + columnIndent, row.width) + height: Math.max(row.height, loader.height) + property var _model: model + // 当前行背景色块--可拖拽！ + Rectangle { + id: rowfill + x: view.mapToItem(rowfill, 0, 0).x + width: view.width + height: filler.height // rowHeight + visible: currentItem === model + color: Qt.rgba(15/255,147/255,83/255, 0.1) + border.color: Qt.rgba(34/255,197/255,94/255, 0.3) + border.width: 1 + } + Rectangle { + id: rowfill_cur + x: view.mapToItem(rowfill_cur, 0, 0).x + width: view.width + height: rowHeight + visible: currentItem === model + color: Qt.rgba(15/255,147/255,83/255, 0.1) + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + radius: 5 + } + + Rectangle{ + id: dragRect + x: view.mapToItem(rowfill, 0, 0).x + width: view.width + height: filler.height + color: "transparent" + + MouseArea { + id: mouseArea + anchors.fill: parent + drag.target: dragRect + onPressed: { + timer.startTimer(() => { + view.start_drag = true + dragRect.Drag.active = true + dragRect.Drag.source = dragRect + }, 100) + } + onReleased: { + timer.stopTimer(()=> { + + }) + if (view.start_drag === true) { + dragRect.Drag.drop() + dragRect.Drag.active = false + dragRect.x = 0 + dragRect.y = 0 + } + } + onClicked: { + currentItem = model + console.log("click modelId =" + model.id) + } + hoverEnabled: true + onEntered: { + // console.log(rowfill_cur.mapToItem(view, 0, 0).x) + } + onExited: { + } + } + + Drag.active: mouseArea.drag.active + Drag.dragType: Drag.Automatic + Drag.hotSpot.x: dragRect.width / 2 + Drag.hotSpot.y: dragRect.height / 2 + Drag.mimeData: { "uuid": model.id } + } + + + // 行数据UI + Row { + id: row + // 行图标 + Item { + width: rowHeight + height: rowHeight + opacity: (!!model.items && !!model.items.count > 0) ? 1 : 0 + Image { + id: expander + source: view.expanderImage + height: view.rowHeight * 0.6 + fillMode: Image.PreserveAspectFit + opacity: mouse.containsMouse ? 1 : 0.7 + anchors.centerIn: parent + rotation: loader.expanded ? 90 : 0 + Behavior on rotation {NumberAnimation { duration: 120}} + ColorOverlay{ + anchors.fill: parent + color: "#2a2a2a" + source: parent + visible: currentItem === model + } + } + MouseArea { + id: mouse + anchors.fill: parent + hoverEnabled: true + onClicked: loader.expanded = !loader.expanded + } + } + Item{ + width: 19 + height: rowHeight + Image{ + width: 14 + height: 12 + anchors.centerIn: parent + fillMode: Image.PreserveAspectFit + source: "qrc:/qt/qml/Gallery/res/image/components/" + model.ico + ColorOverlay{ + anchors.fill: parent + color: "#2a2a2a" + source: parent + visible: currentItem === model + } + } + } + + // 行文本 + Loader { + width: { + // console.log(view.width + "," + rowfill_cur.x) + return view.width + rowfill_cur.x - rowHeight - 20 - 60 + } + property var model: _model + sourceComponent: delegate + anchors.verticalCenter: parent.verticalCenter + } + RowLayout{ + width: 60 + spacing: 5 + Layout.rightMargin: 5 + Rectangle{ + Layout.preferredWidth: 25 + Layout.preferredHeight: 25 + color: "transparent" + radius: 5 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/tree/ico_unlock.png" + width: 14 + height: 12 + // icon.color: currentItem === model ? "#2a2a2a" : "#ffffff" + ColorOverlay{ + anchors.fill: parent + color: "#2a2a2a" + source: parent + visible: currentItem === model + } + anchors.centerIn: parent + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = Qt.rgba(255/255,255/255,255/255, 0.05) + onExited: parent.color = "transparent" + } + } + Rectangle{ + Layout.preferredWidth: 25 + Layout.preferredHeight: 25 + color: "transparent" + radius: 5 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/tree/ico_eye.png" + width: 14 + height: 12 + ColorOverlay{ + anchors.fill: parent + color: "#2a2a2a" + source: parent + visible: currentItem === model + } + anchors.centerIn: parent + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = Qt.rgba(255/255,255/255,255/255, 0.05) + onExited: parent.color = "transparent" + } + } + } + } + + + DropArea { + id: mid_area + width: view.width + height: rowHeight - 10 + anchors.left: parent.left + anchors.top: parent.top + + Rectangle{ + id: top_area_rect + width: parent.width + height: rowHeight + color: "transparent" + opacity: 0.2 + } + + onEntered: { + top_area_rect.color = "white" + } + onExited: { + top_area_rect.color = "transparent" + } + onDropped: { + top_area_rect.color = "transparent" + + var sourceId = drop.getDataAsString("uuid") + var targetId = model.id + + if (sourceId === targetId) { + console.log("same id!") + return + } + + var sinfo = view.getInfoById(sourceId, view.model) + var einfo = view.getInfoById(targetId, view.model) + if (sinfo.mm == einfo.mm) { + // 先添加，后删除。 + einfo.mm.get(einfo.index).items.append(sinfo.mm.get(sinfo.index)) + sinfo.mm.remove(sinfo.index) + } else { + var tmp = view.getInfoById(targetId, sinfo.mm.get(sinfo.index).items) + if (!tmp) { + console.log('no same parent...OK') + // 先添加，后删除。 + einfo.mm.get(einfo.index).items.append(sinfo.mm.get(sinfo.index)) + sinfo.mm.remove(sinfo.index) + } else { + console.log('error luoji.') + } + } + + console.log("sin=" + sinfo.index + ",ein=" + einfo.index) + } + } + + DropArea { + width: view.width + height: rowHeight * 0.2 + anchors.left: parent.left + anchors.bottom: parent.bottom + + Rectangle{ + id: bot_area_rect + width: parent.width + height: lineHeight + anchors.left: parent.left + anchors.bottom: parent.bottom + color: "transparent" + } + + onEntered: { + bot_area_rect.color = "white" + } + onExited: { + bot_area_rect.color = "transparent" + } + onDropped: { + bot_area_rect.color = "transparent" + var sourceId = drop.getDataAsString("uuid") + var targetId = model.id + if (sourceId === targetId) { + console.log("same id!") + return + } + + var sinfo = view.getInfoById(sourceId, view.model) + var einfo = view.getInfoById(targetId, view.model) + + if (sinfo.mm !== einfo.mm) { + var tmp = view.getInfoById(targetId, sinfo.mm.get(sinfo.index).items) + if (!tmp) { + console.log("OK...") + var ryAdd = sinfo.mm.get(sinfo.index) + var addTmp = {id:ryAdd.id, title: ryAdd.title, items: ryAdd.items} + console.log(einfo.index + "------") + einfo.mm.insert(einfo.index + 1, ryAdd) + sinfo.mm.remove(sinfo.index) + } + } else { + if (sinfo.index < einfo.index) { + sinfo.mm.move(sinfo.index, einfo.index, 1) + } else if (sinfo.index > einfo.index) { + sinfo.mm.move(sinfo.index, einfo.index + 1, 1) + } + } + } + } + + + // 子树（递归自身） + Loader { + id: loader + x: columnIndent + height: expanded ? implicitHeight : 0 + property var node: model + property bool expanded: false + property var items: model.items + property var text: model.title + sourceComponent: (expanded && !!model.items) ? treeBranch : undefined + } + } + } + + } + } + } + } + + function getInfoById(id, paModel) { + var index = -1 + var mm = null + + if (paModel) { + for (var i = 0;i 0) { + var info = getInfoById(id, paModel.get(i).items) + if (info) { + index = info.index + mm = info.mm + break + } + } + + if (paModel.get(i).id == id) { + index = i + mm = paModel + break + } + } + } + + if (mm) { + return {index, mm} + } + return null + } +} diff --git a/Gallery/res/qml/component/base/ProjectList.qml b/Gallery/res/qml/component/base/ProjectList.qml new file mode 100644 index 0000000..65cd5a2 --- /dev/null +++ b/Gallery/res/qml/component/base/ProjectList.qml @@ -0,0 +1,527 @@ +import QtQuick 2.15 +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt.labs.qmlmodels +import Qt5Compat.GraphicalEffects + +Rectangle{ + id: control + property var show_type: "card" + property var p_data + + property var p_cellW: 310 + property var p_cellH: 210 + + signal clickNewItem() + + signal clickItem(var item) + + color: "transparent" + Layout.fillWidth: true + + Menu { + id:menu_group + width: 140 + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/edit.png" + m_text: "重命名" + m_key: "" + show_key: false + onClickItem: { + + } + } + BaseMenuItem{ + m_icon: "qrc:/qt/qml/Gallery/res/image/icons/delete.png" + m_text: "删除" + m_key: "" + show_key: false + onClickItem: { + + } + } + } + + Component{ + id: com_project + Rectangle{ + id: rect_con + width: control.p_cellW - 10 + height: control.p_cellH - 10 + color: Qt.rgba(255/255,255/255,255/255, 0.05) + radius: 5 + Rectangle{ + visible: model.uuid != "0" + anchors.fill: parent + anchors.leftMargin: 5 + anchors.rightMargin: 5 + anchors.topMargin: 5 + anchors.bottomMargin: 5 + color: "transparent" + layer.enabled: true + layer.effect: OpacityMask{ + maskSource: Rectangle{ + width: control.p_cellW - 10 + height: control.p_cellH - 70 + radius: 5 + } + } + + Image{ + id: image + anchors.left: parent.left + anchors.top: parent.top + anchors.right: parent.right + height: control.p_cellH - 70 + source: model.img + } + + Rectangle{ + width: parent.width + height: 40 + color: "transparent" + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.right: parent.right + RowLayout{ + anchors.fill: parent + anchors.topMargin: 1 + Item{ + Layout.fillWidth: true + Layout.fillHeight: true + RowLayout{ + anchors.top: parent.top + anchors.left: parent.left + anchors.leftMargin: 5 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/ico_project.png" + } + Label{ + text: model.title + font.pointSize: 10 + font.bold: true + Layout.maximumWidth: rect_con.width - 135 + elide: Text.ElideRight + } + Rectangle{ + color: "#159A59" + width: 51 + height: 20 + radius: 10 + Label{ + anchors.centerIn: parent + text: "已启用" + font.pointSize: 9 + } + } + } + Label{ + anchors.bottom: parent.bottom + anchors.bottomMargin: 1 + anchors.left: parent.left + anchors.leftMargin: 5 + text: "更新于 2月24日 20:34" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + font.pointSize: 9 + } + } + Item{ + Layout.preferredWidth: 30 + Layout.fillHeight: true + Layout.rightMargin: 5 + RoundImageView{ + width: 32 + height: 32 + radius: 32/2 + borderWidth: 2 + sourceSize: Qt.size(32*2,32*2) + source: "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg" + anchors{ + verticalCenter: parent.verticalCenter + } + } + } + } + } + } + + Rectangle{ + visible: model.uuid == "0" + anchors.fill: parent + anchors.leftMargin: 5 + anchors.rightMargin: 5 + anchors.topMargin: 5 + anchors.bottomMargin: 5 + + color: "#303030" + radius: 3 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/img/add.png" + anchors.centerIn: parent + } + } + + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: parent.color = Qt.rgba(255/255,255/255,255/255, 0.15) + onExited: parent.color = Qt.rgba(255/255,255/255,255/255, 0.05) + onClicked: { + if (model.uuid == "0") { + control.clickNewItem() + } else { + control.clickItem(model) + } + } + } + } + } + + + ColumnLayout{ + anchors.fill: parent + + Item{ + visible: control.show_type == "card" + Layout.fillWidth: true + Layout.fillHeight: true + ScrollView{ + anchors.fill: parent + + ColumnLayout{ + + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 30 + Label{ + text: "分组名称" + font.pointSize: 11 + color: "#20C05D" + Layout.leftMargin: 5 + } + IconButton{ + icon.name: FluentIcons.graph_More + icon.width: 14 + icon.height: 14 + spacing: 5 + Layout.leftMargin: 5 + onClicked: { + menu_group.popup(this) + menu_group.x = -50 + menu_group.y = 20 + } + } + } + + GridView{ + id: gv + Layout.preferredWidth: control.width + Layout.preferredHeight: gv.contentHeight + cellWidth: control.p_cellW + cellHeight: control.p_cellH + model: p_data + delegate: com_project + clip: true + interactive: false + boundsBehavior: Flickable.StopAtBounds + } + + RowLayout{ + visible: control.show_type == "card" + Layout.preferredHeight: 30 + Label{ + text: "分组名称" + font.pointSize: 11 + color: "#20C05D" + Layout.leftMargin: 5 + } + IconButton{ + icon.name: FluentIcons.graph_More + icon.width: 14 + icon.height: 14 + spacing: 5 + Layout.leftMargin: 5 + onClicked: { + menu_group.popup(this) + menu_group.x = -50 + menu_group.y = 20 + } + } + } + } + } + + } + + + // 表格模式 + Rectangle{ + visible: control.show_type == "list" + Layout.fillWidth: true + Layout.fillHeight: true + Layout.leftMargin: 5 + id: com_project_list + color: 'transparent' + + Row{ + id: tb_header + anchors.fill: parent + anchors.topMargin: 10 + spacing: 0 + + Repeater{ + model: ["文件名","项目状态","更新时间","创建时间", "创建人"] + + Rectangle{ + width: { + var w = 0 + switch(index){ + case 0: w = parent.width - 700;break; + case 1: w = 150;break; + case 2: w = 200;break; + case 3: w = 200;break; + case 4: w = 150;break; + } + console.log(w) + return w + } + height: 30 + color: "transparent" + Text { + text: modelData + anchors.centerIn: this + font.pointSize: 10 + color: "#9E9E9E" + } + } + } + } + + ScrollView{ + anchors.fill: parent + anchors.topMargin: 40 + + ColumnLayout{ + id: col_container + width: tb_header.width + + // 表格头部 + RowLayout{ + Layout.topMargin: 0 + + Label{ + text: "分组名称" + font.pointSize: 11 + color: "#20C05D" + } + IconButton{ + icon.name: FluentIcons.graph_More + icon.width: 14 + icon.height: 14 + spacing: 5 + Layout.leftMargin: 5 + onClicked: { + menu_group.popup(this) + menu_group.x = -50 + menu_group.y = 20 + } + } + } + + + TableView { + id: tv_data + columnSpacing: 0 + rowSpacing: 10 + clip: true + Layout.topMargin: 0 + Layout.fillWidth: true + Layout.preferredHeight: tv_data.rows * 40 + interactive: false + + model: TableModel { + TableModelColumn { display: "title" } + TableModelColumn { display: "status" } + TableModelColumn { display: "utime" } + TableModelColumn { display: "ctime" } + TableModelColumn { display: "user" } + + rows: [ + { "title": {"title": "河津一号充换电站设计", "icon": "qrc:/qt/qml/Gallery/res/image/components/ico_project.png"}, "status": "已启用", "utime": "2025-02-24 16:00:00", "ctime": "2025-02-24 16:00:00", "user": {"avatar": "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg", "name": "任泊然"} }, + { "title": {"title": "河津一号充换电站设计", "icon": "qrc:/qt/qml/Gallery/res/image/components/ico_project.png"}, "status": "已启用", "utime": "2025-02-24 16:00:00", "ctime": "2025-02-24 16:00:00", "user": {"avatar": "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg", "name": "任泊然"} }, + { "title": {"title": "河津一号充换电站设计", "icon": "qrc:/qt/qml/Gallery/res/image/components/ico_project.png"}, "status": "已启用", "utime": "2025-02-24 16:00:00", "ctime": "2025-02-24 16:00:00", "user": {"avatar": "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg", "name": "任泊然"} }, + { "title": {"title": "河津一号充换电站设计", "icon": "qrc:/qt/qml/Gallery/res/image/components/ico_project.png"}, "status": "已启用", "utime": "2025-02-24 16:00:00", "ctime": "2025-02-24 16:00:00", "user": {"avatar": "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg", "name": "任泊然"} }, + { "title": {"title": "河津一号充换电站设计", "icon": "qrc:/qt/qml/Gallery/res/image/components/ico_project.png"}, "status": "已启用", "utime": "2025-02-24 16:00:00", "ctime": "2025-02-24 16:00:00", "user": {"avatar": "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg", "name": "任泊然"} }, + { "title": {"title": "河津一号充换电站设计", "icon": "qrc:/qt/qml/Gallery/res/image/components/ico_project.png"}, "status": "已启用", "utime": "2025-02-24 16:00:00", "ctime": "2025-02-24 16:00:00", "user": {"avatar": "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg", "name": "任泊然"} }, + { "title": {"title": "河津一号充换电站设计", "icon": "qrc:/qt/qml/Gallery/res/image/components/ico_project.png"}, "status": "已启用", "utime": "2025-02-24 16:00:00", "ctime": "2025-02-24 16:00:00", "user": {"avatar": "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg", "name": "任泊然"} }, + { "title": {"title": "河津一号充换电站设计", "icon": "qrc:/qt/qml/Gallery/res/image/components/ico_project.png"}, "status": "已启用", "utime": "2025-02-24 16:00:00", "ctime": "2025-02-24 16:00:00", "user": {"avatar": "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg", "name": "任泊然"} }, + { "title": {"title": "河津一号充换电站设计", "icon": "qrc:/qt/qml/Gallery/res/image/components/ico_project.png"}, "status": "已启用", "utime": "2025-02-24 16:00:00", "ctime": "2025-02-24 16:00:00", "user": {"avatar": "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg", "name": "任泊然"} }, + { "title": {"title": "河津一号充换电站设计", "icon": "qrc:/qt/qml/Gallery/res/image/components/ico_project.png"}, "status": "已启用", "utime": "2025-02-24 16:00:00", "ctime": "2025-02-24 16:00:00", "user": {"avatar": "qrc:/qt/qml/Gallery/res/image/avatars/300-1.jpg", "name": "任泊然"} }, + ] + } + + delegate: DelegateChooser{ + + DelegateChoice{ + column: 0 + delegate: Rectangle{ + color: Qt.rgba(255/255,255/255,255/255, 0.05) + implicitWidth: tb_header.width - 700 + implicitHeight: 40 + + Image{ + source: display.icon + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 10 + anchors.topMargin: 13 + } + + Text { + text: display.title + font.pointSize: 12 + color: "#ffffff" + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 35 + anchors.topMargin: 9 + + width: parent.width - 50 + elide: Text.ElideRight + } + + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + console.log(index) + } + onExited: { + } + } + } + } + DelegateChoice{ + column: 1 + delegate: Rectangle{ + color: Qt.rgba(255/255,255/255,255/255, 0.05) + implicitWidth: 150 + implicitHeight: 40 + + Rectangle { + radius: 20 + width: 70 + height: 30 + anchors.top: parent.top + anchors.topMargin: 5 + color: "#159A59" + Label{ + text: display + anchors.centerIn: parent + font.pointSize: 10 + } + } + } + } + DelegateChoice{ + column: 2 + delegate: Rectangle{ + color: Qt.rgba(255/255,255/255,255/255, 0.05) + implicitWidth: 200 + implicitHeight: 40 + + Text { + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 0 + anchors.topMargin: 11 + text: display + font.pointSize: 10 + color: Qt.rgba(255/255,255/255,255/255, 0.6) + } + } + } + DelegateChoice{ + column: 3 + delegate: Rectangle{ + color: Qt.rgba(255/255,255/255,255/255, 0.05) + implicitWidth: 200 + implicitHeight: 40 + + Text { + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 0 + anchors.topMargin: 11 + text: display + font.pointSize: 10 + color: Qt.rgba(255/255,255/255,255/255, 0.6) + } + } + } + DelegateChoice{ + column: 4 + delegate: Rectangle{ + color: Qt.rgba(255/255,255/255,255/255, 0.05) + implicitWidth: 150 + implicitHeight: 40 + + RoundImageView{ + width: 32 + height: 32 + radius: 32/2 + borderWidth: 2 + sourceSize: Qt.size(32*2,32*2) + source: display.avatar + anchors{ + verticalCenter: parent.verticalCenter + } + } + + Text { + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: 40 + anchors.topMargin: 11 + text: display.name + font.pointSize: 10 + color: Qt.rgba(255/255,255/255,255/255, 0.6) + } + } + + } + + } + + } + + + RowLayout{ + Layout.topMargin: 20 + + Label{ + text: "分组名称" + font.pointSize: 11 + color: "#20C05D" + } + IconButton{ + icon.name: FluentIcons.graph_More + icon.width: 14 + icon.height: 14 + spacing: 5 + Layout.leftMargin: 5 + onClicked: { + menu_group.popup(this) + menu_group.x = -50 + menu_group.y = 20 + } + } + } + + } + } + } + } +} diff --git a/Gallery/res/qml/component/base/StyleButton.qml b/Gallery/res/qml/component/base/StyleButton.qml new file mode 100644 index 0000000..876face --- /dev/null +++ b/Gallery/res/qml/component/base/StyleButton.qml @@ -0,0 +1,90 @@ +import QtQuick 2.15 +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt.labs.qmlmodels +import Qt5Compat.GraphicalEffects + +Rectangle{ + id: control + property var p_icon: "qrc:/qt/qml/Gallery/res/image/img/style1.png" + property var p_txt: "风格" + property var p_check: false + + property var p_w: 135 + property var p_h: 114 + + property var p_fontSize: 11 + + signal clicked() + + Layout.preferredWidth: p_w + Layout.preferredHeight: p_h + + width: p_w + height: p_h + + radius: 8 + + onP_checkChanged: function() { + if (control.p_check){ + lbl_tp_txt.color = "#2a2a2a" + control.gradient.stops[0].color = "#77ED8B" + control.gradient.stops[1].color = "#22C55E" + } else { + lbl_tp_txt.color = "#9E9E9E" + control.gradient.stops[0].color = Qt.rgba(255/255,255/255,255/255, 0.05) + control.gradient.stops[1].color = Qt.rgba(255/255,255/255,255/255, 0.05) + } + } + + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: control.p_check ? "#77ED8B" : Qt.rgba(255/255,255/255,255/255, 0.05) } + GradientStop { position: 1.0; color: control.p_check ? "#22C55E" : Qt.rgba(255/255,255/255,255/255, 0.05) } + } + Image{ + source: control.p_icon + width: control.p_w - 8 + height: control.p_h - 32 + anchors { + left: parent.left + top: parent.top + leftMargin: 4 + topMargin: 4 + } + } + Label{ + id: lbl_tp_txt + text: control.p_txt + color: control.p_check ? "#2a2a2a" : "#9E9E9E" + font.pointSize: control.p_fontSize + anchors.bottom: parent.bottom + anchors.bottomMargin: 5 + anchors.horizontalCenter: parent.horizontalCenter + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + if (!control.p_check) { + lbl_tp_txt.color = "#2a2a2a" + parent.gradient.stops[0].color = "#77ED8B" + parent.gradient.stops[1].color = "#22C55E" + } + } + + onExited: { + if (!control.p_check) { + lbl_tp_txt.color = "#9E9E9E" + parent.gradient.stops[0].color = Qt.rgba(255/255,255/255,255/255, 0.05) + parent.gradient.stops[1].color = Qt.rgba(255/255,255/255,255/255, 0.05) + } + } + + onClicked: { + control.clicked() + } + } +} diff --git a/Gallery/res/qml/component/nav/RouteResult.qml b/Gallery/res/qml/component/nav/RouteResult.qml new file mode 100644 index 0000000..40bb5a2 --- /dev/null +++ b/Gallery/res/qml/component/nav/RouteResult.qml @@ -0,0 +1,286 @@ +import QtQuick 2.15 +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt.labs.qmlmodels +import Qt5Compat.GraphicalEffects + +Item{ + id: control + Layout.preferredWidth: parent.width + Layout.preferredHeight: 93 + (p_show_detail ? detailHeight : 0) + + property var p_show_detail: false + + property var detailHeight: 27 * 6 + 120 + + Rectangle{ + anchors.fill: parent + anchors.leftMargin: 10 + anchors.rightMargin: 10 + + color: Qt.rgba(255/255,255/255,255/255, 0.05) + radius: 6 + + border.color: p_show_detail ? "#77ED8B" : "transparent" + border.width: 1 + + ColumnLayout{ + anchors.fill: parent + Item{ + Layout.fillWidth: true + Layout.preferredHeight: 25 + Layout.leftMargin: 10 + Layout.rightMargin: 10 + Layout.topMargin: 5 + Label{ + text: "方案一" + font.pointSize: 12 + } + Rectangle{ + width: 97 + height: 26 + color: Qt.rgba(255/255,255/255,255/255, 0.05) + anchors.right: parent.right + radius: 5 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/ico_add_lay.png" + anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left + anchors.leftMargin: 5 + } + Label{ + text: "添加到图层" + anchors.left: parent.left + anchors.leftMargin: 24 + anchors.top: parent.top + anchors.topMargin: 3 + color: "#77ED8B" + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + parent.color = Qt.rgba(255/255,255/255,255/255, 0.15) + } + onExited: { + parent.color = Qt.rgba(255/255,255/255,255/255, 0.05) + } + onClicked: { + console.log("open") + } + } + } + } + Rectangle{ + Layout.fillWidth: true + Layout.leftMargin: 10 + Layout.rightMargin: 10 + color: "#888" + Layout.preferredHeight: 1 + } + + Item{ + Layout.fillWidth: true + Layout.preferredHeight: 25 + Layout.leftMargin: 10 + Layout.rightMargin: 10 + RowLayout{ + anchors.fill: parent + Label{ + text: "约4.27小时" + Layout.fillWidth: true + } + Rectangle{ + color: "#888" + Layout.preferredWidth: 1 + Layout.preferredHeight: 11 + } + Label{ + text: "224.1km" + Layout.fillWidth: true + horizontalAlignment: Label.AlignHCenter + } + Rectangle{ + color: "#888" + Layout.preferredWidth: 1 + Layout.preferredHeight: 11 + } + Label{ + text: "红绿灯27个" + Layout.fillWidth: true + horizontalAlignment: Label.AlignHCenter + } + Rectangle{ + color: "#888" + Layout.preferredWidth: 1 + Layout.preferredHeight: 11 + } + Label{ + text: "过路费46元" + Layout.fillWidth: true + horizontalAlignment: Label.AlignHCenter + } + } + } + + Item{ + Layout.fillWidth: true + Layout.preferredHeight: 20 + Layout.leftMargin: 10 + Layout.rightMargin: 10 + Layout.topMargin: 0 + Label{ + text: "途径：G0612西和高速>315国道>G0612西和高速" + font.pointSize: 9 + color: Qt.rgba(255/255,255/255,255/255, 0.6) + } + Image { + source: "qrc:/qt/qml/Gallery/res/image/components/expand.png" + fillMode: Image.PreserveAspectFit + anchors.right: parent.right + opacity: 0.6 + anchors.top: parent.top + anchors.topMargin: 3 + rotation: p_show_detail ? 90 : 0 + Behavior on rotation {NumberAnimation { duration: 120}} + ColorOverlay{ + id: img_exp + anchors.fill: parent + color: "#77ED8B" + source: parent + visible: false + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + img_exp.visible = true + } + onExited: { + img_exp.visible = false + } + onClicked: { + control.p_show_detail = !control.p_show_detail + } + } + } + } + + Item{ + Layout.fillWidth: true + Layout.fillHeight: true + } + + ColumnLayout{ + id: cl_detail + Layout.fillWidth: true + Layout.preferredHeight: 27 * 6 + 100 + Layout.leftMargin: 10 + Layout.rightMargin: 10 + spacing: 20 + visible: p_show_detail + + Rectangle{ + Layout.fillWidth: true + Layout.leftMargin: 0 + Layout.rightMargin: 0 + color: "#888" + Layout.preferredHeight: 1 + } + + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 27 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/nav_start.png" + } + Label{ + text: "从 巴音郭楞蒙古自治州未知道路出发" + } + } + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 27 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/nav_right.png" + } + Column{ + Label{ + text: "从 塔农段" + } + Label{ + text: "67.6公里 红绿灯15个 过路费6元" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + font.pointSize: 8 + } + } + } + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 27 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/nav_right_zhi.png" + rotation: -90 + } + Column{ + Label{ + text: "从 塔农段" + } + Label{ + text: "67.6公里 红绿灯15个 过路费6元" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + font.pointSize: 8 + } + } + } + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 27 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/nav_mid.png" + } + Label{ + text: "从 巴音郭楞蒙古自治州未知道路出发" + } + } + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 27 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/nav_right_zhi.png" + } + Column{ + Label{ + text: "从 塔农段" + } + Label{ + text: "67.6公里 红绿灯15个 过路费6元" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + font.pointSize: 8 + } + } + } + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 27 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/nav_stop.png" + } + Label{ + text: "从 巴音郭楞蒙古自治州未知道路出发" + } + } + + Item{ + Layout.fillWidth: true + Layout.fillHeight: true + } + + } + + } + + } +} diff --git a/Gallery/res/qml/component/nav/SearchInput.qml b/Gallery/res/qml/component/nav/SearchInput.qml new file mode 100644 index 0000000..3015a21 --- /dev/null +++ b/Gallery/res/qml/component/nav/SearchInput.qml @@ -0,0 +1,54 @@ +import QtQuick 2.15 +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl + +TextBox{ + id: control + property var p_txt: "起" + property var p_tip_txt: "请输入起点" + + property var p_del: false + + signal clickClose() + + Layout.preferredWidth: parent.width + Layout.preferredHeight: 32 + placeholderText: control.p_tip_txt + leading: Label{ + text: control.p_txt + color: "#fff" + } + trailing: IconButton{ + implicitWidth: 20 + implicitHeight: 20 + icon.name: FluentIcons.graph_ChromeClose + icon.width: 10 + icon.height: 10 + padding: 0 + visible: p_del + onClicked: { + control.clickClose() + } + } + placeholderTextColor: "#888" + background: InputBackground { + implicitWidth: 200 + implicitHeight: 32 + activeColor: "#22C55E" + radius: 6 + color: { + if(!parent.enabled){ + return parent.FluentUI.theme.res.controlFillColorDisabled + }else if(parent.activeFocus){ + return parent.FluentUI.theme.res.controlFillColorInputActive + }else if(parent.hovered){ + return parent.FluentUI.theme.res.controlFillColorSecondary + }else{ + return parent.FluentUI.theme.res.controlFillColorDefault + } + } + target: parent + } +} diff --git a/Gallery/res/qml/component/window/AddPointWindow.qml b/Gallery/res/qml/component/window/AddPointWindow.qml new file mode 100644 index 0000000..2aac7dc --- /dev/null +++ b/Gallery/res/qml/component/window/AddPointWindow.qml @@ -0,0 +1,383 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt5Compat.GraphicalEffects +import "../base" + +MyDialogWindow { + id: dia_win + title: "添加点位" + + signal clickEditFont() + signal clickEditIcon() + + Rectangle { + implicitWidth: 610 + implicitHeight: 460 + color: "transparent" + ColumnLayout{ + anchors.fill: parent + anchors.leftMargin: 10 + anchors.topMargin: 10 + anchors.rightMargin: 10 + spacing: 30 + + RowLayout{ + spacing: 20 + Layout.fillWidth: true + TextBox{ + Layout.preferredWidth: 450 + Layout.preferredHeight: 44 + placeholderText: "请输入点位名称" + background: InputBackground { + activeColor: "#22C55E" + radius: 5 + color: { + if(!parent.enabled){ + return parent.FluentUI.theme.res.controlFillColorDisabled + }else if(parent.activeFocus){ + return parent.FluentUI.theme.res.controlFillColorInputActive + }else if(parent.hovered){ + return parent.FluentUI.theme.res.controlFillColorSecondary + }else{ + return parent.FluentUI.theme.res.controlFillColorDefault + } + } + target: parent + } + + trailing: Rectangle{ + width: 32 + height: 20 + anchors.right: parent.right + anchors.rightMargin: 10 + color: "transparent" + Rectangle{ + width: 1 + height: 20 + anchors.verticalCenter: parent.verticalCenter + color: Qt.rgba(255/255,255/255,255/255, 0.6) + } + Image{ + anchors.right: parent.right + source: "qrc:/qt/qml/Gallery/res/image/components/ico_font.png" + anchors.verticalCenter: parent.verticalCenter + ColorOverlay{ + id: co_img + anchors.fill: parent + color: "#77ED8B" + source: parent + visible: false + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + co_img.visible = true + } + onExited: { + co_img.visible = false + } + onClicked: { + console.log("open") + clickEditFont() + } + } + + } + } + } + + + Switch { + anchors.right: parent.right + text: "显示名称" + checked: true + FluentUI.primaryColor: "#77ED8B" + anchors.verticalCenter: parent.verticalCenter + } + } + + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 136 + //// + AttachmenButton{ + p_label: "图标" + p_title: "名称名称名称" + p_btnChoose: true + p_btnClear: false + onClickItem: { + console.log("click...") + clickEditIcon() + } + } + AttachmenButton{ + p_label: "附件" + p_title: "名称名称名称名称名称名称" + p_btnChoose: true + p_btnClear: true + } + AttachmenButton{ + p_label: "文件夹" + p_title: "名称名称名称" + p_btnChoose: true + p_btnClear: true + } + Item{ + Layout.fillWidth: true + Layout.preferredHeight: parent.height + Row{ + height: 30 + width: parent.width + Label{ + text: "备注" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + } + Label{ + text: "清除" + color: "#FFAB00" + anchors.right: parent.right + } + } + MultiLineTextBox{ + anchors.top: parent.top + anchors.topMargin: 20 + width: parent.width + height: 96 + placeholderText: "添加备注（最多60字）" + background: InputBackground { + activeColor: "#22C55E" + radius: 5 + color: { + if(!parent.enabled){ + return parent.FluentUI.theme.res.controlFillColorDisabled + }else if(parent.activeFocus){ + return parent.FluentUI.theme.res.controlFillColorInputActive + }else if(parent.hovered){ + return parent.FluentUI.theme.res.controlFillColorSecondary + }else{ + return parent.FluentUI.theme.res.controlFillColorDefault + } + } + target: parent + } + } + } + } + + // form + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 35 + Row{ + Layout.fillWidth: true + Layout.preferredHeight: parent.height + Label{ + text: "显示级别：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ComboBox{ + spacing: 0 + model: [1,2,3,4,5,6,7,8,9,10] + width: 70 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + Label{ + text: "-" + anchors.verticalCenter: parent.verticalCenter + } + ComboBox{ + model: [10,11,12,13,14,15,16,17,18,19,20] + width: 70 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + } + Row{ + Layout.fillWidth: true + Layout.fillHeight: true + Label{ + text: "叠放层数：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ComboBox{ + spacing: 0 + model: [1,2,3,4,5,6,7,8,9,10] + width: 100 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + } + Row{ + Layout.fillWidth: true + Layout.fillHeight: true + Label{ + text: "名称位置：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ComboBox{ + spacing: 0 + model: ["自动"] + width: 100 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + } + } + + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 35 + + Row{ + Layout.fillWidth: true + Layout.fillHeight: true + Label{ + text: "经度坐标：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + TextBox{ + width: 145 + height: 30 + anchors.verticalCenter: parent.verticalCenter + placeholderText: "请输入经度坐标" + background: InputBackground { + activeColor: "#22C55E" + radius: 5 + color: { + if(!parent.enabled){ + return parent.FluentUI.theme.res.controlFillColorDisabled + }else if(parent.activeFocus){ + return parent.FluentUI.theme.res.controlFillColorInputActive + }else if(parent.hovered){ + return parent.FluentUI.theme.res.controlFillColorSecondary + }else{ + return parent.FluentUI.theme.res.controlFillColorDefault + } + } + target: parent + } + } + } + + Row{ + Layout.fillWidth: true + Layout.fillHeight: true + Label{ + text: "纬度坐标：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + TextBox{ + width: 100 + height: 30 + anchors.verticalCenter: parent.verticalCenter + placeholderText: "请输入纬度坐标" + background: InputBackground { + activeColor: "#22C55E" + radius: 5 + color: { + if(!parent.enabled){ + return parent.FluentUI.theme.res.controlFillColorDisabled + }else if(parent.activeFocus){ + return parent.FluentUI.theme.res.controlFillColorInputActive + }else if(parent.hovered){ + return parent.FluentUI.theme.res.controlFillColorSecondary + }else{ + return parent.FluentUI.theme.res.controlFillColorDefault + } + } + target: parent + } + } + } + + Row{ + Layout.fillWidth: true + Layout.fillHeight: true + Label{ + text: "海拔高度：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + TextBox{ + width: 100 + height: 30 + anchors.verticalCenter: parent.verticalCenter + placeholderText: "请输入海拔高度" + background: InputBackground { + activeColor: "#22C55E" + radius: 5 + color: { + if(!parent.enabled){ + return parent.FluentUI.theme.res.controlFillColorDisabled + }else if(parent.activeFocus){ + return parent.FluentUI.theme.res.controlFillColorInputActive + }else if(parent.hovered){ + return parent.FluentUI.theme.res.controlFillColorSecondary + }else{ + return parent.FluentUI.theme.res.controlFillColorDefault + } + } + target: parent + } + } + } + + } + + + + Item{ + Layout.fillHeight: true + } + + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 70 + color: "#1b1b1b" + Layout.topMargin: 0 + Layout.leftMargin: -20 + Layout.rightMargin: -20 + Layout.bottomMargin: 4 + RowLayout{ + anchors.fill: parent + anchors.leftMargin: 20 + anchors.rightMargin: 20 + spacing: 20 + Button{ + Layout.fillWidth: true + Layout.preferredHeight: 36 + text: "取消" + onClicked: { + dia_win.close() + } + } + Button{ + Layout.fillWidth: true + Layout.preferredHeight: 36 + text: "确认" + highlighted: true + background: Rectangle{ + radius: 5 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + } + } + } + } + + } + } +} diff --git a/Gallery/res/qml/component/window/EditIconWindow.qml b/Gallery/res/qml/component/window/EditIconWindow.qml new file mode 100644 index 0000000..8670e3d --- /dev/null +++ b/Gallery/res/qml/component/window/EditIconWindow.qml @@ -0,0 +1,426 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt5Compat.GraphicalEffects +import "../base" + +MyDialogWindow { + id: dia_win + title: "图标样式编辑" + Rectangle { + implicitWidth: 825 + implicitHeight: 400 + color: "transparent" + ColumnLayout{ + anchors.fill: parent + anchors.leftMargin: 10 + anchors.topMargin: 10 + anchors.rightMargin: 10 + spacing: 30 + + + // prev + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 98 + color: "#000000" + radius: 6 + Rectangle{ + anchors.top: parent.top + anchors.left: parent.left + anchors.topMargin: 5 + anchors.leftMargin: 5 + radius: 3 + width: 15 + height: 15 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + Rectangle{ + width: 11 + height: 11 + color: "#000" + border.color: Qt.rgba(1, 1, 1, 0.3) + border.width: 1 + radius: 4 + anchors.centerIn: parent + } + } + Rectangle{ + anchors.top: parent.top + anchors.left: parent.left + anchors.topMargin: 5 + anchors.leftMargin: 25 + radius: 3 + width: 15 + height: 15 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: Qt.rgba(1, 1, 1, 0.1) } + GradientStop { position: 1.0; color: Qt.rgba(1, 1, 1, 0.1) } + } + Rectangle{ + width: 11 + height: 11 + color: "#fff" + border.color: Qt.rgba(1, 1, 1, 0.3) + border.width: 1 + radius: 4 + anchors.centerIn: parent + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + parent.gradient.stops[0].color = "#77ED8B" + parent.gradient.stops[1].color = "#22C55E" + } + onExited: { + parent.gradient.stops[0].color = Qt.rgba(1, 1, 1, 0.1) + parent.gradient.stops[1].color = Qt.rgba(1, 1, 1, 0.1) + } + } + } + Rectangle{ + anchors.top: parent.top + anchors.left: parent.left + anchors.topMargin: 5 + anchors.leftMargin: 45 + radius: 3 + width: 15 + height: 15 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: Qt.rgba(1, 1, 1, 0.1) } + GradientStop { position: 1.0; color: Qt.rgba(1, 1, 1, 0.1) } + } + Rectangle{ + width: 11 + height: 11 + color: "#7F7F7F" + border.color: Qt.rgba(1, 1, 1, 0.3) + border.width: 1 + radius: 4 + anchors.centerIn: parent + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + parent.gradient.stops[0].color = "#77ED8B" + parent.gradient.stops[1].color = "#22C55E" + } + onExited: { + parent.gradient.stops[0].color = Qt.rgba(1, 1, 1, 0.1) + parent.gradient.stops[1].color = Qt.rgba(1, 1, 1, 0.1) + } + } + } + Rectangle{ + anchors.top: parent.top + anchors.left: parent.left + anchors.topMargin: 5 + anchors.leftMargin: 65 + radius: 3 + width: 15 + height: 15 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: Qt.rgba(1, 1, 1, 0.1) } + GradientStop { position: 1.0; color: Qt.rgba(1, 1, 1, 0.1) } + } + Rectangle{ + width: 11 + height: 11 + color: "#000" + border.color: Qt.rgba(1, 1, 1, 0.3) + border.width: 1 + radius: 4 + anchors.centerIn: parent + Rectangle{ + x: 5 + y: 2 + width: 1 + height: 6 + color: Qt.rgba(1, 1, 1, 0.3) + transform: Rotation { origin.x: 0; origin.y: 3;angle: 45;} + } + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + parent.gradient.stops[0].color = "#77ED8B" + parent.gradient.stops[1].color = "#22C55E" + } + onExited: { + parent.gradient.stops[0].color = Qt.rgba(1, 1, 1, 0.1) + parent.gradient.stops[1].color = Qt.rgba(1, 1, 1, 0.1) + } + } + } + + Rectangle{ + anchors.centerIn: parent + width: img_prev.width + 10 + height: img_prev.height + 10 + color: "transparent" + Image{ + id: img_prev + anchors.centerIn: parent + fillMode: Image.PreserveAspectFit + height: 70 + source: "qrc:/qt/qml/Gallery/res/image/icons/dw.png" + } + } + + } + + // form + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 35 + Row{ + spacing: 5 + Layout.preferredWidth: 120 + Layout.preferredHeight: parent.height + Label{ + text: "颜色：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ColorPicker{ + implicitHeight: 30 + leftPadding: 3 + topPadding: 3 + rightPadding: 2 + bottomPadding: 2 + anchors.verticalCenter: parent.verticalCenter + } + } + Row{ + spacing: 5 + Layout.preferredWidth: 130 + Layout.preferredHeight: parent.height + Label{ + text: "比例：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ComboBox{ + spacing: 0 + model: ['1.0','2.0','3.0'] + width: 80 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + } + Row{ + spacing: 5 + Layout.preferredWidth: 80 + Layout.preferredHeight: parent.height + Label{ + text: "中点：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + AnchorChoose{} + } + Row{ + spacing: 5 + Layout.preferredWidth: 150 + Layout.preferredHeight: parent.height + Label{ + text: "透明度：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ComboBox{ + spacing: 0 + model: ['100%','50%','30%'] + width: 80 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + } + Row{ + spacing: 1 + Layout.fillWidth: true + Layout.preferredHeight: parent.height + Switch { + width: 45 + text: "" + checked: true + FluentUI.primaryColor: "#77ED8B" + anchors.verticalCenter: parent.verticalCenter + } + Label{ + text: "描边：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ColorPicker{ + implicitHeight: 30 + leftPadding: 3 + topPadding: 3 + rightPadding: 2 + bottomPadding: 2 + anchors.verticalCenter: parent.verticalCenter + } + Item{ + width: 5 + height: 10 + } + ComboBox{ + spacing: 0 + model: ['外部','内部','中部'] + width: 80 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + Item{ + width: 5 + height: 10 + } + TextBox{ + width: 60 + anchors.verticalCenter: parent.verticalCenter + height: 30 + placeholderText: "1" + background: InputBackground { + activeColor: "#22C55E" + radius: 5 + color: { + if(!parent.enabled){ + return parent.FluentUI.theme.res.controlFillColorDisabled + }else if(parent.activeFocus){ + return parent.FluentUI.theme.res.controlFillColorInputActive + }else if(parent.hovered){ + return parent.FluentUI.theme.res.controlFillColorSecondary + }else{ + return parent.FluentUI.theme.res.controlFillColorDefault + } + } + target: parent + } + } + } + } + + // icons + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 200 + color: "#000000" + radius: 6 + Item{ + anchors.fill: parent + anchors.leftMargin: 10 + anchors.rightMargin: 10 + anchors.bottomMargin: 10 + anchors.topMargin: 10 + Rectangle{ + width: 40 + height: 40 + color: Qt.rgba(255/255,255/255,255/255, 0.1) + radius: 5 + border.width: 1 + border.color: "#77ED8B" + Image{ + anchors.centerIn: parent + fillMode: Image.PreserveAspectFit + width: 20 + source: "qrc:/qt/qml/Gallery/res/image/icons/dw.png" + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + parent.color = Qt.rgba(255/255,255/255,255/255, 0.2) + parent.border.color = "#77ED8B" + } + onExited: { + parent.color = Qt.rgba(216/255,216/255,216/255, 0.1) + parent.border.color = "#77ED8B" + } + } + } + Rectangle{ + width: 40 + height: 40 + x: 45 + color: Qt.rgba(255/255,255/255,255/255, 0.1) + radius: 5 + border.width: 1 + border.color: "transparent" + Image{ + anchors.centerIn: parent + fillMode: Image.PreserveAspectFit + width: 20 + source: "qrc:/qt/qml/Gallery/res/image/icons/car.png" + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + parent.color = Qt.rgba(255/255,255/255,255/255, 0.2) + parent.border.color = "#77ED8B" + } + onExited: { + parent.color = Qt.rgba(216/255,216/255,216/255, 0.1) + parent.border.color = "transparent" + } + } + } + } + } + + Item{ + Layout.fillHeight: true + } + + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 70 + color: "#1b1b1b" + Layout.topMargin: 0 + Layout.leftMargin: -20 + Layout.rightMargin: -20 + Layout.bottomMargin: 4 + RowLayout{ + anchors.fill: parent + anchors.leftMargin: 20 + anchors.rightMargin: 20 + spacing: 20 + Button{ + Layout.fillWidth: true + Layout.preferredHeight: 36 + text: "取消" + onClicked: { + dia_win.close() + } + } + Button{ + Layout.fillWidth: true + Layout.preferredHeight: 36 + text: "确认" + highlighted: true + background: Rectangle{ + radius: 5 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + } + } + } + } + + } + } +} diff --git a/Gallery/res/qml/component/window/FontEditWindow.qml b/Gallery/res/qml/component/window/FontEditWindow.qml new file mode 100644 index 0000000..01fe8f5 --- /dev/null +++ b/Gallery/res/qml/component/window/FontEditWindow.qml @@ -0,0 +1,400 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import Qt5Compat.GraphicalEffects +import "../base" + +MyDialogWindow { + id: dia_win + title: "字体样式编辑" + Rectangle { + implicitWidth: 670 + implicitHeight: 360 + color: "transparent" + ColumnLayout{ + anchors.fill: parent + anchors.leftMargin: 10 + anchors.topMargin: 10 + anchors.rightMargin: 10 + spacing: 30 + + + // prev + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 98 + color: "#000000" + radius: 6 + Rectangle{ + anchors.top: parent.top + anchors.left: parent.left + anchors.topMargin: 5 + anchors.leftMargin: 5 + radius: 3 + width: 15 + height: 15 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + Rectangle{ + width: 11 + height: 11 + color: "#000" + border.color: Qt.rgba(1, 1, 1, 0.3) + border.width: 1 + radius: 4 + anchors.centerIn: parent + } + } + Rectangle{ + anchors.top: parent.top + anchors.left: parent.left + anchors.topMargin: 5 + anchors.leftMargin: 25 + radius: 3 + width: 15 + height: 15 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: Qt.rgba(1, 1, 1, 0.1) } + GradientStop { position: 1.0; color: Qt.rgba(1, 1, 1, 0.1) } + } + Rectangle{ + width: 11 + height: 11 + color: "#fff" + border.color: Qt.rgba(1, 1, 1, 0.3) + border.width: 1 + radius: 4 + anchors.centerIn: parent + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + parent.gradient.stops[0].color = "#77ED8B" + parent.gradient.stops[1].color = "#22C55E" + } + onExited: { + parent.gradient.stops[0].color = Qt.rgba(1, 1, 1, 0.1) + parent.gradient.stops[1].color = Qt.rgba(1, 1, 1, 0.1) + } + } + } + Rectangle{ + anchors.top: parent.top + anchors.left: parent.left + anchors.topMargin: 5 + anchors.leftMargin: 45 + radius: 3 + width: 15 + height: 15 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: Qt.rgba(1, 1, 1, 0.1) } + GradientStop { position: 1.0; color: Qt.rgba(1, 1, 1, 0.1) } + } + Rectangle{ + width: 11 + height: 11 + color: "#7F7F7F" + border.color: Qt.rgba(1, 1, 1, 0.3) + border.width: 1 + radius: 4 + anchors.centerIn: parent + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + parent.gradient.stops[0].color = "#77ED8B" + parent.gradient.stops[1].color = "#22C55E" + } + onExited: { + parent.gradient.stops[0].color = Qt.rgba(1, 1, 1, 0.1) + parent.gradient.stops[1].color = Qt.rgba(1, 1, 1, 0.1) + } + } + } + Rectangle{ + anchors.top: parent.top + anchors.left: parent.left + anchors.topMargin: 5 + anchors.leftMargin: 65 + radius: 3 + width: 15 + height: 15 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: Qt.rgba(1, 1, 1, 0.1) } + GradientStop { position: 1.0; color: Qt.rgba(1, 1, 1, 0.1) } + } + Rectangle{ + width: 11 + height: 11 + color: "#000" + border.color: Qt.rgba(1, 1, 1, 0.3) + border.width: 1 + radius: 4 + anchors.centerIn: parent + Rectangle{ + x: 5 + y: 2 + width: 1 + height: 6 + color: Qt.rgba(1, 1, 1, 0.3) + transform: Rotation { origin.x: 0; origin.y: 3;angle: 45;} + } + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + parent.gradient.stops[0].color = "#77ED8B" + parent.gradient.stops[1].color = "#22C55E" + } + onExited: { + parent.gradient.stops[0].color = Qt.rgba(1, 1, 1, 0.1) + parent.gradient.stops[1].color = Qt.rgba(1, 1, 1, 0.1) + } + } + } + + Rectangle{ + anchors.centerIn: parent + width: lbl_prev.width + 10 + height: lbl_prev.height + 10 + color: "#ccc" + Label { + id: lbl_prev + text: "预览文字内容" + anchors.centerIn: parent + } + } + + } + + // form + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 35 + Row{ + spacing: 5 + Layout.fillWidth: true + Layout.preferredHeight: parent.height + Label{ + text: "字体：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ComboBox{ + spacing: 0 + model: ["微软雅黑", "宋体", "楷体"] + width: 120 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + ComboBox{ + spacing: 0 + model: ["正常", "粗体", "斜体"] + width: 120 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + } + Row{ + spacing: 5 + Layout.fillWidth: true + Layout.preferredHeight: parent.height + Label{ + text: "字号：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ComboBox{ + spacing: 0 + model: [9,10,11,12,13,14,15,16,17,18] + width: 115 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + } + Row{ + spacing: 5 + Layout.fillWidth: true + Layout.preferredHeight: parent.height + Label{ + text: "间距：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ComboBox{ + spacing: 0 + model: ['10%', '20%', '50%'] + width: 115 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + } + } + + RowLayout{ + Layout.fillWidth: true + Layout.preferredHeight: 35 + Row{ + spacing: 5 + Layout.preferredWidth: 150 + Layout.preferredHeight: parent.height + Label{ + text: "颜色：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ColorPicker{ + implicitHeight: 30 + leftPadding: 3 + topPadding: 3 + rightPadding: 2 + bottomPadding: 2 + anchors.verticalCenter: parent.verticalCenter + } + } + Row{ + spacing: 1 + Layout.fillWidth: true + Layout.preferredHeight: parent.height + Switch { + width: 45 + text: "" + checked: true + FluentUI.primaryColor: "#77ED8B" + anchors.verticalCenter: parent.verticalCenter + } + Label{ + text: "描边：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ColorPicker{ + implicitHeight: 30 + leftPadding: 3 + topPadding: 3 + rightPadding: 2 + bottomPadding: 2 + anchors.verticalCenter: parent.verticalCenter + } + Item{ + width: 5 + height: 10 + } + ComboBox{ + spacing: 0 + model: ['外部','内部','中部'] + width: 80 + height: 30 + anchors.verticalCenter: parent.verticalCenter + } + Item{ + width: 5 + height: 10 + } + TextBox{ + width: 60 + anchors.verticalCenter: parent.verticalCenter + height: 30 + placeholderText: "1" + background: InputBackground { + activeColor: "#22C55E" + radius: 5 + color: { + if(!parent.enabled){ + return parent.FluentUI.theme.res.controlFillColorDisabled + }else if(parent.activeFocus){ + return parent.FluentUI.theme.res.controlFillColorInputActive + }else if(parent.hovered){ + return parent.FluentUI.theme.res.controlFillColorSecondary + }else{ + return parent.FluentUI.theme.res.controlFillColorDefault + } + } + target: parent + } + } + } + Row{ + spacing: 1 + Layout.preferredWidth: 175 + Layout.preferredHeight: parent.height + Switch { + width: 45 + text: "" + checked: true + FluentUI.primaryColor: "#77ED8B" + anchors.verticalCenter: parent.verticalCenter + } + Label{ + text: "背景色：" + color: Qt.rgba(255/255,255/255,255/255, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + ColorPicker{ + implicitHeight: 30 + leftPadding: 3 + topPadding: 3 + rightPadding: 2 + bottomPadding: 2 + anchors.verticalCenter: parent.verticalCenter + } + } + } + + + Item{ + Layout.fillHeight: true + } + + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 70 + color: "#1b1b1b" + Layout.topMargin: 0 + Layout.leftMargin: -20 + Layout.rightMargin: -20 + Layout.bottomMargin: 4 + RowLayout{ + anchors.fill: parent + anchors.leftMargin: 20 + anchors.rightMargin: 20 + spacing: 20 + Button{ + Layout.fillWidth: true + Layout.preferredHeight: 36 + text: "取消" + onClicked: { + dia_win.close() + } + } + Button{ + Layout.fillWidth: true + Layout.preferredHeight: 36 + text: "确认" + highlighted: true + background: Rectangle{ + radius: 5 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + } + } + } + } + + } + } +} diff --git a/Gallery/res/qml/component/window/SearchNearWindow.qml b/Gallery/res/qml/component/window/SearchNearWindow.qml new file mode 100644 index 0000000..4dc2d6e --- /dev/null +++ b/Gallery/res/qml/component/window/SearchNearWindow.qml @@ -0,0 +1,341 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl +import "../base" + +MyDialogWindow { + id: dia_newproject + title: "搜索周边" + property var p_show_result: false + + Rectangle { + id: near_container + implicitWidth: 610 + implicitHeight: 230 + + color: "transparent" + ColumnLayout{ + anchors.fill: parent + anchors.leftMargin: 10 + anchors.topMargin: 10 + anchors.rightMargin: 10 + RowLayout{ + spacing: 20 + Layout.fillWidth: true + TextBox{ + Layout.preferredWidth: 400 + Layout.preferredHeight: 44 + placeholderText: "请输入搜索内容" + } + ComboBox{ + Layout.preferredWidth: 170 + Layout.preferredHeight: 44 + model: ListModel { + ListElement { text: "附近0.5公里" } + ListElement { text: "附近1公里" } + ListElement { text: "附近2公里" } + ListElement { text: "附近3公里" } + ListElement { text: "附近4公里" } + ListElement { text: "附近5公里" } + } + } + } + + Label{ + Layout.topMargin: 15 + text: "选择类型：" + color: "#9E9E9E" + } + + RowLayout{ + Layout.preferredHeight: 40 + Layout.topMargin: -20 + Item{ + Layout.fillWidth: true + RowLayout{ + RadioButton { + text: "陆港" + checked: true + FluentUI.primaryColor: "#77ED8B" + } + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/ico_lg.png" + Layout.preferredHeight: 15 + Layout.preferredWidth: 15 + } + } + } + Item{ + Layout.fillWidth: true + RowLayout{ + RadioButton { + text: "充换电站" + checked: false + FluentUI.primaryColor: "#77ED8B" + } + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/ico_tp_ele.png" + Layout.preferredHeight: 15 + Layout.preferredWidth: 15 + } + } + } + Item{ + Layout.fillWidth: true + RowLayout{ + RadioButton { + text: "补能站" + checked: false + FluentUI.primaryColor: "#77ED8B" + } + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/ico_tp_h2.png" + Layout.preferredHeight: 15 + Layout.preferredWidth: 15 + } + } + } + Item{ + Layout.fillWidth: true + RowLayout{ + RadioButton { + text: "住宿" + checked: false + FluentUI.primaryColor: "#77ED8B" + } + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/ico_zs.png" + Layout.preferredHeight: 15 + Layout.preferredWidth: 15 + } + } + } + Item{ + Layout.fillWidth: true + RowLayout{ + RadioButton { + text: "餐饮" + checked: false + FluentUI.primaryColor: "#77ED8B" + } + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/ico_cy.png" + Layout.preferredHeight: 15 + Layout.preferredWidth: 15 + } + } + } + } + + // Item{ + // Layout.fillHeight: true + // } + + Rectangle{ + Layout.fillWidth: true + Layout.preferredHeight: 60 + color: "#1b1b1b" + Layout.topMargin: 10 + Layout.leftMargin: -20 + Layout.rightMargin: -20 + Layout.bottomMargin: 4 + RowLayout{ + anchors.fill: parent + anchors.leftMargin: 20 + anchors.rightMargin: 20 + spacing: 20 + Button{ + Layout.fillWidth: true + Layout.preferredHeight: 36 + text: "取消" + onClicked: { + dia_newproject.close() + } + } + Button{ + Layout.fillWidth: true + Layout.preferredHeight: 36 + text: "确认" + highlighted: true + background: Rectangle{ + radius: 5 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + } + onClicked: { + near_container.implicitHeight = 230 + 300 + p_show_result = true + } + } + } + } + + ScrollView{ + visible: p_show_result + Layout.fillWidth: true + // Layout.fillHeight: true + Layout.preferredHeight: 300 + Layout.topMargin: -20 + + ColumnLayout{ + anchors.left: parent.left + anchors.right: parent.right + + Repeater{ + model: ListModel{ + ListElement{ + title: "迎宾餐馆（天台路店）迎宾餐馆（天台路店）迎宾餐馆（天台路店）" + address: "内蒙古自治区通辽市科尔沁左翼中旗图布信苏木乡421号600室内蒙古自治区通辽市科尔沁左翼中旗图布信苏木乡421号600室" + phone: "333-62752114" + } + ListElement{ + title: "迎宾餐馆（天台路店）" + address: "内蒙古自治区通辽市科尔沁左翼中旗图布信苏木乡421号600室" + phone: "333-62752114" + } + ListElement{ + title: "迎宾餐馆（天台路店）" + address: "内蒙古自治区通辽市科尔沁左翼中旗图布信苏木乡421号600室" + phone: "333-62752114" + } + ListElement{ + title: "迎宾餐馆（天台路店）" + address: "内蒙古自治区通辽市科尔沁左翼中旗图布信苏木乡421号600室" + phone: "333-62752114" + } + } + + Rectangle{ + id: res_rect + Layout.preferredHeight: 83 + Layout.preferredWidth: parent.width + color: Qt.rgba(1, 1, 1, 0.05) + radius: 8 + Row{ + anchors.fill: parent + anchors.leftMargin: 8 + anchors.topMargin: 10 + anchors.rightMargin: 5 + anchors.bottomMargin: 5 + Column{ + spacing: 3 + anchors.left: parent.left + anchors.top: parent.top + anchors.bottom: parent.bottom + Label{ + text: model.title + font.pointSize: 12 + elide: Text.ElideRight + width: res_rect.width - 180 + } + Label{ + anchors.top: parent.top + anchors.topMargin: 33 + text: model.address + font.pointSize: 10 + color: Qt.rgba(1, 1, 1, 0.6) + elide: Text.ElideRight + width: res_rect.width - 180 + } + Row{ + anchors.bottom: parent.bottom + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/ico_phone.png" + anchors.verticalCenter: parent.verticalCenter + } + + Label{ + anchors.verticalCenter: parent.verticalCenter + text: model.phone + font.pointSize: 10 + } + } + } + Column{ + anchors.right: parent.right + anchors.top: parent.top + Rectangle{ + width: 97 + height: 26 + color: Qt.rgba(255/255,255/255,255/255, 0.05) + anchors.right: parent.right + radius: 5 + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/ico_add_lay.png" + anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left + anchors.leftMargin: 5 + } + Label{ + text: "添加到图层" + anchors.left: parent.left + anchors.leftMargin: 24 + anchors.top: parent.top + anchors.topMargin: 3 + color: "#77ED8B" + } + MouseArea{ + anchors.fill: parent + hoverEnabled: true + onEntered: { + parent.color = Qt.rgba(255/255,255/255,255/255, 0.15) + } + onExited: { + parent.color = Qt.rgba(255/255,255/255,255/255, 0.05) + } + onClicked: { + console.log("open") + } + } + } + + Row{ + anchors.top: parent.top + anchors.topMargin: 35 + anchors.right: parent.right + spacing: 10 + Label{ + text: "1.6km" + color: Qt.rgba(1, 1, 1, 0.6) + anchors.verticalCenter: parent.verticalCenter + } + + Rectangle{ + width: 97 + height: 26 + radius: 5 + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.0; color: "#77ED8B" } + GradientStop { position: 1.0; color: "#22C55E" } + } + Row{ + anchors.centerIn: parent + Label{ + text: "导航" + color: "#2a2a2a" + } + Image{ + source: "qrc:/qt/qml/Gallery/res/image/components/map/ico_nav.png" + } + } + } + } + } + } + } + + } + + + } + } + } + } +} + diff --git a/Gallery/res/qml/dataconnect/DataConnect.qml b/Gallery/res/qml/dataconnect/DataConnect.qml new file mode 100644 index 0000000..60c3a6e --- /dev/null +++ b/Gallery/res/qml/dataconnect/DataConnect.qml @@ -0,0 +1,12 @@ +pragma Singleton + +import QtQuick +import QtQuick.Controls +import FluentUI.Controls +import FluentUI.impl + +QtObject { + id: control + + signal goHome(var param) +} diff --git a/Gallery/res/qml/page/T_FileTreeData.qml b/Gallery/res/qml/page/T_FileTreeData.qml index fb2e4a4..f3ed688 100644 --- a/Gallery/res/qml/page/T_FileTreeData.qml +++ b/Gallery/res/qml/page/T_FileTreeData.qml @@ -33,6 +33,7 @@ ContentPage { return __display === control.current } ListTile{ + id: list_tile anchors.fill: parent text: String(__display) leftPadding: 6 + rowModel.depth * control.depthPadding @@ -95,7 +96,7 @@ ContentPage { } } - clip: true + // clip: true function toggle(){ if(rowModel.expanded){ dataModel.collapse(rowModel.index) @@ -103,6 +104,70 @@ ContentPage { dataModel.expand(rowModel.index) } } + + DropArea { + id: dropArea + anchors.fill: parent + onDropped: { + dragRect.color = "lightgreen" + console.log(drop.dragItemIndex) + } + onEntered: { + console.log(drag.source.DelegateModel.itemsIndex) + dragRect.color = "lightblue" + } + onExited: { + dragRect.color = "#ffffff" + } + } + + Rectangle { + id: dragRect + width: 30 + height: parent.height + color: "white" + + Text { + text: "123" + anchors.verticalCenter: parent.verticalCenter + anchors.left: parent.left + anchors.leftMargin: 10 + } + + MouseArea { + id: dragArea + anchors.fill: parent + drag.target: parent + // drag.axis: Drag.YAxis + //propagateComposedEvents: true + onClicked: { + // mouse.accepted = false + console.log("click") + } + + onPressed: { + // 将方块置于最顶层，使其在拖动时不会被其他元素遮挡 + // dragRect.z = 10000 + dragRect.visible = true + // mouse.accepted = false + } + onReleased: { + // dragRect.z = 1 + dragRect.x = 0 + dragRect.y = 0 + dragRect.Drag.drop() + // mouse.accepted = false + // if (dragArea.containsDrag) { + // treeModel.move(rowModel.index, treeView.indexAt(dragArea.mouseX, dragArea.mouseY)) + // } + } + } + + Drag.active: dragArea.drag.active + Drag.hotSpot.x: dragArea.width / 2 + Drag.hotSpot.y: dragArea.height / 2 + Drag.source: dragRect + } } } TreeDataGridModel{ diff --git a/Gallery/res/qml/screen/LoginScreen.qml b/Gallery/res/qml/screen/LoginScreen.qml index b962c39..509595b 100644 --- a/Gallery/res/qml/screen/LoginScreen.qml +++ b/Gallery/res/qml/screen/LoginScreen.qml @@ -6,6 +6,9 @@ import FluentUI.impl import Gallery Item{ + id: control + property var baseImg: "qrc:/qt/qml/Gallery/" + property var show_type: "login" Connections{ target: window function onInit(arg){ @@ -16,56 +19,261 @@ Item{ LoginViewModel{ id: viewModel } - ColumnLayout { + + RowLayout{ spacing: 20 - anchors.centerIn: parent - width: 260 - Label { - elide: Label.ElideRight - text: qsTr("Please enter the credentials:") + anchors.fill: parent + Rectangle{ Layout.fillWidth: true + Layout.fillHeight: true + color: "transparent" + Image{ + anchors.left: parent.left + anchors.leftMargin: 40 + width: parent.width - 70 + fillMode: Image.PreserveAspectFit + source: baseImg + "res/image/img/lg.png" + anchors.centerIn: parent + } } - TextField { - id: textbox_username - focus: true - placeholderText: qsTr("Username") - Layout.fillWidth: true - text: viewModel.username - Binding { viewModel.username: textbox_username.text } - } - TextField { - id: textbox_password - placeholderText: qsTr("Password") - echoMode: TextField.Password - Layout.fillWidth: true - text: viewModel.password - Binding { viewModel.password: textbox_password.text } - } - Item{ - implicitHeight: 40 - Layout.fillWidth: true - Button{ - text: qsTr("Cancel") - anchors{ - left: parent.left - verticalCenter: parent.verticalCenter + Rectangle{ + Layout.preferredWidth: 300 + Layout.preferredHeight: (control.show_type == "login" || control.show_type == "regist") ? 350 : 400 + color: "transparent" + ColumnLayout { + id: com_login + visible: control.show_type == "login" + anchors.fill: parent + anchors.rightMargin: 40 + spacing: 20 + anchors.centerIn: parent + Label { + elide: Label.ElideRight + text: "欢迎使用" + Layout.fillWidth: true + font.pointSize: 15 } - onClicked: { - window.close() + TextField { + id: textbox_username + focus: true + placeholderText: "手机号码" + Layout.fillWidth: true + text: viewModel.username + Binding { viewModel.username: textbox_username.text } + } + TextField { + id: textbox_password + placeholderText: "密码" + echoMode: TextField.Password + Layout.fillWidth: true + text: viewModel.password + Binding { viewModel.password: textbox_password.text } + } + Item{ + Layout.fillWidth: true + Layout.preferredHeight: 10 + RowLayout{ + CheckBox { + text: "我已阅读并同意服务协议和隐私协议" + checked: false + } + } + } + Item{ + implicitHeight: 40 + Layout.fillWidth: true + FilledButton{ + text: "立即登录" + anchors.fill: parent + onClicked: { + viewModel.login() + // window.setResult({password:viewModel.password}) + WindowRouter.go("/",{type:"WindowType.Standard"}) + window.close() + } + } + } + Item{ + Layout.preferredHeight: 30 + Layout.fillWidth: true + HyperlinkButton{ + anchors.centerIn: parent + text: "忘记密码" + onClicked: { + console.log("forget...") + } + } + } + + Item{ + Layout.fillWidth: true + RowLayout{ + anchors.centerIn: parent + Label { + text: "还没有账号？" + color: "#909090" + } + HyperlinkButton{ + text: "立即注册" + onClicked: { + control.show_type = "regist" + } + } + } } } - FilledButton{ - text: qsTr("Login") - anchors{ - right: parent.right - verticalCenter: parent.verticalCenter + + ColumnLayout { + + id: com_regist + visible: control.show_type == "regist" + anchors.fill: parent + anchors.rightMargin: 40 + spacing: 20 + anchors.centerIn: parent + Label { + elide: Label.ElideRight + text: "欢迎使用" + Layout.fillWidth: true + font.pointSize: 15 } - onClicked: { - viewModel.login() - window.setResult({password:viewModel.password}) - window.close() + TextField { + focus: true + placeholderText: "手机号码" + Layout.fillWidth: true + } + Item{ + Layout.fillWidth: true + Layout.preferredHeight: 30 + RowLayout{ + anchors.fill: parent + spacing: 10 + TextField { + placeholderText: "验证码" + Layout.preferredWidth: 170 + } + Button{ + text: "获取验证码" + } + } + } + Item{ + Layout.fillWidth: true + Layout.preferredHeight: 10 + RowLayout{ + CheckBox { + text: "我已阅读并同意服务协议和隐私协议" + checked: false + } + } + } + Item{ + implicitHeight: 40 + Layout.fillWidth: true + FilledButton{ + text: "立即注册" + anchors.fill: parent + onClicked: { + control.show_type = "setinfo" + // viewModel.login() + // window.setResult({password:viewModel.password}) + // window.close() + } + } + } + + Item{ + Layout.preferredHeight: 30 + } + + Item{ + Layout.fillWidth: true + RowLayout{ + anchors.centerIn: parent + Label { + text: "已有账号？" + color: "#909090" + } + HyperlinkButton{ + text: "立即登录" + onClicked: { + control.show_type = "login" + } + } + } + } + } + + ColumnLayout { + id: com_setinfo + visible: control.show_type == "setinfo" + anchors.fill: parent + anchors.rightMargin: 40 + spacing: 20 + anchors.centerIn: parent + Label { + elide: Label.ElideRight + text: "设置个人信息" + Layout.fillWidth: true + font.pointSize: 15 + } + Item{ + Layout.fillWidth: true + Layout.preferredHeight: 50 + RowLayout{ + anchors.fill: parent + RoundImageView{ + width: 50 + height: 50 + radius: 25 + borderWidth: 2 + sourceSize: Qt.size(50,50) + source: control.baseImg + "res/image/avatars/300-1.jpg" + anchors{ + verticalCenter: parent.verticalCenter + } + } + Button{ + text: "上传头像" + } + } + } + + TextField { + placeholderText: "企业名称" + Layout.fillWidth: true + } + TextField { + placeholderText: "企业介绍" + Layout.fillWidth: true + } + TextField { + focus: true + placeholderText: "登录密码" + Layout.fillWidth: true + } + TextField { + placeholderText: "确认密码" + Layout.fillWidth: true + } + Item{ + implicitHeight: 40 + Layout.fillWidth: true + FilledButton{ + text: "保存并登录" + anchors.fill: parent + onClicked: { + viewModel.login() + //window.setResult({password:viewModel.password}) + WindowRouter.go("/",{type:"WindowType.Standard"}) + + window.close() + } + } } } } } + + } diff --git a/Gallery/res/qml/screen/MainPageScreen.qml b/Gallery/res/qml/screen/MainPageScreen.qml index 50b7c90..822bdf9 100644 --- a/Gallery/res/qml/screen/MainPageScreen.qml +++ b/Gallery/res/qml/screen/MainPageScreen.qml @@ -5,43 +5,152 @@ import FluentUI.Controls import FluentUI.impl import Gallery import "../component" +import "../dataconnect" +import "../component/window" +import "../component/base" Item { id: control anchors.fill: parent - property bool is_home: false + property bool is_home: true property bool show_right: false property var right_type: "point" + property var page_type: "home" + + AddPointWindow{ + id: add_point_win + onClickEditIcon: { + icon_edit_win.open() + } + onClickEditFont: { + font_edit_win.open() + } + } + FontEditWindow{ + id: font_edit_win + } + EditIconWindow{ + id: icon_edit_win + } + SearchNearWindow{ + id: search_near_win + } + + Menu { + id:map_right_menu + width: 140 + BaseMenuItem{ + show_img: false + show_key: false + m_text: "搜索周边" + onClickItem: { + search_near_win.open() + } + } + BaseMenuItem{ + show_img: false + show_key: false + m_text: "创建点位" + onClickItem: { + } + } + BaseMenuItem{ + show_img: false + show_key: false + m_text: "行政区域检索" + onClickItem: { + } + } + MenuSeparator { } + + BaseMenuItem{ + show_img: false + show_key: false + m_text: "放大" + onClickItem: { + } + } + BaseMenuItem{ + show_img: false + show_key: false + m_text: "缩小" + onClickItem: { + } + } + BaseMenuItem{ + show_img: false + show_key: false + m_text: "设为地图中心点" + onClickItem: { + } + } + BaseMenuItem{ + show_img: false + show_key: false + m_text: "经纬度" + onClickItem: { + } + } + MenuSeparator { } + BaseMenuItem{ + show_img: true + show_key: false + m_text: "设为起点" + m_width: 20 + m_height: 20 + m_hover: false + m_icon: "qrc:/qt/qml/Gallery/res/image/components/map/nav_start.png" + onClickItem: { + } + } + BaseMenuItem{ + show_img: true + show_key: false + m_text: "设为终点" + m_width: 20 + m_height: 20 + m_hover: false + m_icon: "qrc:/qt/qml/Gallery/res/image/components/map/nav_stop.png" + onClickItem: { + } + } + BaseMenuItem{ + show_img: true + show_key: false + m_text: "设为途径点" + m_width: 20 + m_height: 20 + m_hover: false + m_icon: "qrc:/qt/qml/Gallery/res/image/components/map/nav_mid.png" + onClickItem: { + } + } + background: Rectangle{ + width: 146 + color: "#191919" + radius: 8 + x: -3 + } + } + ColumnLayout { spacing: 3 width: parent.width height: parent.height - // TitleBar{ - // id: title_bar - // Layout.preferredWidth: parent.width - // onClickNav: (type, params) => { - // if (type == "home") { - // control.is_home = true - // } else if (type == "other") { - // control.is_home = false - // map_container.run_js("QT_Refresh", params) - // } - // // nav_main.visitUrl("/") - // } - // } - ToolBar{ Layout.fillWidth: true - Layout.preferredHeight: 40 + Layout.preferredHeight: 45 Layout.topMargin: 3 + Layout.leftMargin: 5 + Layout.rightMargin: 10 visible: !control.is_home Layout.preferredWidth: parent.width onClickButton: (fun) => { - control.show_right = false - com_info.reset_info() + // control.show_right = false + // com_info.reset_info() map_container.run_js(fun) } @@ -54,29 +163,28 @@ Item { Rectangle{ visible: control.is_home Layout.fillHeight: true - Layout.preferredWidth: 250 - color: "green" + Layout.preferredWidth: 220 + Layout.leftMargin: 5 + Layout.rightMargin: 3 + Layout.bottomMargin: 10 + radius: 5 + color: Qt.rgba(255/255,255/255,255/255, 0.05) // 主页的菜单。 + LeftMainMenu{ anchors.fill: parent + anchors.leftMargin: 10 + anchors.rightMargin: 10 + anchors.topMargin: 10 + onClickItem: function(data) { + control.page_type = "page" + console.log(data.uuid) + } + onClickHome: function() { + control.page_type = "home" + } } - - // LeftNavMenu{ - // id: nav_main - // height: parent.height - // onClickMenu: (item) => { - // if (item.key == "/") { - // control.is_home = true - // } else if (item.key == "/newproject") { - - // } else { - // console.log(item.title + ", filter list...") - // control.is_home = false - // title_bar.addTab(item.title, item.key) - // } - // } - // } } Rectangle{ @@ -84,142 +192,206 @@ Item { Layout.fillHeight: true Layout.fillWidth: true color: "transparent" - RightMainContent { + // RightMainContent { + // anchors.fill: parent + // onClickSee: function(data) { + // // title_bar.addTab(data.title, data.uuid) + // control.is_home = false + // } + // } + RightMainIntro{ + show_banner: control.page_type == "home" + show_tab: control.page_type == "home" + anchors.fill: parent onClickSee: function(data) { - title_bar.addTab(data.title, data.uuid) control.is_home = false } } } - // LeftProjectMenu{ - // visible: !control.is_home - // Layout.preferredWidth: 200 - // Layout.preferredHeight: parent.height - // } - LeftMainMenuTab{ - id: left_tab - visible: !control.is_home - Layout.preferredWidth: 230 - Layout.preferredHeight: parent.height - Layout.leftMargin: 10 - onClickMenuItem: function(data) { - console.log(JSON.stringify(data)) - if (data.type && data.type == "resource") { - map_container.run_js("QT_ZoomToResource", data.id) - } else { - map_container.run_js("QT_ZoomTo", [data.id]) - // 更新右侧 - com_info.update_only_data(data) + SplitView { + visible: !control.is_home + id:split_layout + Layout.fillWidth: true + Layout.fillHeight: true + orientation: Qt.Horizontal + // handle: Rectangle { + // implicitWidth: 4 + // color: "darkgray" + // } + Rectangle { + color: Qt.rgba(255/255,255/255,255/255, 0.05) + radius: 5 + clip: true + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.bottomMargin: 10 + anchors.left: parent.left + anchors.leftMargin: 5 + implicitWidth: 230 + implicitHeight: 200 + SplitView.minimumWidth: 230 + SplitView.minimumHeight: 200 + SplitView.maximumWidth: 400 + SplitView.maximumHeight: 400 + LeftMainMenuTab{ + id: left_tab + anchors.fill: parent + anchors.leftMargin: 5 + anchors.topMargin: 5 + anchors.rightMargin: 5 + + onClickMenuItem: function(data) { + if (data.type && data.type == "resource") { + map_container.run_js("QT_ZoomToResource", data.id) + } else { + map_container.run_js("QT_ZoomTo", [data.id]) + // 更新右侧 + control.right_type = data.right_type + com_info.update_only_data(data) + } + } + + onClickResource: function(data) { + map_container.run_js("QT_LoadResource", [data.type, data.title]) + // 需要更新元素tab数据 + } + + onLockItem: function(data) { + map_container.run_js("QT_LockItem", [data.id, data.lock]) + } + + onShowItem: function(data) { + map_container.run_js("QT_SetShowItem", [data.id, data.show]) + + com_info.reset_info() + control.show_right = false + } } } + Item { + clip: true + id: centerItem + SplitView.fillWidth: true + SplitView.fillHeight: true + // 中间地图 + Rectangle{ + anchors.fill: parent + color: "#000" + MapContainer{ + id: map_container + anchors.fill: parent + onAsyncMapInfo: function(data) { + // com_info.reset_info() + console.log("接受===" + data.type) + if (data.type == "point") { + add_point_win.open() + // control.right_type = data.type - onClickResource: function(data) { - map_container.run_js("QT_LoadResource", [data.type, data.title]) - // 需要更新元素tab数据 - } + // data.data.right_type = data.type + // com_info.update_design(data.data) - onLockItem: function(data) { - map_container.run_js("QT_LockItem", [data.id, data.lock]) - } + // left_tab.setMenuData(data.data) - onShowItem: function(data) { - map_container.run_js("QT_SetShowItem", [data.id, data.show]) + // control.show_right = true + } else if (data.type == "empty") { + control.show_right = false + com_info.reset_info() + } else if (data.type == "line") { + control.show_right = true + control.right_type = data.type + data.data.right_type = data.type - com_info.reset_info() - control.show_right = false - } - } + com_info.update_design(data.data) + left_tab.setMenuData(data.data) + } else if (data.type == "polygon") { + control.show_right = true + control.right_type = data.type + data.data.right_type = data.type - Rectangle{ - visible: !control.is_home - Layout.fillHeight: true - Layout.fillWidth: true - color: "transparent" - MapContainer{ - id: map_container - Layout.fillHeight: true - Layout.fillWidth: true - onAsyncMapInfo: function(data) { - com_info.reset_info() - console.log("接受===" + data.type) - if (data.type == "point") { - control.right_type = data.type + com_info.update_design(data.data) + left_tab.setMenuData(data.data) + } else if (data.type == "search-near") { + WindowRouter.go("/searchNear",{type:"WindowType.Standard"}) + } else if (data.type == "resource") { + // 资源类的没有右侧面板 + data.data.right_type = data.type + left_tab.setMenuData(data.data) + } else if (data.type == "delete") { + // 删除左侧菜单，关闭右侧面板 + left_tab.deleteMenuData(data.data) + control.show_right = false + } else if (data.type == "rightClick") { + var pos = data.data.pos + map_right_menu.popup(map_container) + map_right_menu.y += -10 + } + } + } - com_info.update_design(data.data) - - left_tab.setMenuData(data.data) - - control.show_right = true - } else if (data.type == "empty") { - control.show_right = false - com_info.reset_info() - } else if (data.type == "line") { - control.show_right = true - control.right_type = data.type - com_info.update_design(data.data) - left_tab.setMenuData(data.data) - } else if (data.type == "polygon") { - control.show_right = true - control.right_type = data.type - com_info.update_design(data.data) - left_tab.setMenuData(data.data) - } else if (data.type == "search-near") { - WindowRouter.go("/searchNear",{type:"WindowType.Standard"}) - } else if (data.type == "resource") { - // 资源类的没有右侧面板 - left_tab.setMenuData(data.data) - } else if (data.type == "delete") { - // 删除左侧菜单，关闭右侧面板 - left_tab.deleteMenuData(data.data) - control.show_right = false + SearchRoute{ + anchors.left: parent.left + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.leftMargin: 10 + anchors.topMargin: 10 + anchors.bottomMargin: 20 } } } } - RightComponentInfo{ - id: com_info - cur_type: control.right_type - visible: !control.is_home && control.show_right - Layout.preferredWidth: 200 - Layout.preferredHeight: parent.height + RightCommon{ + Layout.preferredWidth: 270 + Layout.preferredHeight: parent.height - 20 Layout.rightMargin: 10 - onIconChanged: function(data) { - map_container.run_js("QT_ChangeIcon", {img: data}) - } - onTextChanged: function(data) { - map_container.run_js("QT_ChangeIcon", {text: data.title}) - // 更新左侧标题 - console.log("id====" + data.id) - if (data.title && data.id) { - left_tab.setMenuData(data) - } - } - onTextColorChanged: function(data) { - map_container.run_js("QT_ChangeIcon", {textColor: data}) - } - - onLineInfoChanged: function(data) { - map_container.run_js("QT_ChangeLine", data) - // 更新左侧标题 - console.log("id====" + data.id) - if (data.title && data.id) { - left_tab.setMenuData(data) - } - } - - onPolyInfoChanged: function(data) { - map_container.run_js("QT_ChangePoly", data) - // 更新左侧标题 - if (data.title && data.id) { - left_tab.setMenuData(data) - } - } + visible: !control.is_home } + + // RightComponentInfo{ + // id: com_info + // cur_type: control.right_type + // visible: !control.is_home && control.show_right + // Layout.preferredWidth: 200 + // Layout.preferredHeight: parent.height + // Layout.rightMargin: 10 + // onIconChanged: function(data) { + // map_container.run_js("QT_ChangeIcon", {img: data.key}) + // if (data.image && data.id) { + // left_tab.setMenuData(data) + // } + // } + // onTextChanged: function(data) { + // map_container.run_js("QT_ChangeIcon", {text: data.title}) + // // 更新左侧标题 + // if (data.title && data.id) { + // left_tab.setMenuData(data) + // } + // } + // onTextColorChanged: function(data) { + // map_container.run_js("QT_ChangeIcon", {textColor: data}) + // } + + // onLineInfoChanged: function(data) { + // map_container.run_js("QT_ChangeLine", data) + // // 更新左侧标题 + // console.log("id====" + data.id) + // if (data.title && data.id) { + // left_tab.setMenuData(data) + // } + // } + + // onPolyInfoChanged: function(data) { + // map_container.run_js("QT_ChangePoly", data) + // // 更新左侧标题 + // if (data.title && data.id) { + // left_tab.setMenuData(data) + // } + // } + // } } } @@ -232,4 +404,12 @@ Item { } } + Connections { + target: DataConnect + onGoHome: function goHome(value) { + control.is_home = true + } + } + + } diff --git a/Gallery/res/qml/screen/NewFolderScreen.qml b/Gallery/res/qml/screen/NewFolderScreen.qml index 82c66ee..6e38c9b 100644 --- a/Gallery/res/qml/screen/NewFolderScreen.qml +++ b/Gallery/res/qml/screen/NewFolderScreen.qml @@ -4,6 +4,7 @@ import QtQuick.Controls import FluentUI.Controls import FluentUI.impl import Gallery +import "../component/base" Item { property var pro_title: "" @@ -17,48 +18,86 @@ Item { } } - ColumnLayout { - spacing: 20 - anchors.centerIn: parent - width: 260 - Label { - elide: Label.ElideRight - text: "新建目录" - Layout.fillWidth: true - font.pointSize: 15 - horizontalAlignment: Text.AlignHCenter + MyTreeView { + anchors.fill: parent + id: tree + model: modelTree2 + onSelectedItemChanged: console.log(item.text) } - TextField { - id: tb_title - focus: true - placeholderText: "名称" - Layout.fillWidth: true - text: control.pro_title - } - Item{ - implicitHeight: 40 - Layout.fillWidth: true - Button{ - text: "取消" - anchors{ - left: parent.left - verticalCenter: parent.verticalCenter - } - onClicked: { - window.close() - } - } - FilledButton{ - text: "确认" - anchors{ - right: parent.right - verticalCenter: parent.verticalCenter - } - onClicked: { - window.setResult({title: tb_title.text}) - window.close() - } + ListModel { + id: modelTree2 + Component.onCompleted: { + modelTree2.append([ + {id: "1", title: "Node 1", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "2", title: "Node 2", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: [ + {id: "21", title: "Node 21", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items:[ + {id: "211", title: "Node 211", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_car.png", items: []}, + {id: "212", title: "Node 212", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_car.png", items: []} + ]}, + {id: "22", title: "Node 22", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_line.png", items: []} + ] + }, + {id: "3", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "4", title: "多文字多文字多文字多文字多文字多文字多文字多文字多文字多文字多文字多文字", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "31", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "32", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "33", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "34", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "35", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "36", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "37", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "38", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "39", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "30", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "300", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + {id: "3000", title: "Node 3", ico: "qrc:/qt/qml/Gallery/res/image/components/ico_tree_folder.png", items: []}, + ]); } } - } + + + // ColumnLayout { + // spacing: 20 + // anchors.centerIn: parent + // width: 260 + // Label { + // elide: Label.ElideRight + // text: "新建目录" + // Layout.fillWidth: true + // font.pointSize: 15 + // horizontalAlignment: Text.AlignHCenter + // } + // TextField { + // id: tb_title + // focus: true + // placeholderText: "名称" + // Layout.fillWidth: true + // text: control.pro_title + // } + // Item{ + // implicitHeight: 40 + // Layout.fillWidth: true + // Button{ + // text: "取消" + // anchors{ + // left: parent.left + // verticalCenter: parent.verticalCenter + // } + // onClicked: { + // window.close() + // } + // } + // FilledButton{ + // text: "确认" + // anchors{ + // right: parent.right + // verticalCenter: parent.verticalCenter + // } + // onClicked: { + // window.setResult({title: tb_title.text}) + // window.close() + // } + // } + // } + // } } diff --git a/Gallery/res/qml/screen/NewProjectScreen.qml b/Gallery/res/qml/screen/NewProjectScreen.qml index fa8d3c1..e3cd61f 100644 --- a/Gallery/res/qml/screen/NewProjectScreen.qml +++ b/Gallery/res/qml/screen/NewProjectScreen.qml @@ -5,16 +5,28 @@ import FluentUI.Controls import FluentUI.impl import Gallery +import QtQuick.LocalStorage 2.0 +import "../DB/database.js" as DB + Item { property var pro_title: "" property var pro_desc: "" id: control + Label{ + text: "新增项目" + } + Connections{ target: window function onInit(arg){ console.log("初始化。。。") + // DB.initDatabase() + // var result = DB.readMenuTree("1") + // console.log(DB) + // console.log(DB.readData("color")) + // DB.insertData("color", "red") } } diff --git a/Gallery/res/qml/screen/SearchNearScreen.qml b/Gallery/res/qml/screen/SearchNearScreen.qml index 9e6ab4c..58bf388 100644 --- a/Gallery/res/qml/screen/SearchNearScreen.qml +++ b/Gallery/res/qml/screen/SearchNearScreen.qml @@ -3,11 +3,25 @@ import QtQuick.Layouts import QtQuick.Controls import FluentUI.Controls import FluentUI.impl +import Qt5Compat.GraphicalEffects + +import "../component/window" +import "../component/base" ColumnLayout { anchors.fill: parent anchors.rightMargin: 10 + // AddPointWindow{ + // id: nearWin + // } + + SearchNearWindow{ + id: dia_newproject + } + + + // 输入框 RowLayout{ Layout.preferredHeight: 50 @@ -22,6 +36,10 @@ ColumnLayout { text: "搜索" Layout.preferredWidth: 90 Layout.preferredHeight: 35 + onClicked: { + console.log('123123') + dia_newproject.open() + } } ComboBox{ model: ListModel { diff --git a/Gallery/res/qml/window/LoginWindow.qml b/Gallery/res/qml/window/LoginWindow.qml index 0d9a6c6..dd3696b 100644 --- a/Gallery/res/qml/window/LoginWindow.qml +++ b/Gallery/res/qml/window/LoginWindow.qml @@ -9,8 +9,8 @@ FramelessWindow { property var argument id: window title: "Login" - width: 600 - height: 400 + width: 1000 + height: 700 fixSize: true visible: true launchMode: WindowType.SingleInstance diff --git a/Gallery/res/qml/window/MainPageWindow.qml b/Gallery/res/qml/window/MainPageWindow.qml index ab8ae82..2e3e359 100644 --- a/Gallery/res/qml/window/MainPageWindow.qml +++ b/Gallery/res/qml/window/MainPageWindow.qml @@ -17,6 +17,8 @@ MyFramelessWindow { windowEffect: Global.windowEffect autoDestroy: true + minimumWidth: 800 + initialItem: R.resolvedUrl("res/qml/screen/MainPageScreen.qml") // ColumnLayout{ diff --git a/Gallery/res/qml/window/NewFolderWindow.qml b/Gallery/res/qml/window/NewFolderWindow.qml index c223670..83deed0 100644 --- a/Gallery/res/qml/window/NewFolderWindow.qml +++ b/Gallery/res/qml/window/NewFolderWindow.qml @@ -9,8 +9,8 @@ FramelessWindow { property var argument id: window title: "新建目录" - width: 400 - height: 200 + width: 500 + height: 800 fixSize: true visible: true launchMode: WindowType.Standard @@ -23,5 +23,7 @@ FramelessWindow { (arg)=>{ argument = arg } - initialItem: R.resolvedUrl("res/qml/screen/NewFolderScreen.qml") + // initialItem: R.resolvedUrl("res/qml/screen/NewFolderScreen.qml") + // initialItem: R.resolvedUrl("res/qml/component/SearchRoute.qml") + initialItem: R.resolvedUrl("res/qml/component/RightCommon.qml") //RightMainIntro//R.resolvedUrl("res/qml/screen/NewFolderScreen.qml") } diff --git a/Gallery/res/qml/window/NewProjectWindow.qml b/Gallery/res/qml/window/NewProjectWindow.qml index 7213eda..6173865 100644 --- a/Gallery/res/qml/window/NewProjectWindow.qml +++ b/Gallery/res/qml/window/NewProjectWindow.qml @@ -4,15 +4,17 @@ import QtQuick.Controls import FluentUI.Controls import FluentUI.impl import Gallery +import "../component" -FramelessWindow { +MyFramelessWindow { property var argument id: window title: "新建项目" - width: 400 - height: 300 + width: 700 + height: 500 fixSize: true visible: true + showAppBar: false launchMode: WindowType.Standard windowEffect: Global.windowEffect onInit: diff --git a/Gallery/res/qml/window/SearchNearWindow.qml b/Gallery/res/qml/window/SearchNearWindow.qml index 3fad333..a770681 100644 --- a/Gallery/res/qml/window/SearchNearWindow.qml +++ b/Gallery/res/qml/window/SearchNearWindow.qml @@ -4,11 +4,15 @@ import QtQuick.Controls import FluentUI.Controls import FluentUI.impl import Gallery +import "../component" -FramelessWindow { +MyFramelessWindow { property var argument id: window + showAppBar: false title: "搜索周边" + fitsAppBarWindows: true + appBar: Item{} width: 600 height: 400 fixSize: true diff --git a/Gallery/src/main.cpp b/Gallery/src/main.cpp index 5207c3e..cd75e2f 100644 --- a/Gallery/src/main.cpp +++ b/Gallery/src/main.cpp @@ -38,6 +38,7 @@ int main(int argc, char *argv[]) { QGuiApplication::setWindowIcon(QIcon(":/qt/qml/Gallery/res/image/logo.png")); QQmlApplicationEngine engine; engine.addImportPath(":/qt/qml"); + engine.setOfflineStoragePath("./"); AppInfo::getInstance()->init(&engine); const QUrl url("qrc:/qt/qml/Gallery/res/qml/App.qml"); QObject::connect(