amass/FluentUI
1
0
Fork 0
mirror of https://github.com/zhuzichu520/FluentUI.git synced 2025-07-02 16:15:28 +08:00
Code Issues Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
zhuzihcu
2023-02-28 18:29:00 +08:00
parent f1b52fc5ee
commit 02e4579021
38 changed files with 1188 additions and 156 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
example/AboutPage.qml Normal file
View 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: {
}
}
}
}

3
example/App.qml
View File

@ -12,7 +12,8 @@ Window {
FluApp.setAppWindow(app)
FluApp.routes = {
"/":"qrc:/MainPage.qml",
"/Setting":"qrc:/SettingPage.qml"
"/Setting":"qrc:/SettingPage.qml",
"/About":"qrc:/AboutPage.qml"
}
FluApp.initialRoute = "/"
FluApp.run()

18
example/MainPage.qml
View File

@ -19,8 +19,20 @@ FluWindow {
ListModel{
id:nav_items
ListElement{
text:"Controls"
page:"qrc:/T_Controls.qml"
text:"Buttons"
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{
text:"Typography"
@ -108,7 +120,7 @@ FluWindow {
bottomMargin: 20
}
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{
anchors.fill: parent

9
example/SettingPage.qml
View File

@ -12,10 +12,17 @@ FluWindow {
}
FluText{
text:"Display"
text:"设置"
fontStyle: FluText.Display
anchors.centerIn: parent
MouseArea{
anchors.fill: parent
onClicked: {
FluApp.navigate("/About")
}
}
}
}

59
example/T-Rectangle.qml Normal file
View 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
View 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"
}
}
}
}

50
example/T_Controls.qml
View File

@ -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
View 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
View 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
}
}
}

6
example/qml.qrc
View File

@ -1,9 +1,13 @@
<RCC>
<qresource prefix="/">
<file>T_Controls.qml</file>
<file>T_ToggleSwitch.qml</file>
<file>T_Typography.qml</file>
<file>App.qml</file>
<file>MainPage.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>
</RCC>