From 09e87e0fb85eb808a51cc3e563b8a380374ec52e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9C=B1=E5=AD=90=E6=A5=9A=5Czhuzi?= Date: Sun, 9 Apr 2023 19:29:50 +0800 Subject: [PATCH] update --- example/T_StatusView.qml | 91 ++++++++++++++++++++++++ example/T_TableView.qml | 31 ++++----- example/component/CodeExpander.qml | 1 + example/global/ItemsOriginal.qml | 6 ++ example/qml.qrc | 1 + src/Fluent.cpp | 1 + src/controls/FluStatusView.qml | 108 +++++++++++++++++++++++++++++ src/res.qrc | 1 + 8 files changed, 224 insertions(+), 16 deletions(-) create mode 100644 example/T_StatusView.qml create mode 100644 src/controls/FluStatusView.qml diff --git a/example/T_StatusView.qml b/example/T_StatusView.qml new file mode 100644 index 0000000..da87dfe --- /dev/null +++ b/example/T_StatusView.qml @@ -0,0 +1,91 @@ +import QtQuick +import QtQuick.Layouts +import QtQuick.Controls +import QtQuick.Window +import FluentUI +import "./component" + +FluScrollablePage{ + + title:"StatusView" + leftPadding:10 + rightPadding:10 + bottomPadding:20 + spacing: 0 + + FluArea{ + id:layout_actions + Layout.fillWidth: true + Layout.topMargin: 20 + height: 50 + paddings: 10 + RowLayout{ + spacing: 14 + FluDropDownButton{ + id:btn_status_mode + Layout.preferredWidth: 140 + text:"Loading" + items:[ + FluMenuItem{ + text:"Loading" + onClicked: { + btn_status_mode.text = text + status_view.statusMode = FluStatusView.Loading + } + }, + FluMenuItem{ + text:"Empty" + onClicked: { + btn_status_mode.text = text + status_view.statusMode = FluStatusView.Empty + } + }, + FluMenuItem{ + text:"Error" + onClicked: { + btn_status_mode.text = text + status_view.statusMode = FluStatusView.Error + } + }, + FluMenuItem{ + text:"Success" + onClicked: { + btn_status_mode.text = text + status_view.statusMode = FluStatusView.Success + } + } + ] + } + } + } + + FluArea{ + Layout.fillWidth: true + Layout.topMargin: 10 + height: 380 + paddings: 10 + FluStatusView{ + id:status_view + anchors.fill: parent + onErrorClicked:{ + showError("点击重新加载") + } + Rectangle { + anchors.fill: parent + color:FluTheme.primaryColor.dark + } + } + } + CodeExpander{ + Layout.fillWidth: true + code:'FluStatusView{ + anchors.fill: parent + statusMode: FluStatusView.Loading + Rectangle{ + anchors.fill: parent + color:FluTheme.primaryColor.dark + } +}' + } + +} diff --git a/example/T_TableView.qml b/example/T_TableView.qml index cd73fcb..b719f93 100644 --- a/example/T_TableView.qml +++ b/example/T_TableView.qml @@ -45,12 +45,10 @@ FluScrollablePage{ loadData(1,10) } - FluTableView{ id:table_view Layout.fillWidth: true Layout.topMargin: 20 - width:parent.width pageCurrent:1 pageCount:10 itemCount: 1000 @@ -90,6 +88,21 @@ FluScrollablePage{ } } } + + function loadData(page,count){ + const dataSource = [] + for(var i=0;i"); code = code.replace(/ /g, " "); diff --git a/example/global/ItemsOriginal.qml b/example/global/ItemsOriginal.qml index 3a7c7ee..fd3b9ec 100644 --- a/example/global/ItemsOriginal.qml +++ b/example/global/ItemsOriginal.qml @@ -118,6 +118,12 @@ FluObject{ navigationView.push("qrc:/T_Rectangle.qml") } } + FluPaneItem{ + title:"StatusView" + onTap:{ + navigationView.push("qrc:/T_StatusView.qml") + } + } FluPaneItem{ title:"Carousel" onTap:{ diff --git a/example/qml.qrc b/example/qml.qrc index 2515cd6..672f023 100644 --- a/example/qml.qrc +++ b/example/qml.qrc @@ -157,5 +157,6 @@ T_Pivot.qml component/CodeExpander.qml T_TableView.qml + T_StatusView.qml diff --git a/src/Fluent.cpp b/src/Fluent.cpp index 99d8577..7551241 100644 --- a/src/Fluent.cpp +++ b/src/Fluent.cpp @@ -33,6 +33,7 @@ void Fluent::registerTypes(const char *uri){ qmlRegisterType(uri,major,minor,"WindowHelper"); qmlRegisterType(uri,major,minor,"FluColorSet"); + qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluStatusView.qml"),uri,major,minor,"FluStatusView"); qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluPagination.qml"),uri,major,minor,"FluPagination"); qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluToggleButton.qml"),uri,major,minor,"FluToggleButton"); qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluTableView.qml"),uri,major,minor,"FluTableView"); diff --git a/src/controls/FluStatusView.qml b/src/controls/FluStatusView.qml new file mode 100644 index 0000000..6183e29 --- /dev/null +++ b/src/controls/FluStatusView.qml @@ -0,0 +1,108 @@ +import QtQuick +import QtQuick.Controls +import QtQuick.Layouts +import FluentUI + +Item{ + + enum StatusMode { + Loading, + Empty, + Error, + Success + } + default property alias content: container.data + property int statusMode: FluStatusView.Loading + signal errorClicked + + Item{ + id:container + anchors.fill: parent + visible: statusMode === FluStatusView.Success + } + + FluArea{ + paddings: 0 + border.width: 0 + anchors.fill: container + visible: opacity + opacity: statusMode === FluStatusView.Loading + Behavior on opacity { + NumberAnimation { duration: 150 } + } + ColumnLayout{ + anchors.centerIn: parent + visible: statusMode === FluStatusView.Loading + FluProgressRing{ + indeterminate: true + Layout.alignment: Qt.AlignHCenter + } + FluText{ + text:"正在加载..." + Layout.alignment: Qt.AlignHCenter + } + } + } + + FluArea{ + paddings: 0 + border.width: 0 + anchors.fill: container + visible: opacity + opacity: statusMode === FluStatusView.Empty + Behavior on opacity { + NumberAnimation { duration: 150 } + } + ColumnLayout{ + anchors.centerIn: parent + visible: statusMode === FluStatusView.Empty + FluText{ + text:"空空如也" + fontStyle: FluText.BodyStrong + Layout.alignment: Qt.AlignHCenter + } + } + } + + FluArea{ + paddings: 0 + border.width: 0 + anchors.fill: container + visible: opacity + opacity: statusMode === FluStatusView.Error + Behavior on opacity { + NumberAnimation { duration: 150 } + } + ColumnLayout{ + anchors.centerIn: parent + FluText{ + text:"页面出错了..." + fontStyle: FluText.BodyStrong + Layout.alignment: Qt.AlignHCenter + } + FluFilledButton{ + id:btn_error + Layout.alignment: Qt.AlignHCenter + text:"重新加载" + onClicked:{ + errorClicked.call() + } + } + } + } + + + function showSuccessView(){ + statusMode = FluStatusView.Success + } + function showLoadingView(){ + statusMode = FluStatusView.Loading + } + function showEmptyView(){ + statusMode = FluStatusView.Empty + } + function showErrorView(){ + statusMode = FluStatusView.Error + } + +} diff --git a/src/res.qrc b/src/res.qrc index 8bc0077..8e8ac9f 100644 --- a/src/res.qrc +++ b/src/res.qrc @@ -70,5 +70,6 @@ controls/FluTableView.qml controls/FluPagination.qml controls/FluToggleButton.qml + controls/FluStatusView.qml