wuyize
/
FluentUI
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update

main
zhuzihcu 2023-02-27 18:46:39 +08:00
parent 8ef76d2707
commit a772e18b93
25 changed files with 1400 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
example/App.qml
View File

@ -7,7 +7,7 @@ import FluentUI 1.0
Window {
id:app
color: "#00000000"
Component.onCompleted: {
FluApp.setAppWindow(app)
FluApp.routes = {

16
example/MainPage.qml
View File

@ -5,11 +5,15 @@ import QtQuick.Layouts 1.15
import QtGraphicalEffects 1.15
import FluentUI 1.0
Rectangle {
FluWindow {
id:rootwindow
width: 800
height: 600
color : "#F3F3F3"
FluAppBar{
id:appbar
title: "FluentUI"
}
ListModel{
id:nav_items
@ -26,7 +30,7 @@ Rectangle {
ListView{
id:nav_list
anchors{
top: parent.top
top: appbar.bottom
bottom: parent.bottom
topMargin: 20
bottomMargin: 20
@ -75,13 +79,13 @@ Rectangle {
}
Rectangle{
color: "#FFFFFF"
color: FluApp.isDark ? "#323232" : "#FFFFFF"
radius: 10
clip: true
anchors{
left: nav_list.right
leftMargin: 2
top: parent.top
top: appbar.bottom
topMargin: 20
right: parent.right
rightMargin: 10
@ -89,7 +93,7 @@ Rectangle {
bottomMargin: 20
}
border.width: 1
border.color: "#EEEEEE"
border.color: FluApp.isDark ? "#666666" : "#EEEEEE"
Loader{
anchors.fill: parent

5
example/SettingPage.qml
View File

@ -1,11 +1,14 @@
import QtQuick 2.15
import FluentUI 1.0
Item {
FluWindow {
width: 500
height: 500
FluAppBar{
id:appbar
}
FluText{
text:"Display"

11
example/T_Controls.qml
View File

@ -14,24 +14,23 @@ Item {
fontStyle: FluText.TitleLarge
}
FluButton{
Layout.topMargin: 20
onClicked: {
FluApp.getWIdByWindow(Window.window)
// FluApp.navigate("/Setting")
}
}
FluFilledButton{
onClicked:{
FluApp.navigate("/Setting")
console.debug("FluFilledButton:"+Window.window.x)
}
}
FluFilledButton{
disabled: true
onClicked:{
console.debug("FluFilledButton-disabled")
}
}
@ -39,7 +38,7 @@ Item {
Component.onCompleted: {
}
icon:FluentIcons.FA_android
icon:FluentIcons.FA_close
}
FluToggleSwitch{

33
example/example.pro
View File

@ -1,7 +1,6 @@
QT += quick
CONFIG += c++11
DEFINES += QT_DEPRECATED_WARNINGS QT_NO_WARNING_OUTPUT
SOURCES += \
@ -18,28 +17,28 @@ else: unix:!android: target.path = /opt/$${TARGET}/bin
#### 如果你正在使用静态库.a 那么你还需要将下面的配置注释取消掉。
#### 其它项目使用方法也是如此。
DEFINES += STATICLIB
# DEFINES += STATICLIB
LIBNAME = FluentUI
# LIBNAME = FluentUI
CONFIG(debug, debug|release) {
contains(QMAKE_HOST.os,Windows) {
LIBNAME = FluentUI
}else{
LIBNAME = FluentUI_debug
}
}
# CONFIG(debug, debug|release) {
# contains(QMAKE_HOST.os,Windows) {
# LIBNAME = FluentUId
# }else{
# LIBNAME = FluentUI_debug
# }
# }
# Additional import path used to resolve QML modules in Qt Creator's code model
QML_IMPORT_PATH = $$OUT_PWD/../bin/
# # Additional import path used to resolve QML modules in Qt Creator's code model
# QML_IMPORT_PATH = $$OUT_PWD/../bin/
# Additional import path used to resolve QML modules just for Qt Quick Designer
QML_DESIGNER_IMPORT_PATH = $$OUT_PWD/../bin/
# # Additional import path used to resolve QML modules just for Qt Quick Designer
# QML_DESIGNER_IMPORT_PATH = $$OUT_PWD/../bin/
INCLUDEPATH += $$OUT_PWD/../bin/FluentUI/
DEPENDPATH += $$OUT_PWD/../bin/FluentUI/
# INCLUDEPATH += $$OUT_PWD/../bin/FluentUI/
# DEPENDPATH += $$OUT_PWD/../bin/FluentUI/
LIBS += -L$$OUT_PWD/../bin/FluentUI/ -l$${LIBNAME}
# LIBS += -L$$OUT_PWD/../bin/FluentUI/ -l$${LIBNAME}
# PRE_TARGETDEPS += $$OUT_PWD/../bin/FluentUI/lib$${LIBNAME}.a
### 注意:静态库 .so .dylib .dll 是自动安装的Qt qml plugin目录中，不需要此步配置

5
example/main.cpp
View File

@ -7,12 +7,9 @@
int main(int argc, char *argv[])
{
QCoreApplication::setAttribute(Qt::AA_UseSoftwareOpenGL);
#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)
// qputenv("QSG_RENDER_LOOP","basic");
QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
#endif
QGuiApplication app(argc, argv);
QQmlApplicationEngine engine;
#if defined(STATICLIB)
FluentUI::create(&engine);

18
src/FluApp.cpp
View File

@ -3,6 +3,7 @@
#include <QQmlEngine>
#include <QGuiApplication>
#include <QQmlContext>
#include <QQuickItem>
#include "FramelessView.h"
@ -16,6 +17,13 @@ FluApp *FluApp::getInstance()
return FluApp::m_instance;
}
FluApp::FluApp(QObject *parent)
: QObject{parent}
{
isDark(true);
}
void FluApp::setAppWindow(QWindow *window){
appWindow = window;
@ -28,29 +36,37 @@ void FluApp::run(){
}
FramelessView *view = new FramelessView();
view->engine()->rootContext()->setContextProperty("FluApp",FluApp::getInstance());
view->setColor(QColor(255,0,0,1));
const QUrl url(routes().value(initialRoute()).toString());
QObject::connect(view, &QQuickView::statusChanged, view, [&](QQuickView::Status status) {
if (status == QQuickView::Status::Ready) {
qDebug()<<"-----------winId:"<<view->winId();
}
});
QObject::connect(view->engine(), &QQmlEngine::quit, qApp, &QCoreApplication::quit);
QObject::connect(qApp, &QGuiApplication::aboutToQuit, qApp, [&view](){view->setSource({});});
// view->setTitle("FluentUI");
view->setSource(url);
view->moveToScreenCenter();
view->show();
}
void FluApp::navigate(const QString& route){
qDebug()<<"开始路由跳转->"<<route;
if(!routes().contains(route)){
qErrnoWarning("没有找到当前路由");
return;
}
FramelessView *view = new FramelessView();
view->engine()->rootContext()->setContextProperty("FluApp",FluApp::getInstance());
view->setColor(isDark() ? QColor(0,0,0,1) : QColor(255, 255, 255, 1));
view->setSource((routes().value(route).toString()));
view->closeDeleteLater();
view->moveToScreenCenter();
view->show();
}
void FluApp::getWIdByWindow(QWindow *window){
qDebug()<< window->winId();
window->winId();
}

5
src/FluApp.h
View File

@ -10,17 +10,22 @@ class FluApp : public QObject
{
Q_OBJECT
Q_PROPERTY_AUTO(QString,initialRoute);
Q_PROPERTY_AUTO(bool,isDark);
Q_PROPERTY_AUTO(QJsonObject,routes);
public:
static FluApp *getInstance();
explicit FluApp(QObject *parent = nullptr);
Q_INVOKABLE void run();
Q_INVOKABLE void navigate(const QString& route);
Q_INVOKABLE void setAppWindow(QWindow *window);
Q_INVOKABLE void getWIdByWindow(QWindow *window);
private:
static FluApp* m_instance;
QWindow *appWindow;

7
src/Fluent.cpp
View File

@ -4,6 +4,7 @@
#include <QQmlContext>
#include <QGuiApplication>
#include <QQuickWindow>
#include "WindowHelper.h"
#include "FluApp.h"
#include "Def.h"
@ -27,6 +28,12 @@ void Fluent::registerTypes(const char *uri){
int major = 1;
int minor = 0;
qmlRegisterType<WindowHelper>(uri,major,minor,"WindowHelper");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluWindow.qml"),uri,major,minor,"FluWindow");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluRectangle.qml"),uri,major,minor,"FluRectangle");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluAppBar.qml"),uri,major,minor,"FluAppBar");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluAppBar.qml"),uri,major,minor,"FluAppBar");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluButton.qml"),uri,major,minor,"FluButton");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluCheckBox.qml"),uri,major,minor,"FluCheckBox");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluComboBox.qml"),uri,major,minor,"FluComboBox");

4
src/FluentUI.pro
View File

@ -6,7 +6,7 @@ TARGET = $$qtLibraryTarget($$TARGET)
uri = FluentUI
##########################################
CONFIG += staticlib # staticlib or sharedlib
CONFIG += sharedlib # staticlib or sharedlib
#** 多次切换编译构建模式，建议先清理缓存。项目右键->清理
#*[staticlib] 构建静态库.a
@ -29,6 +29,7 @@ HEADERS += \
Fluent.h \
FluentUI.h \
FramelessView.h \
WindowHelper.h \
qml_plugin.h \
stdafx.h
@ -38,6 +39,7 @@ SOURCES += \
FluApp.cpp \
Fluent.cpp \
FluentUI.cpp \
WindowHelper.cpp \
qml_plugin.cpp \
win32 {

1
src/FramelessView_win.cpp
View File

@ -177,7 +177,6 @@ void FramelessView::showEvent(QShowEvent* e)
}
FramelessView::~FramelessView()
{
qInfo()<<"FramelessView析构了";
if (d->mMenuHandler != NULL)
{
::DestroyMenu(d->mMenuHandler);

27
src/WindowHelper.cpp Normal file
View File

@ -0,0 +1,27 @@
#include "WindowHelper.h"
WindowHelper::WindowHelper(QObject *parent)
: QObject{parent}
{
}
void WindowHelper::classBegin()
{
}
void WindowHelper::componentComplete()
{
auto rootItem = qobject_cast<QQuickItem*>(parent());
if (auto window = rootItem->window())
{
this->window = window;
this->window->setTitle("FluentUI");
qDebug()<<"--------->--------->";
}
}
void WindowHelper::setTitle(const QString& text){
window->setTitle(text);
}

24
src/WindowHelper.h Normal file
View File

@ -0,0 +1,24 @@
#ifndef WINDOWHELPER_H
#define WINDOWHELPER_H
#include <QObject>
#include <QQuickWindow>
#include <QQuickItem>
class WindowHelper : public QObject, public QQmlParserStatus
{
Q_OBJECT
public:
explicit WindowHelper(QObject *parent = nullptr);
void classBegin() override;
void componentComplete() override;
Q_INVOKABLE void setTitle(const QString& text);
private:
QQuickWindow* window;
};
#endif // WINDOWHELPER_H

0
src/build-preset/plugin.qmltypes
View File

1048
src/build-preset/plugins.qmltypes Normal file
View File

File diff suppressed because it is too large Load Diff

112
src/controls/FluAppBar.qml Normal file
View File

@ -0,0 +1,112 @@
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15
import FluentUI 1.0
Rectangle{
color: FluApp.isDark ? "#323232" : "#FFFFFF"
height: 50
width: {
if(parent==null)
return 200
return parent.width
}
property string title: "标题"
MouseArea{
property var lastClickTime: new Date()
anchors.fill: parent
anchors.topMargin: 5
acceptedButtons: Qt.LeftButton
onPressed: Window.window.startSystemMove()
onDoubleClicked: {
toggleMaximized();
}
}
function toggleMaximized() {
if (Window.window.visibility === Window.Maximized) {
Window.window.showNormal();
} else {
Window.window.showMaximized();
}
}
FluText {
text: title
anchors{
verticalCenter: parent.verticalCenter
left: parent.left
leftMargin: 14
}
fontStyle: FluText.Title
font.pixelSize: 14
font.bold: true
}
RowLayout{
anchors.right: parent.right;
height: parent.height
spacing: 5
RowLayout{
Layout.alignment: Qt.AlignVCenter
spacing: 5
FluText{
text:"夜间模式"
fontStyle: FluText.Body
}
FluToggleSwitch{
checked: FluApp.isDark
onClicked2:{
FluApp.isDark = !FluApp.isDark
}
}
}
FluIconButton{
icon : FluentIcons.FA_window_minimize
Layout.alignment: Qt.AlignVCenter
iconSize: 15
iconColor: FluApp.isDark ? "#FFFFFF" : "#000000"
onClicked: {
Window.window.showMinimized()
}
}
FluIconButton{
icon : {
if(Window.window == null)
return false
return Window.Maximized === Window.window.visibility ? FluentIcons.FA_window_restore : FluentIcons.FA_window_maximize
}
Layout.alignment: Qt.AlignVCenter
iconColor: FluApp.isDark ? "#FFFFFF" : "#000000"
iconSize: 15
onClicked: {
toggleMaximized()
}
}
FluIconButton{
icon : FluentIcons.FA_close
Layout.alignment: Qt.AlignVCenter
iconSize: 15
iconColor: FluApp.isDark ? "#FFFFFF" : "#000000"
onClicked: {
Window.window.close()
}
}
}
Rectangle{
width: parent.width;
height: 1;
anchors.bottom: parent.bottom;
color: FluApp.isDark ? "#666666" : "#EEEEEE"
}
}

27
src/controls/FluButton.qml
View File

@ -1,6 +1,5 @@
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Controls.Material 2.15
Rectangle {
id: button
@ -10,19 +9,33 @@ Rectangle {
property int topPadding: 8
property int bottomPadding: 8
property bool disabled: false
property color primaryColor : "#0064B0"
signal clicked
radius: 4
color: button_mouse.containsMouse ? "#eeeeee" : "#FFFFFF"
color:{
if(FluApp.isDark){
if(disabled){
return "#C7C7C7"
}
return button_mouse.containsMouse ? "#444444" : "#3e3e3e"
}else{
if(disabled){
return "#C7C7C7"
}
return button_mouse.containsMouse ? "#FBFBFB" : "#FFFFFF"
}
}
width: button_text.implicitWidth
height: button_text.implicitHeight
border.color: "#cccccc"
border.color: FluApp.isDark ? "#505050" : "#DFDFDF"
border.width: 1
Text {
FluText {
id: button_text
text: "Standard Button"
color: "#000000"
font.pixelSize: 13
font.pixelSize: 14
leftPadding: button.startPadding
rightPadding: button.endPadding
topPadding: button.topPadding
@ -35,6 +48,8 @@ Rectangle {
anchors.fill: parent
hoverEnabled: true
onClicked: {
if(disabled)
return
button.clicked()
}
}

9
src/controls/FluFilledButton.qml
View File

@ -1,6 +1,5 @@
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Controls.Material 2.15
Rectangle {
id: button
@ -21,14 +20,12 @@ Rectangle {
}
width: button_text.implicitWidth
height: button_text.implicitHeight
border.color: "#cccccc"
border.width: 1
Text {
FluText {
id: button_text
text: "Standard Button"
text: "Filled Button"
color: "#FFFFFFFF"
font.pixelSize: 13
font.pixelSize: 14
leftPadding: button.startPadding
rightPadding: button.endPadding
topPadding: button.topPadding

34
src/controls/FluIconButton.qml
View File

@ -2,19 +2,43 @@
Rectangle {
width: text.implicitWidth
height: text.implicitHeight
id:button
width: 30
height: 30
property int iconSize: 20
property int icon
property color iconColor: "#000000"
signal clicked
radius: 4
color: {
if(FluApp.isDark){
return button_mouse.containsMouse ? "#000000" : "#00000000"
}else{
return button_mouse.containsMouse ? "#F4F4F4" : "#00000000"
}
}
Text {
id:text
id:text_icon
font.family: "fontawesome"
font.pixelSize: 16
font.pixelSize: iconSize
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
// text:icon
anchors.centerIn: parent
color: iconColor
text: (String.fromCharCode(icon).toString(16));
}
MouseArea{
id:button_mouse
anchors.fill: parent
hoverEnabled: true
onClicked: {
button.clicked()
}
}
}

5
src/controls/FluRectangle.qml Normal file
View File

@ -0,0 +1,5 @@
import QtQuick 2.15
Item {
}

7
src/controls/FluText.qml
View File

@ -16,10 +16,10 @@ Text {
Caption
}
property int fontStyle: FluText.Display
property color textColor: "#333333"
property int fontStyle: FluText.Body
property color textColor: FluApp.isDark ? "#FFFFFF" : "#1A1A1A"
property int pixelSize : 16
property int pixelSize : 14
color: textColor
@ -66,6 +66,7 @@ Text {
font.pixelSize = text.pixelSize * 0.8
break
default:
font.pixelSize = text.pixelSize * 1.0
break
}
}

18
src/controls/FluToggleSwitch.qml
View File

@ -4,10 +4,15 @@ import QtQuick.Controls 2.0
Switch {
id: root
property color checkedColor: "#0064B0"
indicator: Rectangle {
signal clicked2
width: 40
implicitWidth: 40
height: 20
implicitHeight: 20
checkable: false
indicator: Rectangle {
width: root.width
height: root.height
radius: height / 2
color: root.checked ? checkedColor : "white"
border.width: 1
@ -21,10 +26,17 @@ Switch {
anchors.verticalCenter: parent.verticalCenter
color: root.checked ? "#FFFFFF" : "#666666"
// border.color: "#D5D5D5"
Behavior on x {
NumberAnimation { duration: 200 }
}
}
}
MouseArea{
id:switch_mouse
anchors.fill: parent
hoverEnabled: true
onClicked: {
root.clicked2()
}
}
}

36
src/controls/FluWindow.qml Normal file
View File

@ -0,0 +1,36 @@
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15
import FluentUI 1.0
Rectangle {
id:root
property bool isMax: {
if(Window.window == null)
return false
return Window.Maximized === Window.window.visibility
}
property string title: "FluentUI"
onIsMaxChanged: {
if(isMax){
root.anchors.margins = 4
root.anchors.fill = parent
}else{
root.anchors.margins = 0
root.anchors.fill = null
}
}
color : FluApp.isDark ? "#202020" : "#F3F3F3"
Component.onCompleted: {
}
WindowHelper{
id:helper
}
}

3
src/res.qrc
View File

@ -15,5 +15,8 @@
<file>controls/FluTextBox.qml</file>
<file>controls/FluTimePicker.qml</file>
<file>res/font/fontawesome-webfont.ttf</file>
<file>controls/FluAppBar.qml</file>
<file>controls/FluRectangle.qml</file>
<file>controls/FluWindow.qml</file>
</qresource>
</RCC>

3
src/win_install.bat
View File

@ -20,7 +20,10 @@ if %ANDROID% == YES copy /y %LIBFILE_PATH% %BUILDER_BIN_PATH%
if %1 == SHARED (
echo running install to qtqml folder
del /s /q %PRESET_PATH%\plugins.qmltypes
%QT_QML_FLUENT_PATH%\..\..\bin\qmlplugindump.exe -nonrelocatable FluentUI 1.0 .\ > %PRESET_PATH%\plugins.qmltypes
rmdir /s /q %QT_QML_FLUENT_PATH% & md %QT_QML_FLUENT_PATH%
copy /y %BUILDER_BIN_PATH% %QT_QML_FLUENT_PATH%
xcopy %PRESET_PATH% %QT_QML_FLUENT_PATH% /s/e/i/y
cd %QT_QML_FLUENT_PATH%
)