mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2024-11-26 13:27:05 +08:00
update
This commit is contained in:
parent
f1b52fc5ee
commit
02e4579021
28
example/AboutPage.qml
Normal file
28
example/AboutPage.qml
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
|
FluWindow {
|
||||||
|
|
||||||
|
width: 500
|
||||||
|
height: 500
|
||||||
|
title:"关于"
|
||||||
|
|
||||||
|
FluAppBar{
|
||||||
|
id:appbar
|
||||||
|
}
|
||||||
|
|
||||||
|
FluText{
|
||||||
|
text:"关于"
|
||||||
|
fontStyle: FluText.Display
|
||||||
|
anchors.centerIn: parent
|
||||||
|
|
||||||
|
MouseArea{
|
||||||
|
anchors.fill: parent
|
||||||
|
onClicked: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
@ -12,7 +12,8 @@ Window {
|
|||||||
FluApp.setAppWindow(app)
|
FluApp.setAppWindow(app)
|
||||||
FluApp.routes = {
|
FluApp.routes = {
|
||||||
"/":"qrc:/MainPage.qml",
|
"/":"qrc:/MainPage.qml",
|
||||||
"/Setting":"qrc:/SettingPage.qml"
|
"/Setting":"qrc:/SettingPage.qml",
|
||||||
|
"/About":"qrc:/AboutPage.qml"
|
||||||
}
|
}
|
||||||
FluApp.initialRoute = "/"
|
FluApp.initialRoute = "/"
|
||||||
FluApp.run()
|
FluApp.run()
|
||||||
|
@ -19,8 +19,20 @@ FluWindow {
|
|||||||
ListModel{
|
ListModel{
|
||||||
id:nav_items
|
id:nav_items
|
||||||
ListElement{
|
ListElement{
|
||||||
text:"Controls"
|
text:"Buttons"
|
||||||
page:"qrc:/T_Controls.qml"
|
page:"qrc:/T_Buttons.qml"
|
||||||
|
}
|
||||||
|
ListElement{
|
||||||
|
text:"ToggleSwitch"
|
||||||
|
page:"qrc:/T_ToggleSwitch.qml"
|
||||||
|
}
|
||||||
|
ListElement{
|
||||||
|
text:"InfoBar"
|
||||||
|
page:"qrc:/T_InfoBar.qml"
|
||||||
|
}
|
||||||
|
ListElement{
|
||||||
|
text:"Rectangle"
|
||||||
|
page:"qrc:/T-Rectangle.qml"
|
||||||
}
|
}
|
||||||
ListElement{
|
ListElement{
|
||||||
text:"Typography"
|
text:"Typography"
|
||||||
@ -108,7 +120,7 @@ FluWindow {
|
|||||||
bottomMargin: 20
|
bottomMargin: 20
|
||||||
}
|
}
|
||||||
border.width: 1
|
border.width: 1
|
||||||
border.color: FluApp.isDark ? "#666666" : "#EEEEEE"
|
border.color: FluApp.isDark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(238/255,238/255,238/255,1)
|
||||||
|
|
||||||
Loader{
|
Loader{
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
|
@ -12,10 +12,17 @@ FluWindow {
|
|||||||
}
|
}
|
||||||
|
|
||||||
FluText{
|
FluText{
|
||||||
text:"Display"
|
text:"设置"
|
||||||
fontStyle: FluText.Display
|
fontStyle: FluText.Display
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
|
|
||||||
|
MouseArea{
|
||||||
|
anchors.fill: parent
|
||||||
|
onClicked: {
|
||||||
|
FluApp.navigate("/About")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
59
example/T-Rectangle.qml
Normal file
59
example/T-Rectangle.qml
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
import QtQuick.Layouts 1.15
|
||||||
|
import QtQuick.Window 2.15
|
||||||
|
import QtGraphicalEffects 1.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
|
Item {
|
||||||
|
|
||||||
|
ColumnLayout{
|
||||||
|
spacing: 5
|
||||||
|
|
||||||
|
FluText{
|
||||||
|
text:"Rectangle"
|
||||||
|
fontStyle: FluText.TitleLarge
|
||||||
|
}
|
||||||
|
|
||||||
|
FluRectangle{
|
||||||
|
width: 50
|
||||||
|
height: 50
|
||||||
|
color:"#ffeb3b"
|
||||||
|
radius:[15,0,0,0]
|
||||||
|
}
|
||||||
|
|
||||||
|
FluRectangle{
|
||||||
|
width: 50
|
||||||
|
height: 50
|
||||||
|
color:"#f7630c"
|
||||||
|
radius:[0,15,0,0]
|
||||||
|
}
|
||||||
|
|
||||||
|
FluRectangle{
|
||||||
|
width: 50
|
||||||
|
height: 50
|
||||||
|
color:"#e71123"
|
||||||
|
radius:[0,0,15,0]
|
||||||
|
}
|
||||||
|
|
||||||
|
FluRectangle{
|
||||||
|
width: 50
|
||||||
|
height: 50
|
||||||
|
color:"#b4009e"
|
||||||
|
radius:[0,0,0,15]
|
||||||
|
}
|
||||||
|
|
||||||
|
FluRectangle{
|
||||||
|
width: 50
|
||||||
|
height: 50
|
||||||
|
color:"#744da9"
|
||||||
|
radius:[15,15,15,15]
|
||||||
|
}
|
||||||
|
|
||||||
|
FluRectangle{
|
||||||
|
width: 50
|
||||||
|
height: 50
|
||||||
|
color:"#0078d4"
|
||||||
|
radius:[0,0,0,0]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
141
example/T_Buttons.qml
Normal file
141
example/T_Buttons.qml
Normal file
@ -0,0 +1,141 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
import QtQuick.Layouts 1.15
|
||||||
|
import QtQuick.Window 2.15
|
||||||
|
import QtGraphicalEffects 1.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
|
Item {
|
||||||
|
|
||||||
|
width: parent.width
|
||||||
|
|
||||||
|
|
||||||
|
ColumnLayout{
|
||||||
|
spacing: 5
|
||||||
|
|
||||||
|
width: parent.width
|
||||||
|
|
||||||
|
FluText{
|
||||||
|
text:"Buttons"
|
||||||
|
fontStyle: FluText.TitleLarge
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
RowLayout{
|
||||||
|
Layout.topMargin: 20
|
||||||
|
width: parent.width
|
||||||
|
FluButton{
|
||||||
|
disabled:button_switch.checked
|
||||||
|
onClicked: {
|
||||||
|
showInfo("点击StandardButton")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Item{
|
||||||
|
height: 1
|
||||||
|
Layout.fillWidth: true
|
||||||
|
}
|
||||||
|
FluToggleSwitch{
|
||||||
|
id:button_switch
|
||||||
|
Layout.alignment: Qt.AlignRight
|
||||||
|
}
|
||||||
|
FluText{
|
||||||
|
text:"Disabled"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
FluDivider{
|
||||||
|
Layout.fillWidth: true ; height:1;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
RowLayout{
|
||||||
|
Layout.topMargin: 20
|
||||||
|
width: parent.width
|
||||||
|
FluFilledButton{
|
||||||
|
disabled:filled_button_switch.checked
|
||||||
|
onClicked:{
|
||||||
|
showWarning("点击FilledButton")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Item{
|
||||||
|
height: 1
|
||||||
|
Layout.fillWidth: true
|
||||||
|
}
|
||||||
|
FluToggleSwitch{
|
||||||
|
id:filled_button_switch
|
||||||
|
Layout.alignment: Qt.AlignRight
|
||||||
|
}
|
||||||
|
FluText{
|
||||||
|
text:"Disabled"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
FluDivider{
|
||||||
|
Layout.fillWidth: true ; height:1
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
RowLayout{
|
||||||
|
Layout.topMargin: 20
|
||||||
|
width: parent.width
|
||||||
|
FluIconButton{
|
||||||
|
icon:FluentIcons.FA_close
|
||||||
|
disabled:icon_button_switch.checked
|
||||||
|
onClicked:{
|
||||||
|
showSuccess("点击IconButton")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Item{
|
||||||
|
height: 1
|
||||||
|
Layout.fillWidth: true
|
||||||
|
}
|
||||||
|
FluToggleSwitch{
|
||||||
|
id:icon_button_switch
|
||||||
|
Layout.alignment: Qt.AlignRight
|
||||||
|
}
|
||||||
|
FluText{
|
||||||
|
text:"Disabled"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
FluDivider{
|
||||||
|
Layout.fillWidth: true ; height:1
|
||||||
|
}
|
||||||
|
|
||||||
|
RowLayout{
|
||||||
|
Layout.topMargin: 20
|
||||||
|
width: parent.width
|
||||||
|
ColumnLayout{
|
||||||
|
spacing: 8
|
||||||
|
|
||||||
|
Repeater{
|
||||||
|
id:repeater
|
||||||
|
property int selecIndex : 0
|
||||||
|
model: 3
|
||||||
|
delegate: FluRadioButton{
|
||||||
|
checked : repeater.selecIndex===index
|
||||||
|
disabled:radio_button_switch.checked
|
||||||
|
text:"RodioButton_"+index
|
||||||
|
onClicked:{
|
||||||
|
repeater.selecIndex = index
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Item{
|
||||||
|
height: 1
|
||||||
|
Layout.fillWidth: true
|
||||||
|
}
|
||||||
|
FluToggleSwitch{
|
||||||
|
id:radio_button_switch
|
||||||
|
Layout.alignment: Qt.AlignRight
|
||||||
|
}
|
||||||
|
FluText{
|
||||||
|
text:"Disabled"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
@ -1,50 +0,0 @@
|
|||||||
import QtQuick 2.15
|
|
||||||
import QtQuick.Layouts 1.15
|
|
||||||
import QtQuick.Window 2.15
|
|
||||||
import FluentUI 1.0
|
|
||||||
|
|
||||||
Item {
|
|
||||||
|
|
||||||
ColumnLayout{
|
|
||||||
spacing: 5
|
|
||||||
|
|
||||||
|
|
||||||
FluText{
|
|
||||||
text:"Controls"
|
|
||||||
fontStyle: FluText.TitleLarge
|
|
||||||
}
|
|
||||||
|
|
||||||
FluButton{
|
|
||||||
Layout.topMargin: 20
|
|
||||||
onClicked: {
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
FluFilledButton{
|
|
||||||
onClicked:{
|
|
||||||
FluApp.navigate("/Setting")
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
FluFilledButton{
|
|
||||||
disabled: true
|
|
||||||
onClicked:{
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
FluIconButton{
|
|
||||||
Component.onCompleted: {
|
|
||||||
|
|
||||||
}
|
|
||||||
icon:FluentIcons.FA_close
|
|
||||||
}
|
|
||||||
|
|
||||||
FluToggleSwitch{
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
54
example/T_InfoBar.qml
Normal file
54
example/T_InfoBar.qml
Normal file
@ -0,0 +1,54 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
import QtQuick.Layouts 1.15
|
||||||
|
import QtQuick.Window 2.15
|
||||||
|
import QtGraphicalEffects 1.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
|
Item {
|
||||||
|
|
||||||
|
ColumnLayout{
|
||||||
|
spacing: 5
|
||||||
|
|
||||||
|
|
||||||
|
FluText{
|
||||||
|
text:"InfoBar"
|
||||||
|
fontStyle: FluText.TitleLarge
|
||||||
|
}
|
||||||
|
|
||||||
|
FluButton{
|
||||||
|
text:"Info"
|
||||||
|
Layout.topMargin: 20
|
||||||
|
onClicked: {
|
||||||
|
showInfo("这是一个Info样式的InfoBar")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
FluButton{
|
||||||
|
text:"Warning"
|
||||||
|
Layout.topMargin: 20
|
||||||
|
onClicked: {
|
||||||
|
showWarning("这是一个Warning样式的InfoBar")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
FluButton{
|
||||||
|
text:"Error"
|
||||||
|
Layout.topMargin: 20
|
||||||
|
onClicked: {
|
||||||
|
showError("这是一个Error样式的InfoBar")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
FluButton{
|
||||||
|
text:"Success"
|
||||||
|
Layout.topMargin: 20
|
||||||
|
onClicked: {
|
||||||
|
showSuccess("这是一个Success样式的InfoBar这是一个Success样式的InfoBar")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
26
example/T_ToggleSwitch.qml
Normal file
26
example/T_ToggleSwitch.qml
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
import QtQuick.Layouts 1.15
|
||||||
|
import QtQuick.Window 2.15
|
||||||
|
import QtGraphicalEffects 1.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
|
Item {
|
||||||
|
|
||||||
|
ColumnLayout{
|
||||||
|
spacing: 5
|
||||||
|
|
||||||
|
|
||||||
|
FluText{
|
||||||
|
text:"ToggleSwitch"
|
||||||
|
fontStyle: FluText.TitleLarge
|
||||||
|
}
|
||||||
|
|
||||||
|
FluToggleSwitch{
|
||||||
|
Layout.topMargin: 20
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
@ -1,9 +1,13 @@
|
|||||||
<RCC>
|
<RCC>
|
||||||
<qresource prefix="/">
|
<qresource prefix="/">
|
||||||
<file>T_Controls.qml</file>
|
<file>T_ToggleSwitch.qml</file>
|
||||||
<file>T_Typography.qml</file>
|
<file>T_Typography.qml</file>
|
||||||
<file>App.qml</file>
|
<file>App.qml</file>
|
||||||
<file>MainPage.qml</file>
|
<file>MainPage.qml</file>
|
||||||
<file>SettingPage.qml</file>
|
<file>SettingPage.qml</file>
|
||||||
|
<file>AboutPage.qml</file>
|
||||||
|
<file>T_Buttons.qml</file>
|
||||||
|
<file>T-Rectangle.qml</file>
|
||||||
|
<file>T_InfoBar.qml</file>
|
||||||
</qresource>
|
</qresource>
|
||||||
</RCC>
|
</RCC>
|
||||||
|
@ -39,10 +39,8 @@ void FluApp::navigate(const QString& route){
|
|||||||
qErrnoWarning("没有找到当前路由");
|
qErrnoWarning("没有找到当前路由");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
bool isAppWindow = route==initialRoute();
|
bool isAppWindow = route==initialRoute();
|
||||||
FramelessView *view = new FramelessView();
|
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->setColor(isDark() ? QColor(0,0,0,1) : QColor(255, 255, 255, 1));
|
||||||
QObject::connect(view, &QQuickView::statusChanged, view, [&](QQuickView::Status status) {
|
QObject::connect(view, &QQuickView::statusChanged, view, [&](QQuickView::Status status) {
|
||||||
if (status == QQuickView::Status::Ready) {
|
if (status == QQuickView::Status::Ready) {
|
||||||
|
@ -30,6 +30,12 @@ void Fluent::registerTypes(const char *uri){
|
|||||||
|
|
||||||
qmlRegisterType<WindowHelper>(uri,major,minor,"WindowHelper");
|
qmlRegisterType<WindowHelper>(uri,major,minor,"WindowHelper");
|
||||||
|
|
||||||
|
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluShadow.qml"),uri,major,minor,"FluShadow");
|
||||||
|
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluTooltip.qml"),uri,major,minor,"FluTooltip");
|
||||||
|
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluDivider.qml"),uri,major,minor,"FluDivider");
|
||||||
|
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluIcon.qml"),uri,major,minor,"FluIcon");
|
||||||
|
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluObject.qml"),uri,major,minor,"FluObject");
|
||||||
|
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluInfoBar.qml"),uri,major,minor,"FluInfoBar");
|
||||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluWindow.qml"),uri,major,minor,"FluWindow");
|
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/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");
|
||||||
@ -57,10 +63,10 @@ void Fluent::initializeEngine(QQmlEngine *engine, const char *uri)
|
|||||||
{
|
{
|
||||||
Q_UNUSED(engine)
|
Q_UNUSED(engine)
|
||||||
Q_UNUSED(uri)
|
Q_UNUSED(uri)
|
||||||
QFont font;
|
// QFont font;
|
||||||
font.setFamily("Microsoft YaHei");
|
// font.setFamily("Microsoft YaHei");
|
||||||
QGuiApplication::setFont(font);
|
// QGuiApplication::setFont(font);
|
||||||
QQuickWindow::setTextRenderType(QQuickWindow::NativeTextRendering);
|
// QQuickWindow::setTextRenderType(QQuickWindow::NativeTextRendering);
|
||||||
QFontDatabase::addApplicationFont(":/com.zhuzichu/res/font/fontawesome-webfont.ttf");
|
QFontDatabase::addApplicationFont(":/com.zhuzichu/res/font/fontawesome-webfont.ttf");
|
||||||
engine->rootContext()->setContextProperty("FluApp",FluApp::getInstance());
|
engine->rootContext()->setContextProperty("FluApp",FluApp::getInstance());
|
||||||
}
|
}
|
||||||
|
@ -4,9 +4,9 @@
|
|||||||
|
|
||||||
void FluentUI::create(QQmlEngine *engine)
|
void FluentUI::create(QQmlEngine *engine)
|
||||||
{
|
{
|
||||||
Fluent::getInstance()->registerTypes(URI_STR);
|
|
||||||
Fluent::getInstance()->initializeEngine(engine,URI_STR);
|
|
||||||
engine->addImportPath("/");
|
engine->addImportPath("/");
|
||||||
|
Fluent::getInstance()->initializeEngine(engine,URI_STR);
|
||||||
|
Fluent::getInstance()->registerTypes(URI_STR);
|
||||||
}
|
}
|
||||||
|
|
||||||
QString FluentUI::version()
|
QString FluentUI::version()
|
||||||
|
@ -855,6 +855,7 @@ Module {
|
|||||||
exportMetaObjectRevisions: [0]
|
exportMetaObjectRevisions: [0]
|
||||||
isComposite: true
|
isComposite: true
|
||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
|
Property { name: "text"; type: "string" }
|
||||||
Property { name: "startPadding"; type: "int" }
|
Property { name: "startPadding"; type: "int" }
|
||||||
Property { name: "endPadding"; type: "int" }
|
Property { name: "endPadding"; type: "int" }
|
||||||
Property { name: "topPadding"; type: "int" }
|
Property { name: "topPadding"; type: "int" }
|
||||||
@ -879,6 +880,14 @@ Module {
|
|||||||
isComposite: true
|
isComposite: true
|
||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
}
|
}
|
||||||
|
Component {
|
||||||
|
prototype: "QQuickRectangle"
|
||||||
|
name: "FluentUI/FluDivider 1.0"
|
||||||
|
exports: ["FluentUI/FluDivider 1.0"]
|
||||||
|
exportMetaObjectRevisions: [0]
|
||||||
|
isComposite: true
|
||||||
|
defaultProperty: "data"
|
||||||
|
}
|
||||||
Component {
|
Component {
|
||||||
prototype: "QQuickItem"
|
prototype: "QQuickItem"
|
||||||
name: "FluentUI/FluDropDownButton 1.0"
|
name: "FluentUI/FluDropDownButton 1.0"
|
||||||
@ -894,12 +903,12 @@ Module {
|
|||||||
exportMetaObjectRevisions: [0]
|
exportMetaObjectRevisions: [0]
|
||||||
isComposite: true
|
isComposite: true
|
||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
|
Property { name: "text"; type: "string" }
|
||||||
Property { name: "startPadding"; type: "int" }
|
Property { name: "startPadding"; type: "int" }
|
||||||
Property { name: "endPadding"; type: "int" }
|
Property { name: "endPadding"; type: "int" }
|
||||||
Property { name: "topPadding"; type: "int" }
|
Property { name: "topPadding"; type: "int" }
|
||||||
Property { name: "bottomPadding"; type: "int" }
|
Property { name: "bottomPadding"; type: "int" }
|
||||||
Property { name: "disabled"; type: "bool" }
|
Property { name: "disabled"; type: "bool" }
|
||||||
Property { name: "primaryColor"; type: "QColor" }
|
|
||||||
Signal { name: "clicked" }
|
Signal { name: "clicked" }
|
||||||
}
|
}
|
||||||
Component {
|
Component {
|
||||||
@ -909,12 +918,12 @@ Module {
|
|||||||
exportMetaObjectRevisions: [0]
|
exportMetaObjectRevisions: [0]
|
||||||
isComposite: true
|
isComposite: true
|
||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
|
Property { name: "text"; type: "string" }
|
||||||
Property { name: "startPadding"; type: "int" }
|
Property { name: "startPadding"; type: "int" }
|
||||||
Property { name: "endPadding"; type: "int" }
|
Property { name: "endPadding"; type: "int" }
|
||||||
Property { name: "topPadding"; type: "int" }
|
Property { name: "topPadding"; type: "int" }
|
||||||
Property { name: "bottomPadding"; type: "int" }
|
Property { name: "bottomPadding"; type: "int" }
|
||||||
Property { name: "disabled"; type: "bool" }
|
Property { name: "disabled"; type: "bool" }
|
||||||
Property { name: "primaryColor"; type: "QColor" }
|
|
||||||
Signal { name: "clicked" }
|
Signal { name: "clicked" }
|
||||||
}
|
}
|
||||||
Component {
|
Component {
|
||||||
@ -924,14 +933,25 @@ Module {
|
|||||||
exportMetaObjectRevisions: [0]
|
exportMetaObjectRevisions: [0]
|
||||||
isComposite: true
|
isComposite: true
|
||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
|
Property { name: "text"; type: "string" }
|
||||||
Property { name: "startPadding"; type: "int" }
|
Property { name: "startPadding"; type: "int" }
|
||||||
Property { name: "endPadding"; type: "int" }
|
Property { name: "endPadding"; type: "int" }
|
||||||
Property { name: "topPadding"; type: "int" }
|
Property { name: "topPadding"; type: "int" }
|
||||||
Property { name: "bottomPadding"; type: "int" }
|
Property { name: "bottomPadding"; type: "int" }
|
||||||
Property { name: "disabled"; type: "bool" }
|
Property { name: "disabled"; type: "bool" }
|
||||||
Property { name: "primaryColor"; type: "QColor" }
|
|
||||||
Signal { name: "clicked" }
|
Signal { name: "clicked" }
|
||||||
}
|
}
|
||||||
|
Component {
|
||||||
|
prototype: "QQuickText"
|
||||||
|
name: "FluentUI/FluIcon 1.0"
|
||||||
|
exports: ["FluentUI/FluIcon 1.0"]
|
||||||
|
exportMetaObjectRevisions: [0]
|
||||||
|
isComposite: true
|
||||||
|
defaultProperty: "data"
|
||||||
|
Property { name: "icon"; type: "int" }
|
||||||
|
Property { name: "iconSize"; type: "int" }
|
||||||
|
Property { name: "iconColor"; type: "QColor" }
|
||||||
|
}
|
||||||
Component {
|
Component {
|
||||||
prototype: "QQuickRectangle"
|
prototype: "QQuickRectangle"
|
||||||
name: "FluentUI/FluIconButton 1.0"
|
name: "FluentUI/FluIconButton 1.0"
|
||||||
@ -941,9 +961,64 @@ Module {
|
|||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
Property { name: "iconSize"; type: "int" }
|
Property { name: "iconSize"; type: "int" }
|
||||||
Property { name: "icon"; type: "int" }
|
Property { name: "icon"; type: "int" }
|
||||||
Property { name: "iconColor"; type: "QColor" }
|
Property { name: "disabled"; type: "bool" }
|
||||||
|
Property { name: "text"; type: "string" }
|
||||||
Signal { name: "clicked" }
|
Signal { name: "clicked" }
|
||||||
}
|
}
|
||||||
|
Component {
|
||||||
|
prototype: "QObject"
|
||||||
|
name: "FluentUI/FluInfoBar 1.0"
|
||||||
|
exports: ["FluentUI/FluInfoBar 1.0"]
|
||||||
|
exportMetaObjectRevisions: [0]
|
||||||
|
isComposite: true
|
||||||
|
defaultProperty: "children"
|
||||||
|
Property { name: "root"; type: "QVariant" }
|
||||||
|
Property { name: "layoutY"; type: "int" }
|
||||||
|
Method {
|
||||||
|
name: "showSuccess"
|
||||||
|
type: "QVariant"
|
||||||
|
Parameter { name: "text"; type: "QVariant" }
|
||||||
|
Parameter { name: "duration"; type: "QVariant" }
|
||||||
|
Parameter { name: "moremsg"; type: "QVariant" }
|
||||||
|
}
|
||||||
|
Method {
|
||||||
|
name: "showInfo"
|
||||||
|
type: "QVariant"
|
||||||
|
Parameter { name: "text"; type: "QVariant" }
|
||||||
|
Parameter { name: "duration"; type: "QVariant" }
|
||||||
|
Parameter { name: "moremsg"; type: "QVariant" }
|
||||||
|
}
|
||||||
|
Method {
|
||||||
|
name: "showWarning"
|
||||||
|
type: "QVariant"
|
||||||
|
Parameter { name: "text"; type: "QVariant" }
|
||||||
|
Parameter { name: "duration"; type: "QVariant" }
|
||||||
|
Parameter { name: "moremsg"; type: "QVariant" }
|
||||||
|
}
|
||||||
|
Method {
|
||||||
|
name: "showError"
|
||||||
|
type: "QVariant"
|
||||||
|
Parameter { name: "text"; type: "QVariant" }
|
||||||
|
Parameter { name: "duration"; type: "QVariant" }
|
||||||
|
Parameter { name: "moremsg"; type: "QVariant" }
|
||||||
|
}
|
||||||
|
Method {
|
||||||
|
name: "showCustom"
|
||||||
|
type: "QVariant"
|
||||||
|
Parameter { name: "itemcomponent"; type: "QVariant" }
|
||||||
|
Parameter { name: "duration"; type: "QVariant" }
|
||||||
|
}
|
||||||
|
Property { name: "children"; type: "QObject"; isList: true; isReadonly: true }
|
||||||
|
}
|
||||||
|
Component {
|
||||||
|
prototype: "QObject"
|
||||||
|
name: "FluentUI/FluObject 1.0"
|
||||||
|
exports: ["FluentUI/FluObject 1.0"]
|
||||||
|
exportMetaObjectRevisions: [0]
|
||||||
|
isComposite: true
|
||||||
|
defaultProperty: "children"
|
||||||
|
Property { name: "children"; type: "QObject"; isList: true; isReadonly: true }
|
||||||
|
}
|
||||||
Component {
|
Component {
|
||||||
prototype: "QQuickItem"
|
prototype: "QQuickItem"
|
||||||
name: "FluentUI/FluProgressBar 1.0"
|
name: "FluentUI/FluProgressBar 1.0"
|
||||||
@ -967,6 +1042,10 @@ Module {
|
|||||||
exportMetaObjectRevisions: [0]
|
exportMetaObjectRevisions: [0]
|
||||||
isComposite: true
|
isComposite: true
|
||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
|
Property { name: "checked"; type: "bool" }
|
||||||
|
Property { name: "text"; type: "string" }
|
||||||
|
Property { name: "disabled"; type: "bool" }
|
||||||
|
Signal { name: "clicked" }
|
||||||
}
|
}
|
||||||
Component {
|
Component {
|
||||||
prototype: "QQuickItem"
|
prototype: "QQuickItem"
|
||||||
@ -974,7 +1053,23 @@ Module {
|
|||||||
exports: ["FluentUI/FluRectangle 1.0"]
|
exports: ["FluentUI/FluRectangle 1.0"]
|
||||||
exportMetaObjectRevisions: [0]
|
exportMetaObjectRevisions: [0]
|
||||||
isComposite: true
|
isComposite: true
|
||||||
|
defaultProperty: "contentItem"
|
||||||
|
Property { name: "radius"; type: "QVariant" }
|
||||||
|
Property { name: "color"; type: "QColor" }
|
||||||
|
Property { name: "borderColor"; type: "QColor" }
|
||||||
|
Property { name: "borderWidth"; type: "int" }
|
||||||
|
Property { name: "contentItem"; type: "QQuickItem"; isList: true; isReadonly: true }
|
||||||
|
}
|
||||||
|
Component {
|
||||||
|
prototype: "QQuickItem"
|
||||||
|
name: "FluentUI/FluShadow 1.0"
|
||||||
|
exports: ["FluentUI/FluShadow 1.0"]
|
||||||
|
exportMetaObjectRevisions: [0]
|
||||||
|
isComposite: true
|
||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
|
Property { name: "shadowColor"; type: "QColor" }
|
||||||
|
Property { name: "radius"; type: "int" }
|
||||||
|
Property { name: "isShadow"; type: "bool" }
|
||||||
}
|
}
|
||||||
Component {
|
Component {
|
||||||
prototype: "QQuickItem"
|
prototype: "QQuickItem"
|
||||||
@ -1007,11 +1102,6 @@ Module {
|
|||||||
Property { name: "fontStyle"; type: "int" }
|
Property { name: "fontStyle"; type: "int" }
|
||||||
Property { name: "textColor"; type: "QColor" }
|
Property { name: "textColor"; type: "QColor" }
|
||||||
Property { name: "pixelSize"; type: "int" }
|
Property { name: "pixelSize"; type: "int" }
|
||||||
Method {
|
|
||||||
name: "setFontStyle"
|
|
||||||
type: "QVariant"
|
|
||||||
Parameter { name: "fontStyle"; type: "QVariant" }
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
Component {
|
Component {
|
||||||
prototype: "QQuickItem"
|
prototype: "QQuickItem"
|
||||||
@ -1037,7 +1127,15 @@ Module {
|
|||||||
isComposite: true
|
isComposite: true
|
||||||
defaultProperty: "data"
|
defaultProperty: "data"
|
||||||
Property { name: "checkedColor"; type: "QColor" }
|
Property { name: "checkedColor"; type: "QColor" }
|
||||||
Signal { name: "clicked2" }
|
Property { name: "onClickFunc"; type: "QVariant" }
|
||||||
|
}
|
||||||
|
Component {
|
||||||
|
prototype: "QQuickToolTip"
|
||||||
|
name: "FluentUI/FluTooltip 1.0"
|
||||||
|
exports: ["FluentUI/FluTooltip 1.0"]
|
||||||
|
exportMetaObjectRevisions: [0]
|
||||||
|
isComposite: true
|
||||||
|
defaultProperty: "contentData"
|
||||||
}
|
}
|
||||||
Component {
|
Component {
|
||||||
prototype: "QQuickRectangle"
|
prototype: "QQuickRectangle"
|
||||||
@ -1049,5 +1147,33 @@ Module {
|
|||||||
Property { name: "isMax"; type: "bool" }
|
Property { name: "isMax"; type: "bool" }
|
||||||
Property { name: "title"; type: "string" }
|
Property { name: "title"; type: "string" }
|
||||||
Property { name: "window"; type: "QVariant" }
|
Property { name: "window"; type: "QVariant" }
|
||||||
|
Method {
|
||||||
|
name: "showSuccess"
|
||||||
|
type: "QVariant"
|
||||||
|
Parameter { name: "text"; type: "QVariant" }
|
||||||
|
Parameter { name: "duration"; type: "QVariant" }
|
||||||
|
Parameter { name: "moremsg"; type: "QVariant" }
|
||||||
|
}
|
||||||
|
Method {
|
||||||
|
name: "showInfo"
|
||||||
|
type: "QVariant"
|
||||||
|
Parameter { name: "text"; type: "QVariant" }
|
||||||
|
Parameter { name: "duration"; type: "QVariant" }
|
||||||
|
Parameter { name: "moremsg"; type: "QVariant" }
|
||||||
|
}
|
||||||
|
Method {
|
||||||
|
name: "showWarning"
|
||||||
|
type: "QVariant"
|
||||||
|
Parameter { name: "text"; type: "QVariant" }
|
||||||
|
Parameter { name: "duration"; type: "QVariant" }
|
||||||
|
Parameter { name: "moremsg"; type: "QVariant" }
|
||||||
|
}
|
||||||
|
Method {
|
||||||
|
name: "showError"
|
||||||
|
type: "QVariant"
|
||||||
|
Parameter { name: "text"; type: "QVariant" }
|
||||||
|
Parameter { name: "duration"; type: "QVariant" }
|
||||||
|
Parameter { name: "moremsg"; type: "QVariant" }
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -3,7 +3,6 @@ import QtQuick.Window 2.15
|
|||||||
import QtQuick.Layouts 1.15
|
import QtQuick.Layouts 1.15
|
||||||
import FluentUI 1.0
|
import FluentUI 1.0
|
||||||
|
|
||||||
|
|
||||||
Rectangle{
|
Rectangle{
|
||||||
|
|
||||||
color: FluApp.isDark ? "#323232" : "#FFFFFF"
|
color: FluApp.isDark ? "#323232" : "#FFFFFF"
|
||||||
@ -63,7 +62,7 @@ Rectangle{
|
|||||||
}
|
}
|
||||||
FluToggleSwitch{
|
FluToggleSwitch{
|
||||||
checked: FluApp.isDark
|
checked: FluApp.isDark
|
||||||
onClicked2:{
|
onClickFunc:function(){
|
||||||
FluApp.isDark = !FluApp.isDark
|
FluApp.isDark = !FluApp.isDark
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -73,7 +72,7 @@ Rectangle{
|
|||||||
icon : FluentIcons.FA_window_minimize
|
icon : FluentIcons.FA_window_minimize
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
iconSize: 15
|
iconSize: 15
|
||||||
iconColor: FluApp.isDark ? "#FFFFFF" : "#000000"
|
text:"最小化"
|
||||||
onClicked: {
|
onClicked: {
|
||||||
Window.window.showMinimized()
|
Window.window.showMinimized()
|
||||||
}
|
}
|
||||||
@ -85,7 +84,7 @@ Rectangle{
|
|||||||
return Window.Maximized === Window.window.visibility ? FluentIcons.FA_window_restore : FluentIcons.FA_window_maximize
|
return Window.Maximized === Window.window.visibility ? FluentIcons.FA_window_restore : FluentIcons.FA_window_maximize
|
||||||
}
|
}
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
iconColor: FluApp.isDark ? "#FFFFFF" : "#000000"
|
text:Window.Maximized === Window.window.visibility?"向下还原":"最大化"
|
||||||
iconSize: 15
|
iconSize: 15
|
||||||
onClicked: {
|
onClicked: {
|
||||||
toggleMaximized()
|
toggleMaximized()
|
||||||
@ -94,19 +93,18 @@ Rectangle{
|
|||||||
FluIconButton{
|
FluIconButton{
|
||||||
icon : FluentIcons.FA_close
|
icon : FluentIcons.FA_close
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
text:"关闭"
|
||||||
iconSize: 15
|
iconSize: 15
|
||||||
iconColor: FluApp.isDark ? "#FFFFFF" : "#000000"
|
|
||||||
onClicked: {
|
onClicked: {
|
||||||
Window.window.close()
|
Window.window.close()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Rectangle{
|
FluDivider{
|
||||||
width: parent.width;
|
width: parent.width;
|
||||||
height: 1;
|
height: 1;
|
||||||
anchors.bottom: parent.bottom;
|
anchors.bottom: parent.bottom;
|
||||||
color: FluApp.isDark ? "#666666" : "#EEEEEE"
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -4,6 +4,7 @@ import QtQuick.Controls 2.15
|
|||||||
Rectangle {
|
Rectangle {
|
||||||
id: button
|
id: button
|
||||||
|
|
||||||
|
property string text: "Standard Button"
|
||||||
property int startPadding : 15
|
property int startPadding : 15
|
||||||
property int endPadding : 15
|
property int endPadding : 15
|
||||||
property int topPadding: 8
|
property int topPadding: 8
|
||||||
@ -15,12 +16,12 @@ Rectangle {
|
|||||||
color:{
|
color:{
|
||||||
if(FluApp.isDark){
|
if(FluApp.isDark){
|
||||||
if(disabled){
|
if(disabled){
|
||||||
return "#C7C7C7"
|
return Qt.rgba(59/255,59/255,59/255,1)
|
||||||
}
|
}
|
||||||
return button_mouse.containsMouse ? "#444444" : "#3e3e3e"
|
return button_mouse.containsMouse ? "#444444" : "#3e3e3e"
|
||||||
}else{
|
}else{
|
||||||
if(disabled){
|
if(disabled){
|
||||||
return "#C7C7C7"
|
return Qt.rgba(252/255,252/255,252/255,1)
|
||||||
}
|
}
|
||||||
return button_mouse.containsMouse ? "#FBFBFB" : "#FFFFFF"
|
return button_mouse.containsMouse ? "#FBFBFB" : "#FFFFFF"
|
||||||
}
|
}
|
||||||
@ -34,13 +35,26 @@ Rectangle {
|
|||||||
|
|
||||||
FluText {
|
FluText {
|
||||||
id: button_text
|
id: button_text
|
||||||
text: "Standard Button"
|
text: button.text
|
||||||
font.pixelSize: 14
|
font.pixelSize: 14
|
||||||
leftPadding: button.startPadding
|
leftPadding: button.startPadding
|
||||||
rightPadding: button.endPadding
|
rightPadding: button.endPadding
|
||||||
topPadding: button.topPadding
|
topPadding: button.topPadding
|
||||||
bottomPadding: button.bottomPadding
|
bottomPadding: button.bottomPadding
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
|
color: {
|
||||||
|
if(FluApp.isDark){
|
||||||
|
if(disabled){
|
||||||
|
return Qt.rgba(131/255,131/255,131/255,1)
|
||||||
|
}
|
||||||
|
return Qt.rgba(1,1,1,1)
|
||||||
|
}else{
|
||||||
|
if(disabled){
|
||||||
|
return Qt.rgba(160/255,160/255,160/255,1)
|
||||||
|
}
|
||||||
|
return Qt.rgba(0,0,0,1)
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
|
||||||
|
8
src/controls/FluDivider.qml
Normal file
8
src/controls/FluDivider.qml
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
|
||||||
|
color: FluApp.isDark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(238/255,238/255,238/255,1)
|
||||||
|
|
||||||
|
}
|
@ -1,4 +1,5 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
|
||||||
|
@ -1,30 +1,48 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
import QtQuick.Controls 2.15
|
import QtQuick.Controls 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
id: button
|
id: button
|
||||||
|
|
||||||
|
property string text: "Filled Button"
|
||||||
property int startPadding : 15
|
property int startPadding : 15
|
||||||
property int endPadding : 15
|
property int endPadding : 15
|
||||||
property int topPadding: 8
|
property int topPadding: 8
|
||||||
property int bottomPadding: 8
|
property int bottomPadding: 8
|
||||||
property bool disabled: false
|
property bool disabled: false
|
||||||
property color primaryColor : "#0064B0"
|
|
||||||
signal clicked
|
signal clicked
|
||||||
radius: 4
|
radius: 4
|
||||||
color:{
|
color:{
|
||||||
|
if(FluApp.isDark){
|
||||||
if(disabled){
|
if(disabled){
|
||||||
return "#C7C7C7"
|
return Qt.rgba(199/255,199/255,199/255,1)
|
||||||
|
}
|
||||||
|
return button_mouse.containsMouse ? Qt.rgba(74/255,149/255,207/255,1) : Qt.rgba(76/255,160/255,224/255,1)
|
||||||
|
}else{
|
||||||
|
if(disabled){
|
||||||
|
return Qt.rgba(199/255,199/255,199/255,1)
|
||||||
|
}
|
||||||
|
return button_mouse.containsMouse ? Qt.rgba(25/255,117/255,187/255,1) : Qt.rgba(0/255,102/255,180/255,1)
|
||||||
}
|
}
|
||||||
return button_mouse.containsMouse ? Qt.lighter(primaryColor,1.15) : primaryColor
|
|
||||||
}
|
}
|
||||||
width: button_text.implicitWidth
|
width: button_text.implicitWidth
|
||||||
height: button_text.implicitHeight
|
height: button_text.implicitHeight
|
||||||
|
|
||||||
FluText {
|
FluText {
|
||||||
id: button_text
|
id: button_text
|
||||||
text: "Filled Button"
|
text: button.text
|
||||||
color: "#FFFFFFFF"
|
color: {
|
||||||
|
if(FluApp.isDark){
|
||||||
|
if(disabled){
|
||||||
|
return Qt.rgba(173/255,173/255,173/255,1)
|
||||||
|
}
|
||||||
|
return Qt.rgba(0,0,0,1)
|
||||||
|
}else{
|
||||||
|
return Qt.rgba(1,1,1,1)
|
||||||
|
}
|
||||||
|
}
|
||||||
font.pixelSize: 14
|
font.pixelSize: 14
|
||||||
leftPadding: button.startPadding
|
leftPadding: button.startPadding
|
||||||
rightPadding: button.endPadding
|
rightPadding: button.endPadding
|
||||||
|
16
src/controls/FluIcon.qml
Normal file
16
src/controls/FluIcon.qml
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
|
||||||
|
Text {
|
||||||
|
|
||||||
|
property int icon
|
||||||
|
property int iconSize: 20
|
||||||
|
property color iconColor: FluApp.isDark ? "#FFFFFF" : "#000000"
|
||||||
|
|
||||||
|
id:text_icon
|
||||||
|
font.family: "fontawesome"
|
||||||
|
font.pixelSize: iconSize
|
||||||
|
horizontalAlignment: Text.AlignHCenter
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
color: iconColor
|
||||||
|
text: (String.fromCharCode(icon).toString(16));
|
||||||
|
}
|
@ -1,4 +1,5 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
|
|
||||||
@ -8,16 +9,23 @@ Rectangle {
|
|||||||
|
|
||||||
property int iconSize: 20
|
property int iconSize: 20
|
||||||
property int icon
|
property int icon
|
||||||
property color iconColor: "#000000"
|
property alias text: tool_tip.text
|
||||||
signal clicked
|
signal clicked
|
||||||
|
property bool disabled: false
|
||||||
|
|
||||||
radius: 4
|
radius: 4
|
||||||
|
|
||||||
color: {
|
color: {
|
||||||
if(FluApp.isDark){
|
if(FluApp.isDark){
|
||||||
return button_mouse.containsMouse ? "#000000" : "#00000000"
|
if(disabled){
|
||||||
|
return Qt.rgba(59/255,59/255,59/255,1)
|
||||||
|
}
|
||||||
|
return button_mouse.containsMouse ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(50/255,50/255,50/255,1)
|
||||||
}else{
|
}else{
|
||||||
return button_mouse.containsMouse ? "#F4F4F4" : "#00000000"
|
if(disabled){
|
||||||
|
return Qt.rgba(1,1,1,1)
|
||||||
|
}
|
||||||
|
return button_mouse.containsMouse ? Qt.rgba(244/255,244/255,244/255,1) : Qt.rgba(1,1,1,1)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -28,7 +36,19 @@ Rectangle {
|
|||||||
horizontalAlignment: Text.AlignHCenter
|
horizontalAlignment: Text.AlignHCenter
|
||||||
verticalAlignment: Text.AlignVCenter
|
verticalAlignment: Text.AlignVCenter
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
color: iconColor
|
color:{
|
||||||
|
if(FluApp.isDark){
|
||||||
|
if(disabled){
|
||||||
|
return Qt.rgba(130/255,130/255,130/255,1)
|
||||||
|
}
|
||||||
|
return Qt.rgba(1,1,1,1)
|
||||||
|
}else{
|
||||||
|
if(disabled){
|
||||||
|
return Qt.rgba(161/255,161/255,161/255,1)
|
||||||
|
}
|
||||||
|
return Qt.rgba(0,0,0,1)
|
||||||
|
}
|
||||||
|
}
|
||||||
text: (String.fromCharCode(icon).toString(16));
|
text: (String.fromCharCode(icon).toString(16));
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -36,9 +56,21 @@ Rectangle {
|
|||||||
id:button_mouse
|
id:button_mouse
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
|
enabled: !disabled
|
||||||
onClicked: {
|
onClicked: {
|
||||||
button.clicked()
|
button.clicked()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
FluTooltip{
|
||||||
|
id:tool_tip
|
||||||
|
visible: {
|
||||||
|
if(button.text === ""){
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
return button_mouse.containsMouse
|
||||||
|
}
|
||||||
|
delay: 1000
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
233
src/controls/FluInfoBar.qml
Normal file
233
src/controls/FluInfoBar.qml
Normal file
@ -0,0 +1,233 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
|
FluObject {
|
||||||
|
id:infoBar
|
||||||
|
|
||||||
|
property var root;
|
||||||
|
property int layoutY: 75;
|
||||||
|
|
||||||
|
function showSuccess(text,duration,moremsg){
|
||||||
|
mcontrol.create(mcontrol.const_success,text,duration,moremsg ? moremsg : "");
|
||||||
|
}
|
||||||
|
|
||||||
|
function showInfo(text,duration,moremsg){
|
||||||
|
mcontrol.create(mcontrol.const_info,text,duration,moremsg ? moremsg : "");
|
||||||
|
}
|
||||||
|
|
||||||
|
function showWarning(text,duration,moremsg){
|
||||||
|
mcontrol.create(mcontrol.const_warning,text,duration,moremsg ? moremsg : "");
|
||||||
|
}
|
||||||
|
|
||||||
|
function showError(text,duration,moremsg){
|
||||||
|
mcontrol.create(mcontrol.const_error,text,duration,moremsg ? moremsg : "");
|
||||||
|
}
|
||||||
|
|
||||||
|
function showCustom(itemcomponent,duration){
|
||||||
|
mcontrol.createCustom(itemcomponent,duration);
|
||||||
|
}
|
||||||
|
|
||||||
|
FluObject{
|
||||||
|
id:mcontrol
|
||||||
|
|
||||||
|
property string const_success: "success";
|
||||||
|
property string const_info: "info";
|
||||||
|
property string const_warning: "warning";
|
||||||
|
property string const_error: "error";
|
||||||
|
|
||||||
|
property int maxWidth: 300;
|
||||||
|
|
||||||
|
property var screenLayout: null;
|
||||||
|
|
||||||
|
function create(type,text,duration,moremsg){
|
||||||
|
if(screenLayout){
|
||||||
|
var last = screenLayout.getLastloader();
|
||||||
|
if(last.type === type && last.text === text && moremsg === last.moremsg){
|
||||||
|
last.restart();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
initScreenLayout();
|
||||||
|
contentComponent.createObject(screenLayout,{
|
||||||
|
type:type,
|
||||||
|
text:text,
|
||||||
|
duration:duration,
|
||||||
|
moremsg:moremsg,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function createCustom(itemcomponent,duration){
|
||||||
|
initScreenLayout();
|
||||||
|
if(itemcomponent){
|
||||||
|
contentComponent.createObject(screenLayout,{itemcomponent:itemcomponent,duration:duration});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function initScreenLayout(){
|
||||||
|
if(screenLayout == null){
|
||||||
|
screenLayout = screenlayoutComponent.createObject(root);
|
||||||
|
screenLayout.y = infoBar.layoutY;
|
||||||
|
screenLayout.z = 100000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Component{
|
||||||
|
id:screenlayoutComponent
|
||||||
|
Column{
|
||||||
|
spacing: 20
|
||||||
|
width: parent.width
|
||||||
|
move: Transition {
|
||||||
|
NumberAnimation { properties: "y"; easing.type: Easing.OutBack; duration: 300 }
|
||||||
|
}
|
||||||
|
|
||||||
|
onChildrenChanged: if(children.length === 0) destroy();
|
||||||
|
|
||||||
|
function getLastloader(){
|
||||||
|
if(children.length > 0){
|
||||||
|
return children[children.length - 1];
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Component{
|
||||||
|
id:contentComponent
|
||||||
|
Item{
|
||||||
|
id:content;
|
||||||
|
property int duration: 1500
|
||||||
|
property var itemcomponent
|
||||||
|
property string type
|
||||||
|
property string text
|
||||||
|
property string moremsg
|
||||||
|
|
||||||
|
width: parent.width;
|
||||||
|
height: loader.height;
|
||||||
|
|
||||||
|
function close(){
|
||||||
|
content.destroy();
|
||||||
|
}
|
||||||
|
|
||||||
|
function restart(){
|
||||||
|
delayTimer.restart();
|
||||||
|
}
|
||||||
|
|
||||||
|
Timer {
|
||||||
|
id:delayTimer
|
||||||
|
interval: duration; running: true; repeat: true
|
||||||
|
onTriggered: content.close();
|
||||||
|
}
|
||||||
|
|
||||||
|
Loader{
|
||||||
|
id:loader;
|
||||||
|
x:(parent.width - width) / 2;
|
||||||
|
property var _super: content;
|
||||||
|
|
||||||
|
scale: item ? 1 : 0;
|
||||||
|
asynchronous: true
|
||||||
|
|
||||||
|
Behavior on scale {
|
||||||
|
NumberAnimation {
|
||||||
|
easing.type: Easing.OutBack;
|
||||||
|
duration: 100
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
sourceComponent:itemcomponent ? itemcomponent : mcontrol.fluent_sytle;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
property Component fluent_sytle: Rectangle{
|
||||||
|
width: rowlayout.width + (_super.moremsg ? 25 : 80);
|
||||||
|
height: rowlayout.height + 20;
|
||||||
|
color: {
|
||||||
|
if(FluApp.isDark){
|
||||||
|
switch(_super.type){
|
||||||
|
case mcontrol.const_success: return Qt.rgba(57/255,61/255,27/255,1);
|
||||||
|
case mcontrol.const_warning: return Qt.rgba(67/255,53/255,25/255,1);
|
||||||
|
case mcontrol.const_info: return Qt.rgba(39/255,39/255,39/255,1);
|
||||||
|
case mcontrol.const_error: return Qt.rgba(68/255,39/255,38/255,1);
|
||||||
|
}
|
||||||
|
return Qt.rgba(255,255,255,1)
|
||||||
|
}else{
|
||||||
|
switch(_super.type){
|
||||||
|
case mcontrol.const_success: return "#dff6dd";
|
||||||
|
case mcontrol.const_warning: return "#fff4ce";
|
||||||
|
case mcontrol.const_info: return "#f4f4f4";
|
||||||
|
case mcontrol.const_error: return "#fde7e9";
|
||||||
|
}
|
||||||
|
return "#FFFFFF"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
radius: 4
|
||||||
|
border.width: 1
|
||||||
|
border.color: {
|
||||||
|
if(FluApp.isDark){
|
||||||
|
switch(_super.type){
|
||||||
|
case mcontrol.const_success: return Qt.rgba(56/255,61/255,27/255,1);
|
||||||
|
case mcontrol.const_warning: return Qt.rgba(66/255,53/255,25/255,1);
|
||||||
|
case mcontrol.const_info: return Qt.rgba(38/255,39/255,39/255,1);
|
||||||
|
case mcontrol.const_error: return Qt.rgba(67/255,39/255,38/255,1);
|
||||||
|
}
|
||||||
|
return "#FFFFFF"
|
||||||
|
}else{
|
||||||
|
switch(_super.type){
|
||||||
|
case mcontrol.const_success: return "#d2e8d0";
|
||||||
|
case mcontrol.const_warning: return "#f0e6c2";
|
||||||
|
case mcontrol.const_info: return "#e6e6e6";
|
||||||
|
case mcontrol.const_error: return "#eed9db";
|
||||||
|
}
|
||||||
|
return "#FFFFFF"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Row{
|
||||||
|
id:rowlayout
|
||||||
|
x:20;
|
||||||
|
y:(parent.height - height) / 2;
|
||||||
|
spacing: 10
|
||||||
|
|
||||||
|
FluIcon{
|
||||||
|
icon:{
|
||||||
|
switch(_super.type){
|
||||||
|
case mcontrol.const_success: return FluentIcons.FA_check_circle;
|
||||||
|
case mcontrol.const_warning: return FluentIcons.FA_info_circle;
|
||||||
|
case mcontrol.const_info: return FluentIcons.FA_info_circle;
|
||||||
|
case mcontrol.const_error: return FluentIcons.FA_times_circle;
|
||||||
|
}
|
||||||
|
return FluentIcons.FA_info_circle
|
||||||
|
}
|
||||||
|
iconSize:20
|
||||||
|
color: {
|
||||||
|
if(FluApp.isDark){
|
||||||
|
switch(_super.type){
|
||||||
|
case mcontrol.const_success: return Qt.rgba(108/255,203/255,95/255,1);
|
||||||
|
case mcontrol.const_warning: return Qt.rgba(252/255,225/255,0/255,1);
|
||||||
|
case mcontrol.const_info: return Qt.rgba(76/255,160/255,224/255,1);
|
||||||
|
case mcontrol.const_error: return Qt.rgba(255/255,153/255,164/255,1);
|
||||||
|
}
|
||||||
|
return "#FFFFFF"
|
||||||
|
}else{
|
||||||
|
switch(_super.type){
|
||||||
|
case mcontrol.const_success: return "#0f7b0f";
|
||||||
|
case mcontrol.const_warning: return "#9d5d00";
|
||||||
|
case mcontrol.const_info: return "#0066b4";
|
||||||
|
case mcontrol.const_error: return "#c42b1c";
|
||||||
|
}
|
||||||
|
return "#FFFFFF"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
FluText{
|
||||||
|
text:_super.text
|
||||||
|
wrapMode: Text.WrapAnywhere
|
||||||
|
width: Math.min(implicitWidth,mcontrol.maxWidth)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
7
src/controls/FluObject.qml
Normal file
7
src/controls/FluObject.qml
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
|
||||||
|
QtObject {
|
||||||
|
id:flu_object;
|
||||||
|
|
||||||
|
default property list<QtObject> children;
|
||||||
|
}
|
@ -1,4 +1,5 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
|
||||||
|
@ -1,5 +1,111 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import QtQuick.Layouts 1.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
|
||||||
|
id:root
|
||||||
|
width: childrenRect.width
|
||||||
|
height: childrenRect.height
|
||||||
|
property bool checked: false
|
||||||
|
property string text: "RodioButton"
|
||||||
|
signal clicked
|
||||||
|
property bool disabled: false
|
||||||
|
|
||||||
|
RowLayout{
|
||||||
|
Rectangle{
|
||||||
|
id:rect_check
|
||||||
|
width: 20
|
||||||
|
height: 20
|
||||||
|
radius: 10
|
||||||
|
layer.samples: 4
|
||||||
|
layer.enabled: true
|
||||||
|
layer.smooth: true
|
||||||
|
border.width: {
|
||||||
|
if(checked&&disabled){
|
||||||
|
return 3
|
||||||
}
|
}
|
||||||
|
if(root_mouse.containsPress){
|
||||||
|
if(checked){
|
||||||
|
return 5
|
||||||
|
}
|
||||||
|
return 1
|
||||||
|
}
|
||||||
|
if(root_mouse.containsMouse){
|
||||||
|
if(checked){
|
||||||
|
return 3
|
||||||
|
}
|
||||||
|
return 1
|
||||||
|
}
|
||||||
|
return checked ? 5 : 1
|
||||||
|
}
|
||||||
|
Behavior on border.width {
|
||||||
|
NumberAnimation{
|
||||||
|
duration: 100
|
||||||
|
}
|
||||||
|
}
|
||||||
|
border.color: {
|
||||||
|
if(disabled){
|
||||||
|
if(FluApp.isDark){
|
||||||
|
return Qt.rgba(82/255,82/255,82/255,1)
|
||||||
|
}else{
|
||||||
|
return Qt.rgba(198/255,198/255,198/255,1)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if(checked){
|
||||||
|
if(FluApp.isDark){
|
||||||
|
return Qt.rgba(76/255,164/255,224/255,1)
|
||||||
|
}else{
|
||||||
|
|
||||||
|
return Qt.rgba(0/255,102/255,180/255,1)
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
if(FluApp.isDark){
|
||||||
|
return Qt.rgba(161/255,161/255,161/255,1)
|
||||||
|
}else{
|
||||||
|
|
||||||
|
return Qt.rgba(141/255,141/255,141/255,1)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
color:{
|
||||||
|
if(disabled&&checked){
|
||||||
|
return Qt.rgba(159/255,159/255,159/255,1)
|
||||||
|
}
|
||||||
|
if(FluApp.isDark){
|
||||||
|
if(root_mouse.containsMouse){
|
||||||
|
return Qt.rgba(43/255,43/255,43/255,1)
|
||||||
|
}
|
||||||
|
return Qt.rgba(50/255,50/255,50/255,1)
|
||||||
|
}else{
|
||||||
|
if(root_mouse.containsMouse){
|
||||||
|
if(checked){
|
||||||
|
return Qt.rgba(1,1,1,1)
|
||||||
|
}
|
||||||
|
return Qt.rgba(222/255,222/255,222/255,1)
|
||||||
|
}
|
||||||
|
return Qt.rgba(1,1,1,1)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
FluText{
|
||||||
|
text: root.text
|
||||||
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
MouseArea{
|
||||||
|
id:root_mouse
|
||||||
|
hoverEnabled: true
|
||||||
|
anchors.fill: parent
|
||||||
|
enabled: !disabled
|
||||||
|
onClicked: {
|
||||||
|
root.clicked()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
@ -1,5 +1,54 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import QtQuick.Controls 2.15
|
||||||
|
import QtQuick.Shapes 1.15
|
||||||
|
import QtGraphicalEffects 1.15
|
||||||
|
|
||||||
Item{
|
Item{
|
||||||
|
id:root
|
||||||
|
property var radius:[0,0,0,0]
|
||||||
|
property color color : "#FFFFFF"
|
||||||
|
property color borderColor:"transparent"
|
||||||
|
property int borderWidth: 1
|
||||||
|
default property alias contentItem: container.children
|
||||||
|
|
||||||
|
Rectangle{
|
||||||
|
id:container
|
||||||
|
width: root.width
|
||||||
|
height: root.height
|
||||||
|
visible: false
|
||||||
|
color:root.color
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
Shape {
|
||||||
|
id: shape
|
||||||
|
width: root.width
|
||||||
|
height: root.height
|
||||||
|
layer.enabled: true
|
||||||
|
layer.samples: 4
|
||||||
|
layer.smooth: true
|
||||||
|
visible: false
|
||||||
|
ShapePath {
|
||||||
|
startX: 0
|
||||||
|
startY: radius[0]
|
||||||
|
fillColor: color
|
||||||
|
strokeColor: borderColor
|
||||||
|
strokeWidth: borderWidth
|
||||||
|
PathQuad { x: radius[0]; y: 0; controlX: 0; controlY: 0 }
|
||||||
|
PathLine { x: shape.width - radius[1]; y: 0 }
|
||||||
|
PathQuad { x: shape.width; y: radius[1]; controlX: shape.width; controlY: 0 }
|
||||||
|
PathLine { x: shape.width; y: shape.height - radius[2] }
|
||||||
|
PathQuad { x: shape.width - radius[2]; y: shape.height; controlX: shape.width; controlY: shape.height }
|
||||||
|
PathLine { x: radius[3]; y: shape.height }
|
||||||
|
PathQuad { x: 0; y: shape.height - radius[3]; controlX: 0; controlY: shape.height }
|
||||||
|
PathLine { x: 0; y: radius[0] }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
OpacityMask {
|
||||||
|
anchors.fill: container
|
||||||
|
source: container
|
||||||
|
maskSource: shape
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
71
src/controls/FluShadow.qml
Normal file
71
src/controls/FluShadow.qml
Normal file
@ -0,0 +1,71 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
|
||||||
|
Item {
|
||||||
|
|
||||||
|
id:root
|
||||||
|
|
||||||
|
anchors.fill: parent
|
||||||
|
anchors.margins: -5
|
||||||
|
property color shadowColor: "#333333"
|
||||||
|
property int radius: 5
|
||||||
|
property bool isShadow: true
|
||||||
|
|
||||||
|
|
||||||
|
Rectangle{
|
||||||
|
id:react_background
|
||||||
|
width: root.width - 8
|
||||||
|
height: root.height - 8
|
||||||
|
anchors.centerIn: parent
|
||||||
|
radius: root.radius
|
||||||
|
color:"#00000000"
|
||||||
|
opacity: 0.25
|
||||||
|
border.width: 1
|
||||||
|
border.color : Qt.lighter(shadowColor,1.1)
|
||||||
|
}
|
||||||
|
|
||||||
|
Rectangle{
|
||||||
|
width: root.width - 6
|
||||||
|
height: root.height - 6
|
||||||
|
anchors.centerIn: parent
|
||||||
|
radius: root.radius
|
||||||
|
color:"#00000000"
|
||||||
|
border.width: 1
|
||||||
|
opacity: 0.2
|
||||||
|
border.color : Qt.lighter(shadowColor,1.2)
|
||||||
|
}
|
||||||
|
|
||||||
|
Rectangle{
|
||||||
|
width: root.width - 4
|
||||||
|
height: root.height - 4
|
||||||
|
anchors.centerIn: parent
|
||||||
|
radius: root.radius
|
||||||
|
color:"#00000000"
|
||||||
|
border.width: 1
|
||||||
|
opacity: 0.15
|
||||||
|
border.color : Qt.lighter(shadowColor,1.3)
|
||||||
|
}
|
||||||
|
|
||||||
|
Rectangle{
|
||||||
|
width: root.width - 2
|
||||||
|
height: root.height - 2
|
||||||
|
anchors.centerIn: parent
|
||||||
|
radius: root.radius
|
||||||
|
color:"#00000000"
|
||||||
|
border.width: 1
|
||||||
|
opacity: 0.1
|
||||||
|
border.color : Qt.lighter(shadowColor,1.4)
|
||||||
|
}
|
||||||
|
|
||||||
|
Rectangle{
|
||||||
|
width: root.width
|
||||||
|
height: root.height
|
||||||
|
anchors.centerIn: parent
|
||||||
|
radius: root.radius
|
||||||
|
color:"#00000000"
|
||||||
|
border.width: 1
|
||||||
|
opacity:0.05
|
||||||
|
border.color : Qt.lighter(shadowColor,1.5)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
@ -1,4 +1,5 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
|
|
||||||
@ -18,57 +18,55 @@ Text {
|
|||||||
|
|
||||||
property int fontStyle: FluText.Body
|
property int fontStyle: FluText.Body
|
||||||
property color textColor: FluApp.isDark ? "#FFFFFF" : "#1A1A1A"
|
property color textColor: FluApp.isDark ? "#FFFFFF" : "#1A1A1A"
|
||||||
|
|
||||||
property int pixelSize : 14
|
property int pixelSize : 14
|
||||||
|
|
||||||
color: textColor
|
color: textColor
|
||||||
|
|
||||||
Component.onCompleted: {
|
font.bold: {
|
||||||
setFontStyle(fontStyle)
|
|
||||||
}
|
|
||||||
|
|
||||||
onStyleChanged: {
|
|
||||||
setFontStyle(fontStyle)
|
|
||||||
}
|
|
||||||
|
|
||||||
function setFontStyle(fontStyle) {
|
|
||||||
switch (fontStyle) {
|
switch (fontStyle) {
|
||||||
case FluText.Display:
|
case FluText.Display:
|
||||||
font.bold = true
|
return true
|
||||||
font.pixelSize = text.pixelSize * 4
|
|
||||||
break
|
|
||||||
case FluText.TitleLarge:
|
case FluText.TitleLarge:
|
||||||
font.bold = true
|
return true
|
||||||
font.pixelSize = text.pixelSize * 2
|
|
||||||
break
|
|
||||||
case FluText.Title:
|
case FluText.Title:
|
||||||
font.bold = true
|
return true
|
||||||
font.pixelSize = text.pixelSize * 1.5
|
|
||||||
break
|
|
||||||
case FluText.Subtitle:
|
case FluText.Subtitle:
|
||||||
font.bold = true
|
return true
|
||||||
font.pixelSize = text.pixelSize * 0.9
|
|
||||||
break
|
|
||||||
case FluText.BodyLarge:
|
case FluText.BodyLarge:
|
||||||
font.bold = false
|
return false
|
||||||
font.pixelSize = text.pixelSize * 1.1
|
|
||||||
break
|
|
||||||
case FluText.BodyStrong:
|
case FluText.BodyStrong:
|
||||||
font.bold = true
|
return true
|
||||||
font.pixelSize = text.pixelSize * 1.0
|
|
||||||
break
|
|
||||||
case FluText.Body:
|
case FluText.Body:
|
||||||
font.bold = false
|
return false
|
||||||
font.pixelSize = text.pixelSize
|
|
||||||
break
|
|
||||||
case FluText.Caption:
|
case FluText.Caption:
|
||||||
font.bold = false
|
return false
|
||||||
font.pixelSize = text.pixelSize * 0.8
|
|
||||||
break
|
|
||||||
default:
|
default:
|
||||||
font.pixelSize = text.pixelSize * 1.0
|
return false
|
||||||
break
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
font.pixelSize: {
|
||||||
|
switch (fontStyle) {
|
||||||
|
case FluText.Display:
|
||||||
|
return text.pixelSize * 4
|
||||||
|
case FluText.TitleLarge:
|
||||||
|
return text.pixelSize * 2
|
||||||
|
case FluText.Title:
|
||||||
|
return text.pixelSize * 1.5
|
||||||
|
case FluText.Subtitle:
|
||||||
|
return text.pixelSize * 0.9
|
||||||
|
case FluText.BodyLarge:
|
||||||
|
return text.pixelSize * 1.1
|
||||||
|
case FluText.BodyStrong:
|
||||||
|
return text.pixelSize * 1.0
|
||||||
|
case FluText.Body:
|
||||||
|
return text.font.pixelSize = 14
|
||||||
|
case FluText.Caption:
|
||||||
|
return text.pixelSize * 0.8
|
||||||
|
default:
|
||||||
|
return text.pixelSize * 1.0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
import QtQuick.Controls 2.15
|
import QtQuick.Controls 2.15
|
||||||
import QtQuick.Shapes 1.15
|
import QtQuick.Shapes 1.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
|
||||||
|
@ -1,10 +1,11 @@
|
|||||||
import QtQuick 2.0
|
import QtQuick 2.0
|
||||||
import QtQuick.Controls 2.0
|
import QtQuick.Controls 2.0
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
Switch {
|
Switch {
|
||||||
id: root
|
id: root
|
||||||
property color checkedColor: "#0064B0"
|
property color checkedColor: "#0064B0"
|
||||||
signal clicked2
|
property var onClickFunc
|
||||||
width: 40
|
width: 40
|
||||||
implicitWidth: 40
|
implicitWidth: 40
|
||||||
height: 20
|
height: 20
|
||||||
@ -24,10 +25,13 @@ Switch {
|
|||||||
}
|
}
|
||||||
return "#323232"
|
return "#323232"
|
||||||
}else{
|
}else{
|
||||||
|
if(root.checked){
|
||||||
|
return checkedColor
|
||||||
|
}
|
||||||
if(switch_mouse.containsMouse){
|
if(switch_mouse.containsMouse){
|
||||||
return "#F4F4F4"
|
return "#F4F4F4"
|
||||||
}
|
}
|
||||||
return root.checked ? checkedColor : "white"
|
return "#FFFFFF"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
border.width: 1
|
border.width: 1
|
||||||
@ -52,7 +56,11 @@ Switch {
|
|||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
onClicked: {
|
onClicked: {
|
||||||
root.clicked2()
|
if(root.onClickFunc){
|
||||||
|
root.onClickFunc()
|
||||||
|
}else{
|
||||||
|
root.checked = !root.checked
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
27
src/controls/FluTooltip.qml
Normal file
27
src/controls/FluTooltip.qml
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
import QtQuick 2.15
|
||||||
|
import QtQuick.Controls 2.15
|
||||||
|
import QtGraphicalEffects 1.15
|
||||||
|
import FluentUI 1.0
|
||||||
|
|
||||||
|
ToolTip {
|
||||||
|
id:tool_tip
|
||||||
|
|
||||||
|
contentItem: FluText {
|
||||||
|
text: tool_tip.text
|
||||||
|
font: tool_tip.font
|
||||||
|
padding: 4
|
||||||
|
wrapMode: Text.WrapAnywhere
|
||||||
|
}
|
||||||
|
|
||||||
|
background: Rectangle{
|
||||||
|
anchors.fill: parent
|
||||||
|
color: FluApp.isDark ? Qt.rgba(50/255,49/255,48/255,1) : Qt.rgba(1,1,1,1)
|
||||||
|
radius: 5
|
||||||
|
layer.enabled: true
|
||||||
|
layer.effect: DropShadow {
|
||||||
|
radius: 5
|
||||||
|
samples: 4
|
||||||
|
color: "#80000000"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
@ -27,7 +27,7 @@ Rectangle {
|
|||||||
|
|
||||||
onIsMaxChanged: {
|
onIsMaxChanged: {
|
||||||
if(isMax){
|
if(isMax){
|
||||||
root.anchors.margins = 8
|
root.anchors.margins = 8*(1/Screen.devicePixelRatio)
|
||||||
root.anchors.fill = parent
|
root.anchors.fill = parent
|
||||||
}else{
|
}else{
|
||||||
root.anchors.margins = 0
|
root.anchors.margins = 0
|
||||||
@ -55,4 +55,25 @@ Rectangle {
|
|||||||
id:helper
|
id:helper
|
||||||
}
|
}
|
||||||
|
|
||||||
|
FluInfoBar{
|
||||||
|
id:infoBar
|
||||||
|
root: root
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function showSuccess(text,duration,moremsg){
|
||||||
|
infoBar.showSuccess(text,duration,moremsg);
|
||||||
|
}
|
||||||
|
function showInfo(text,duration,moremsg){
|
||||||
|
infoBar.showInfo(text,duration,moremsg);
|
||||||
|
}
|
||||||
|
function showWarning(text,duration,moremsg){
|
||||||
|
infoBar.showWarning(text,duration,moremsg);
|
||||||
|
}
|
||||||
|
function showError(text,duration,moremsg){
|
||||||
|
infoBar.showError(text,duration,moremsg);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -18,5 +18,11 @@
|
|||||||
<file>controls/FluAppBar.qml</file>
|
<file>controls/FluAppBar.qml</file>
|
||||||
<file>controls/FluRectangle.qml</file>
|
<file>controls/FluRectangle.qml</file>
|
||||||
<file>controls/FluWindow.qml</file>
|
<file>controls/FluWindow.qml</file>
|
||||||
|
<file>controls/FluInfoBar.qml</file>
|
||||||
|
<file>controls/FluObject.qml</file>
|
||||||
|
<file>controls/FluIcon.qml</file>
|
||||||
|
<file>controls/FluDivider.qml</file>
|
||||||
|
<file>controls/FluTooltip.qml</file>
|
||||||
|
<file>controls/FluShadow.qml</file>
|
||||||
</qresource>
|
</qresource>
|
||||||
</RCC>
|
</RCC>
|
||||||
|
Loading…
Reference in New Issue
Block a user