mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2024-11-23 11:17:15 +08:00
update
This commit is contained in:
zhuzihcu
parent
d835b7c23d
commit
bcc5d433a9
@ -34,7 +34,7 @@ FluWindow {
|
||||
fontStyle: FluText.Title
|
||||
}
|
||||
FluText{
|
||||
text:"v1.0.2"
|
||||
text:"v1.0.3"
|
||||
fontStyle: FluText.Body
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
}
|
||||
|
||||
@ -17,184 +17,164 @@ FluWindow {
|
||||
FluAppBar{
|
||||
id:appbar
|
||||
title: "FluentUI"
|
||||
showDark: true
|
||||
}
|
||||
|
||||
ListModel{
|
||||
id:nav_items
|
||||
ListElement{
|
||||
text:"Buttons"
|
||||
page:"qrc:/T_Buttons.qml"
|
||||
|
||||
FluObject{
|
||||
id:original_items
|
||||
|
||||
FluPaneItemHeader{
|
||||
title:"Inputs"
|
||||
}
|
||||
ListElement{
|
||||
text:"TextBox"
|
||||
page:"qrc:/T_TextBox.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"ToggleSwitch"
|
||||
page:"qrc:/T_ToggleSwitch.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"Slider"
|
||||
page:"qrc:/T_Slider.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"InfoBar"
|
||||
page:"qrc:/T_InfoBar.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"Dialog"
|
||||
page:"qrc:/T_Dialog.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"Progress"
|
||||
page:"qrc:/T_Progress.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"Rectangle"
|
||||
page:"qrc:/T_Rectangle.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"Expander"
|
||||
page:"qrc:/T_Expander.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"TreeView"
|
||||
page:"qrc:/T_TreeView.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"Theme"
|
||||
page:"qrc:/T_Theme.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"Awesome"
|
||||
page:"qrc:/T_Awesome.qml"
|
||||
}
|
||||
ListElement{
|
||||
text:"Typography"
|
||||
page:"qrc:/T_Typography.qml"
|
||||
|
||||
FluPaneItem{
|
||||
title:"Buttons"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_Buttons.qml")
|
||||
}
|
||||
}
|
||||
|
||||
FluIconButton{
|
||||
icon:FluentIcons.FA_navicon
|
||||
anchors{
|
||||
left: parent.left
|
||||
bottom: parent.bottom
|
||||
leftMargin: 12
|
||||
bottomMargin: 12
|
||||
FluPaneItem{
|
||||
title:"Slider"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_Slider.qml")
|
||||
}
|
||||
FluMenu{
|
||||
id:menu
|
||||
x:40
|
||||
margins:4
|
||||
FluMenuItem{
|
||||
text:"意见反馈"
|
||||
onClicked:{
|
||||
}
|
||||
|
||||
FluPaneItem{
|
||||
title:"ToggleSwitch"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_ToggleSwitch.qml")
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemHeader{
|
||||
title:"Form"
|
||||
}
|
||||
|
||||
FluPaneItem{
|
||||
title:"TextBox"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_TextBox.qml")
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemHeader{
|
||||
title:"Surface"
|
||||
}
|
||||
|
||||
FluPaneItem{
|
||||
title:"InfoBar"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_InfoBar.qml")
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItem{
|
||||
title:"Progress"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_Progress.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Rectangle"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_Rectangle.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Expander"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_Expander.qml")
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemHeader{
|
||||
title:"Popus"
|
||||
}
|
||||
|
||||
|
||||
FluPaneItem{
|
||||
title:"Dialog"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_Dialog.qml")
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemHeader{
|
||||
title:"Navigation"
|
||||
}
|
||||
|
||||
FluPaneItem{
|
||||
title:"TreeView"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_TreeView.qml")
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItemHeader{
|
||||
title:"Theming"
|
||||
}
|
||||
|
||||
|
||||
FluPaneItem{
|
||||
title:"Theme"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_Theme.qml")
|
||||
}
|
||||
}
|
||||
|
||||
FluPaneItem{
|
||||
title:"Awesome"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_Awesome.qml")
|
||||
}
|
||||
}
|
||||
FluPaneItem{
|
||||
title:"Typography"
|
||||
onTap:{
|
||||
nav_view.push("qrc:/T_Typography.qml")
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
FluObject{
|
||||
id:footer_items
|
||||
FluPaneItemSeparator{}
|
||||
FluPaneItem{
|
||||
title:"意见反馈"
|
||||
onTap:{
|
||||
Qt.openUrlExternally("https://github.com/zhuzichu520/FluentUI/issues/new")
|
||||
}
|
||||
}
|
||||
FluMenuItem{
|
||||
text:"关于"
|
||||
onClicked:{
|
||||
FluPaneItem{
|
||||
title:"关于"
|
||||
onTap:{
|
||||
FluApp.navigate("/About")
|
||||
}
|
||||
}
|
||||
}
|
||||
onClicked:{
|
||||
menu.open()
|
||||
}
|
||||
}
|
||||
|
||||
ListView{
|
||||
id:nav_list
|
||||
|
||||
FluNavigationView{
|
||||
id:nav_view
|
||||
anchors{
|
||||
top: appbar.bottom
|
||||
bottom: parent.bottom
|
||||
topMargin: 20
|
||||
bottomMargin: 52
|
||||
}
|
||||
ScrollBar.vertical: ScrollBar { }
|
||||
boundsBehavior: Flickable.StopAtBounds
|
||||
clip: true
|
||||
width: 160
|
||||
model: nav_items
|
||||
delegate: Item{
|
||||
height: 38
|
||||
width: nav_list.width
|
||||
|
||||
Rectangle{
|
||||
radius: 4
|
||||
anchors{
|
||||
top: parent.top
|
||||
bottom: parent.bottom
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
topMargin: 2
|
||||
bottomMargin: 2
|
||||
leftMargin: 6
|
||||
rightMargin: 6
|
||||
}
|
||||
MouseArea{
|
||||
id:item_mouse
|
||||
hoverEnabled: true
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
nav_list.currentIndex = index
|
||||
}
|
||||
}
|
||||
color: {
|
||||
if(FluTheme.isDark){
|
||||
if(nav_list.currentIndex === index){
|
||||
return "#2D2D2D"
|
||||
}
|
||||
if(item_mouse.containsMouse){
|
||||
return "#292929"
|
||||
}
|
||||
return "#202020"
|
||||
}else{
|
||||
if(item_mouse.containsMouse){
|
||||
return Qt.rgba(0,0,0,0.03)
|
||||
}
|
||||
if(nav_list.currentIndex === index){
|
||||
return Qt.rgba(0,0,0,0.06)
|
||||
}
|
||||
return Qt.rgba(0,0,0,0)
|
||||
}
|
||||
}
|
||||
|
||||
FluText{
|
||||
text:model.text
|
||||
anchors.centerIn: parent
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle{
|
||||
color: FluTheme.isDark ? "#323232" : "#FFFFFF"
|
||||
radius: 10
|
||||
clip: true
|
||||
anchors{
|
||||
left: nav_list.right
|
||||
leftMargin: 2
|
||||
top: appbar.bottom
|
||||
topMargin: 20
|
||||
right: parent.right
|
||||
rightMargin: 10
|
||||
bottom: parent.bottom
|
||||
bottomMargin: 20
|
||||
}
|
||||
border.width: 1
|
||||
border.color: FluTheme.isDark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(238/255,238/255,238/255,1)
|
||||
items:original_items
|
||||
footerItems:footer_items
|
||||
|
||||
Loader{
|
||||
anchors.fill: parent
|
||||
anchors.margins:20
|
||||
source: nav_items.get(nav_list.currentIndex).page
|
||||
Component.onCompleted: {
|
||||
nav_view.setCurrentIndex(1)
|
||||
nav_view.push("qrc:/T_Buttons.qml")
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
@ -4,20 +4,19 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluText{
|
||||
id:title
|
||||
text:"Awesome"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
FluContentPage {
|
||||
|
||||
title:"Awesome"
|
||||
|
||||
FluTextBox{
|
||||
id:text_box
|
||||
placeholderText: "请输入关键字"
|
||||
anchors{
|
||||
topMargin: 20
|
||||
top:title.bottom
|
||||
top:parent.top
|
||||
}
|
||||
}
|
||||
|
||||
FluFilledButton{
|
||||
text:"搜索"
|
||||
anchors{
|
||||
|
||||
@ -2,39 +2,35 @@
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
width: parent.width
|
||||
FluText{
|
||||
id:title
|
||||
text:"Buttons"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
width: parent.width
|
||||
RowLayout{
|
||||
FluScrollablePage{
|
||||
title:"Buttons"
|
||||
|
||||
spacing: 20
|
||||
|
||||
FluArea{
|
||||
Layout.topMargin: 20
|
||||
width: parent.width
|
||||
height: 68
|
||||
paddings: 10
|
||||
|
||||
FluButton{
|
||||
disabled:button_switch.checked
|
||||
onClicked: {
|
||||
showInfo("点击StandardButton")
|
||||
}
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
Item{
|
||||
height: 1
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
Row{
|
||||
spacing: 5
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:button_switch
|
||||
@ -44,21 +40,29 @@ Item {
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
FluDivider{
|
||||
Layout.fillWidth: true ; height:1;
|
||||
}
|
||||
RowLayout{
|
||||
Layout.topMargin: 20
|
||||
|
||||
FluArea{
|
||||
width: parent.width
|
||||
height: 68
|
||||
paddings: 10
|
||||
|
||||
FluFilledButton{
|
||||
disabled:filled_button_switch.checked
|
||||
onClicked: {
|
||||
showWarning("点击FilledButton")
|
||||
}
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
Item{
|
||||
height: 1
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
Row{
|
||||
spacing: 5
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:filled_button_switch
|
||||
@ -68,22 +72,31 @@ Item {
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
FluDivider{
|
||||
Layout.fillWidth: true ; height:1
|
||||
}
|
||||
RowLayout{
|
||||
Layout.topMargin: 20
|
||||
|
||||
|
||||
FluArea{
|
||||
width: parent.width
|
||||
height: 68
|
||||
paddings: 10
|
||||
|
||||
FluIconButton{
|
||||
icon:FluentIcons.FA_close
|
||||
disabled:icon_button_switch.checked
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
onClicked:{
|
||||
showSuccess("点击IconButton")
|
||||
}
|
||||
}
|
||||
Item{
|
||||
height: 1
|
||||
Layout.fillWidth: true
|
||||
|
||||
Row{
|
||||
spacing: 5
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:icon_button_switch
|
||||
@ -93,14 +106,19 @@ Item {
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
FluDivider{
|
||||
Layout.fillWidth: true ; height:1
|
||||
}
|
||||
RowLayout{
|
||||
Layout.topMargin: 20
|
||||
|
||||
FluArea{
|
||||
width: parent.width
|
||||
height: 100
|
||||
paddings: 10
|
||||
|
||||
ColumnLayout{
|
||||
spacing: 8
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
Repeater{
|
||||
id:repeater
|
||||
property int selecIndex : 0
|
||||
@ -115,9 +133,13 @@ Item {
|
||||
}
|
||||
}
|
||||
}
|
||||
Item{
|
||||
height: 1
|
||||
Layout.fillWidth: true
|
||||
|
||||
|
||||
Row{
|
||||
spacing: 5
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:radio_button_switch
|
||||
@ -127,18 +149,28 @@ Item {
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
FluDivider{
|
||||
Layout.fillWidth: true ; height:1
|
||||
}
|
||||
RowLayout{
|
||||
Layout.topMargin: 20
|
||||
|
||||
|
||||
FluArea{
|
||||
width: parent.width
|
||||
height: 68
|
||||
paddings: 10
|
||||
|
||||
FluCheckBox{
|
||||
disabled:icon_button_check.checked
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
}
|
||||
Item{
|
||||
height: 1
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
|
||||
Row{
|
||||
spacing: 5
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
right: parent.right
|
||||
}
|
||||
FluToggleSwitch{
|
||||
id:icon_button_check
|
||||
@ -148,9 +180,5 @@ Item {
|
||||
text:"Disabled"
|
||||
}
|
||||
}
|
||||
FluDivider{
|
||||
Layout.fillWidth: true ; height:1
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,13 +5,8 @@ import QtQuick.Controls 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
|
||||
FluText{
|
||||
id:title
|
||||
text:"Dialog"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
FluScrollablePage{
|
||||
title:"Dialog"
|
||||
|
||||
FluContentDialog{
|
||||
id:dialog
|
||||
@ -27,18 +22,6 @@ Item {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
FluButton{
|
||||
Layout.topMargin: 20
|
||||
text:"Show Dialog"
|
||||
@ -47,5 +30,3 @@ Item {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,28 +5,12 @@ import QtQuick.Window 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluText{
|
||||
id:title
|
||||
text:"Expander"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
Column{
|
||||
spacing: 5
|
||||
Item{
|
||||
width: 1
|
||||
height: 20
|
||||
}
|
||||
FluScrollablePage{
|
||||
title:"Expander"
|
||||
|
||||
FluExpander{
|
||||
headerText:"打开一个单选框"
|
||||
Layout.topMargin: 20
|
||||
Item{
|
||||
anchors.fill: parent
|
||||
ColumnLayout{
|
||||
@ -74,5 +58,3 @@ Item {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,22 +5,8 @@ import QtQuick.Controls 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluText{
|
||||
id:title
|
||||
text:"InfoBar"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
FluScrollablePage{
|
||||
title:"InfoBar"
|
||||
|
||||
FluButton{
|
||||
text:"Info"
|
||||
@ -51,5 +37,3 @@ Item {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,22 +5,9 @@ import QtQuick.Controls 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluText{
|
||||
id:title
|
||||
text:"Progress"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
FluScrollablePage{
|
||||
title:"Progress"
|
||||
|
||||
FluProgressBar{
|
||||
Layout.topMargin: 20
|
||||
}
|
||||
@ -47,5 +34,3 @@ Item {
|
||||
Layout.bottomMargin: 30
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,24 +5,9 @@ import QtQuick.Window 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluText{
|
||||
id:title
|
||||
text:"Rectangle"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
FluScrollablePage{
|
||||
title:"Rectangle"
|
||||
|
||||
RowLayout{
|
||||
Layout.topMargin: 20
|
||||
FluRectangle{
|
||||
@ -127,5 +112,3 @@ Item {
|
||||
Layout.topMargin: 10
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,22 +5,10 @@ import QtQuick.Controls 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluText{
|
||||
id:title
|
||||
text:"Slider"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Slider"
|
||||
|
||||
FluSlider{
|
||||
Layout.topMargin: 20
|
||||
Layout.leftMargin: 15
|
||||
@ -33,5 +21,3 @@ Item {
|
||||
value: 50
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,22 +5,10 @@ import QtQuick.Window 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluText{
|
||||
id:title
|
||||
text:"TextBox"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
FluScrollablePage{
|
||||
|
||||
title:"TextBox"
|
||||
|
||||
FluTextBox{
|
||||
Layout.topMargin: 20
|
||||
placeholderText: "单行输入框"
|
||||
@ -37,8 +25,6 @@ Item {
|
||||
placeholderText: "AutoSuggestBox"
|
||||
Layout.preferredWidth: 300
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function generateRandomNames(numNames) {
|
||||
const alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
|
||||
|
||||
@ -5,22 +5,10 @@ import QtQuick.Controls 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluText{
|
||||
id:title
|
||||
text:"Theme"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
FluScrollablePage{
|
||||
|
||||
title:"Theme"
|
||||
|
||||
RowLayout{
|
||||
Layout.topMargin: 20
|
||||
Repeater{
|
||||
@ -71,5 +59,3 @@ Item {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,26 +5,11 @@ import QtQuick.Controls 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluText{
|
||||
id:title
|
||||
text:"ToggleSwitch"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
spacing: 5
|
||||
FluScrollablePage{
|
||||
|
||||
title:"ToggleSwitch"
|
||||
|
||||
FluToggleSwitch{
|
||||
Layout.topMargin: 20
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -2,15 +2,11 @@
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtGraphicalEffects 1.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluText{
|
||||
id:title
|
||||
text:"TreeView"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
FluContentPage {
|
||||
|
||||
title:"TreeView"
|
||||
|
||||
function randomName() {
|
||||
var names = ["张三", "李四", "王五", "赵六", "钱七", "孙八", "周九", "吴十"]
|
||||
@ -56,7 +52,7 @@ Item {
|
||||
id:tree_view
|
||||
width:240
|
||||
anchors{
|
||||
top:title.bottom
|
||||
top:parent.top
|
||||
left:parent.left
|
||||
bottom:parent.bottom
|
||||
}
|
||||
|
||||
@ -3,24 +3,15 @@ import QtQuick.Layouts 1.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
FluContentPage {
|
||||
|
||||
title: "Typography"
|
||||
property int textSize: 13
|
||||
|
||||
FluText{
|
||||
id:title
|
||||
text:"Typography"
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
spacing: 0
|
||||
FluText{
|
||||
|
||||
@ -3,7 +3,6 @@
|
||||
<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>
|
||||
@ -30,5 +29,6 @@
|
||||
<file>T_Dialog.qml</file>
|
||||
<file>T_TreeView.qml</file>
|
||||
<file>T_Expander.qml</file>
|
||||
<file>MainPage.qml</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
||||
@ -33,6 +33,15 @@ void Fluent::registerTypes(const char *uri){
|
||||
qmlRegisterType<WindowHelper>(uri,major,minor,"WindowHelper");
|
||||
qmlRegisterType<FluColorSet>(uri,major,minor,"FluColorSet");
|
||||
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluArea.qml"),uri,major,minor,"FluArea");
|
||||
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluContentPage.qml"),uri,major,minor,"FluContentPage");
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluScrollablePage.qml"),uri,major,minor,"FluScrollablePage");
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluPaneItemHeader.qml"),uri,major,minor,"FluPaneItemHeader");
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluPaneItem.qml"),uri,major,minor,"FluPaneItem");
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluPaneItemSeparator.qml"),uri,major,minor,"FluPaneItemSeparator");
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluNavigationView.qml"),uri,major,minor,"FluNavigationView");
|
||||
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluAutoSuggestBox.qml"),uri,major,minor,"FluAutoSuggestBox");
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluExpander.qml"),uri,major,minor,"FluExpander");
|
||||
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluTreeView.qml"),uri,major,minor,"FluTreeView");
|
||||
|
||||
@ -14,7 +14,8 @@ Rectangle{
|
||||
return Window.window.active ? borerlessColor : Qt.lighter(borerlessColor,1.1)
|
||||
}
|
||||
visible: FluTheme.isFrameless
|
||||
height: visible ? 50 : 0
|
||||
height: visible ? 34 : 0
|
||||
|
||||
width: {
|
||||
if(parent==null)
|
||||
return 200
|
||||
@ -60,7 +61,7 @@ Rectangle{
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left: parent.left
|
||||
leftMargin: 14
|
||||
leftMargin: 10
|
||||
}
|
||||
color:root.textColor
|
||||
fontStyle: FluText.Title
|
||||
@ -69,14 +70,13 @@ Rectangle{
|
||||
}
|
||||
|
||||
RowLayout{
|
||||
anchors.right: parent.right;
|
||||
anchors.rightMargin: 10
|
||||
height: parent.height
|
||||
spacing: 5
|
||||
anchors.right: parent.right
|
||||
height: 30
|
||||
spacing: 0
|
||||
|
||||
TFpsMonitor{
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.rightMargin: 12
|
||||
Layout.rightMargin: 20
|
||||
Layout.topMargin: 5
|
||||
color:root.textColor
|
||||
visible: showFps
|
||||
@ -84,8 +84,9 @@ Rectangle{
|
||||
|
||||
RowLayout{
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
spacing: 5
|
||||
Layout.rightMargin: 14
|
||||
visible: showDark
|
||||
spacing: 5
|
||||
FluText{
|
||||
text:"夜间模式"
|
||||
color:root.textColor
|
||||
|
||||
28
src/controls/FluArea.qml
Normal file
28
src/controls/FluArea.qml
Normal file
@ -0,0 +1,28 @@
|
||||
import QtQuick 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Rectangle {
|
||||
radius: 4
|
||||
color: FluTheme.isDark ? Qt.rgba(39/255,39/255,39/255,1) : Qt.rgba(251/255,251/255,253/255,1)
|
||||
border.color: FluTheme.isDark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,229/255,234/255,1)
|
||||
border.width: 1
|
||||
implicitHeight: height
|
||||
implicitWidth: width
|
||||
|
||||
default property alias content: container.data
|
||||
property int paddings : 0
|
||||
property int leftPadding : 0
|
||||
property int rightPadding : 0
|
||||
property int topPadding : 0
|
||||
property int bottomPadding : 0
|
||||
|
||||
Item {
|
||||
id: container
|
||||
anchors.fill: parent
|
||||
anchors.leftMargin: Math.max(paddings,leftPadding)
|
||||
anchors.rightMargin: Math.max(paddings,rightPadding)
|
||||
anchors.topMargin: Math.max(paddings,topPadding)
|
||||
anchors.bottomMargin: Math.max(paddings,bottomPadding)
|
||||
}
|
||||
|
||||
}
|
||||
29
src/controls/FluContentPage.qml
Normal file
29
src/controls/FluContentPage.qml
Normal file
@ -0,0 +1,29 @@
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
|
||||
id:root
|
||||
|
||||
property alias title: text_title.text
|
||||
default property alias content: container.data
|
||||
|
||||
FluText{
|
||||
id:text_title
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
|
||||
Item{
|
||||
clip: true
|
||||
id:container
|
||||
anchors{
|
||||
top: text_title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
width: parent.width
|
||||
}
|
||||
|
||||
}
|
||||
@ -10,6 +10,8 @@ Item {
|
||||
id:root
|
||||
height: layout_header.height + container.height
|
||||
width: 400
|
||||
implicitWidth: width
|
||||
implicitHeight: height
|
||||
|
||||
property int contentHeight : 300
|
||||
|
||||
|
||||
@ -14,9 +14,9 @@ Rectangle {
|
||||
property bool disabled: false
|
||||
property bool hovered: button_mouse.containsMouse
|
||||
|
||||
property color hoverColor: FluTheme.isDark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(244/255,244/255,244/255,1)
|
||||
property color normalColor: FluTheme.isDark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(1,1,1,1)
|
||||
property color disableColor: FluTheme.isDark ? Qt.rgba(59/255,59/255,59/255,1) : Qt.rgba(1,1,1,1)
|
||||
property color hoverColor: FluTheme.isDark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(0,0,0,0.03)
|
||||
property color normalColor: FluTheme.isDark ? Qt.rgba(0,0,0,0) : Qt.rgba(0,0,0,0)
|
||||
property color disableColor: FluTheme.isDark ? Qt.rgba(59/255,59/255,59/255,1) : Qt.rgba(0,0,0,0)
|
||||
|
||||
property color textColor: {
|
||||
if(FluTheme.isDark){
|
||||
|
||||
341
src/controls/FluNavigationView.qml
Normal file
341
src/controls/FluNavigationView.qml
Normal file
@ -0,0 +1,341 @@
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
|
||||
id:root
|
||||
|
||||
property FluObject items
|
||||
property FluObject footerItems
|
||||
|
||||
property int displayMode: width<=700 ? FluNavigationView.Minimal : FluNavigationView.Open
|
||||
|
||||
property bool displaMinimalNav : false
|
||||
|
||||
onDisplayModeChanged: {
|
||||
if(displayMode === FluNavigationView.Minimal){
|
||||
anim_navi.enabled = false
|
||||
displaMinimalNav = false
|
||||
timer_anim_enable.restart()
|
||||
}
|
||||
}
|
||||
|
||||
Timer{
|
||||
id:timer_anim_enable
|
||||
interval: 150
|
||||
onTriggered: {
|
||||
anim_navi.enabled = true
|
||||
}
|
||||
}
|
||||
|
||||
enum DisplayMode {
|
||||
Minimal,
|
||||
Open,
|
||||
Auto
|
||||
}
|
||||
|
||||
property var window : {
|
||||
if(Window.window == null)
|
||||
return null
|
||||
return Window.window
|
||||
}
|
||||
|
||||
Component{
|
||||
id:com_panel_item_separatorr
|
||||
FluDivider{
|
||||
width: nav_list.width
|
||||
height: 1
|
||||
}
|
||||
}
|
||||
|
||||
Component{
|
||||
id:com_panel_item_header
|
||||
Item{
|
||||
height: 30
|
||||
width: nav_list.width
|
||||
FluText{
|
||||
text:model.title
|
||||
fontStyle: FluText.BodyStrong
|
||||
anchors{
|
||||
bottom: parent.bottom
|
||||
left:parent.left
|
||||
leftMargin: 10
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component{
|
||||
id:com_panel_item
|
||||
Item{
|
||||
height: 38
|
||||
width: nav_list.width
|
||||
|
||||
Rectangle{
|
||||
radius: 4
|
||||
anchors{
|
||||
top: parent.top
|
||||
bottom: parent.bottom
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
topMargin: 2
|
||||
bottomMargin: 2
|
||||
leftMargin: 6
|
||||
rightMargin: 6
|
||||
}
|
||||
MouseArea{
|
||||
id:item_mouse
|
||||
hoverEnabled: true
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
if(type===0){
|
||||
model.repTap()
|
||||
if(nav_list.currentIndex !== position){
|
||||
nav_list.currentIndex = position
|
||||
model.tap()
|
||||
}
|
||||
}else{
|
||||
model.tap()
|
||||
}
|
||||
}
|
||||
}
|
||||
color: {
|
||||
if(FluTheme.isDark){
|
||||
if((nav_list.currentIndex === position)&&type===0){
|
||||
return "#2D2D2D"
|
||||
}
|
||||
if(item_mouse.containsMouse){
|
||||
return "#292929"
|
||||
}
|
||||
return Qt.rgba(0,0,0,0)
|
||||
}else{
|
||||
if(item_mouse.containsMouse){
|
||||
return Qt.rgba(0,0,0,0.03)
|
||||
}
|
||||
if(nav_list.currentIndex === position&&type===0){
|
||||
return Qt.rgba(0,0,0,0.06)
|
||||
}
|
||||
return Qt.rgba(0,0,0,0)
|
||||
}
|
||||
}
|
||||
|
||||
FluText{
|
||||
text:model.title
|
||||
anchors{
|
||||
verticalCenter: parent.verticalCenter
|
||||
left:parent.left
|
||||
leftMargin: 14
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Item {
|
||||
id:nav_app_bar
|
||||
width: parent.width
|
||||
height: 38
|
||||
|
||||
RowLayout{
|
||||
height:parent.height
|
||||
spacing: 0
|
||||
FluIconButton{
|
||||
icon: FluentIcons.FA_arrow_left
|
||||
Layout.leftMargin: 5
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
disabled: nav_swipe.depth === 1
|
||||
onClicked: {
|
||||
nav_swipe.pop()
|
||||
nav_list.stackIndex.pop()
|
||||
var index = nav_list.stackIndex[nav_list.stackIndex.length-1]
|
||||
nav_list.enableStack = false
|
||||
nav_list.currentIndex = index
|
||||
nav_list.enableStack = true
|
||||
}
|
||||
}
|
||||
FluIconButton{
|
||||
icon: FluentIcons.FA_navicon
|
||||
Layout.leftMargin: 5
|
||||
visible: displayMode === FluNavigationView.Minimal
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
onClicked: {
|
||||
displaMinimalNav = !displaMinimalNav
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
RowLayout{
|
||||
anchors{
|
||||
right: parent.right
|
||||
rightMargin: 14
|
||||
verticalCenter: parent.verticalCenter
|
||||
}
|
||||
spacing: 5
|
||||
FluText{
|
||||
text:"夜间模式"
|
||||
fontStyle: FluText.Body
|
||||
}
|
||||
FluToggleSwitch{
|
||||
checked: FluTheme.isDark
|
||||
onClickFunc:function(){
|
||||
FluTheme.isDark = !FluTheme.isDark
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Item{
|
||||
anchors{
|
||||
left: displayMode === FluNavigationView.Minimal ? parent.left : layout_list.right
|
||||
leftMargin: 2
|
||||
top: nav_app_bar.bottom
|
||||
right: parent.right
|
||||
rightMargin: 10
|
||||
bottom: parent.bottom
|
||||
bottomMargin: 20
|
||||
}
|
||||
|
||||
StackView{
|
||||
id:nav_swipe
|
||||
anchors.fill: parent
|
||||
clip: true
|
||||
anchors.margins: 10
|
||||
popEnter : Transition{}
|
||||
popExit : Transition{}
|
||||
pushEnter : Transition{}
|
||||
pushExit : Transition{}
|
||||
replaceEnter : Transition{}
|
||||
replaceExit : Transition{}
|
||||
}
|
||||
}
|
||||
|
||||
MouseArea{
|
||||
anchors.fill: parent
|
||||
enabled: (displayMode === FluNavigationView.Minimal && displaMinimalNav)
|
||||
onClicked: {
|
||||
displaMinimalNav = false
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle{
|
||||
id:layout_list
|
||||
width: 300
|
||||
anchors{
|
||||
top: nav_app_bar.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
x: {
|
||||
if(displayMode !== FluNavigationView.Minimal)
|
||||
return 0
|
||||
return (displayMode === FluNavigationView.Minimal && displaMinimalNav) ? 0 : -width
|
||||
}
|
||||
Behavior on x{
|
||||
id:anim_navi
|
||||
NumberAnimation{
|
||||
duration: 150
|
||||
}
|
||||
}
|
||||
color: {
|
||||
if(displayMode === FluNavigationView.Minimal){
|
||||
return FluTheme.isDark ? Qt.rgba(61/255,61/255,61/255,1) : Qt.rgba(243/255,243/255,243/255,1)
|
||||
}
|
||||
if(window && window.active){
|
||||
return FluTheme.isDark ? Qt.rgba(32/255,32/255,32/255,1) : Qt.rgba(238/255,244/255,249/255,1)
|
||||
}
|
||||
return FluTheme.isDark ? Qt.rgba(32/255,32/255,32/255,1) : Qt.rgba(243/255,243/255,243/255,1)
|
||||
}
|
||||
Behavior on color{
|
||||
ColorAnimation {
|
||||
duration: 300
|
||||
}
|
||||
}
|
||||
ListView{
|
||||
id:nav_list
|
||||
property bool enableStack: true
|
||||
property var stackIndex: []
|
||||
clip: true
|
||||
anchors{
|
||||
top: parent.top
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
bottom: layout_footer.top
|
||||
}
|
||||
currentIndex: -1
|
||||
onCurrentIndexChanged: {
|
||||
if(enableStack){
|
||||
stackIndex.push(currentIndex)
|
||||
}
|
||||
}
|
||||
model:{
|
||||
if(items){
|
||||
return items.children
|
||||
}
|
||||
}
|
||||
boundsBehavior: ListView.StopAtBounds
|
||||
delegate: Loader{
|
||||
property var model: modelData
|
||||
property var position: index
|
||||
property int type: 0
|
||||
sourceComponent: {
|
||||
if(modelData instanceof FluPaneItem){
|
||||
return com_panel_item
|
||||
}
|
||||
if(modelData instanceof FluPaneItemHeader){
|
||||
return com_panel_item_header
|
||||
}
|
||||
if(modelData instanceof FluPaneItemSeparator){
|
||||
return com_panel_item_separatorr
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ListView{
|
||||
id:layout_footer
|
||||
width: layout_list.width
|
||||
height: childrenRect.height
|
||||
anchors.bottom: parent.bottom
|
||||
boundsBehavior: ListView.StopAtBounds
|
||||
model: {
|
||||
if(footerItems){
|
||||
return footerItems.children
|
||||
}
|
||||
}
|
||||
currentIndex: -1
|
||||
delegate: Loader{
|
||||
property var model: modelData
|
||||
property var position: index
|
||||
property int type: 1
|
||||
sourceComponent: {
|
||||
if(modelData instanceof FluPaneItem){
|
||||
return com_panel_item
|
||||
}
|
||||
if(modelData instanceof FluPaneItemHeader){
|
||||
return com_panel_item_header
|
||||
}
|
||||
if(modelData instanceof FluPaneItemSeparator){
|
||||
return com_panel_item_separatorr
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
function push(url){
|
||||
nav_swipe.push(url)
|
||||
}
|
||||
|
||||
function setCurrentIndex(index){
|
||||
nav_list.currentIndex = index
|
||||
}
|
||||
|
||||
}
|
||||
7
src/controls/FluPaneItem.qml
Normal file
7
src/controls/FluPaneItem.qml
Normal file
@ -0,0 +1,7 @@
|
||||
import QtQuick 2.15
|
||||
|
||||
QtObject {
|
||||
property string title
|
||||
signal tap
|
||||
signal repTap
|
||||
}
|
||||
5
src/controls/FluPaneItemHeader.qml
Normal file
5
src/controls/FluPaneItemHeader.qml
Normal file
@ -0,0 +1,5 @@
|
||||
import QtQuick 2.15
|
||||
|
||||
QtObject {
|
||||
property string title
|
||||
}
|
||||
5
src/controls/FluPaneItemSeparator.qml
Normal file
5
src/controls/FluPaneItemSeparator.qml
Normal file
@ -0,0 +1,5 @@
|
||||
import QtQuick 2.15
|
||||
|
||||
QtObject {
|
||||
|
||||
}
|
||||
34
src/controls/FluScrollablePage.qml
Normal file
34
src/controls/FluScrollablePage.qml
Normal file
@ -0,0 +1,34 @@
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
|
||||
Item {
|
||||
|
||||
id:root
|
||||
|
||||
property alias title: text_title.text
|
||||
default property alias content: container.data
|
||||
property int spacing : 5
|
||||
|
||||
FluText{
|
||||
id:text_title
|
||||
fontStyle: FluText.TitleLarge
|
||||
}
|
||||
|
||||
ScrollView{
|
||||
clip: true
|
||||
width: parent.width
|
||||
contentWidth: parent.width
|
||||
anchors{
|
||||
top: text_title.bottom
|
||||
bottom: parent.bottom
|
||||
}
|
||||
ColumnLayout{
|
||||
id:container
|
||||
spacing: root.spacing
|
||||
width: parent.width
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -5,9 +5,8 @@ import QtQuick.Controls 2.15
|
||||
import FluentUI 1.0
|
||||
import QtGraphicalEffects 1.15
|
||||
|
||||
Rectangle {
|
||||
Item {
|
||||
id:root
|
||||
color: FluTheme.isDark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(253/255,253/255,253/255,1)
|
||||
|
||||
enum TreeViewSelectionMode {
|
||||
None,
|
||||
@ -101,12 +100,12 @@ Rectangle {
|
||||
if(item_layout.singleSelected && selectionMode === FluTreeView.Single){
|
||||
return Qt.rgba(62/255,62/255,62/255,1)
|
||||
}
|
||||
return (item_layout_mouse.containsMouse || item_layout_expanded.hovered || item_layout_checkbox.hovered)?Qt.rgba(62/255,62/255,62/255,1):Qt.rgba(50/255,50/255,50/255,1)
|
||||
return (item_layout_mouse.containsMouse || item_layout_expanded.hovered || item_layout_checkbox.hovered)?Qt.rgba(62/255,62/255,62/255,1):Qt.rgba(0,0,0,0)
|
||||
}else{
|
||||
if(item_layout.singleSelected && selectionMode === FluTreeView.Single){
|
||||
return Qt.rgba(244/255,244/255,244/255,1)
|
||||
return Qt.rgba(0,0,0,0.06)
|
||||
}
|
||||
return (item_layout_mouse.containsMouse || item_layout_expanded.hovered || item_layout_checkbox.hovered)?Qt.rgba(244/255,244/255,244/255,1):Qt.rgba(253/255,253/255,253/255,1)
|
||||
return (item_layout_mouse.containsMouse || item_layout_expanded.hovered || item_layout_checkbox.hovered)?Qt.rgba(0,0,0,0.03):Qt.rgba(0,0,0,0)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -60,6 +60,7 @@ Item {
|
||||
color:root.color
|
||||
anchors.fill: parent
|
||||
anchors.margins: borderless
|
||||
clip: true
|
||||
Behavior on color{
|
||||
ColorAnimation {
|
||||
duration: 300
|
||||
|
||||
@ -36,5 +36,12 @@
|
||||
<file>controls/FluTreeView.qml</file>
|
||||
<file>controls/FluExpander.qml</file>
|
||||
<file>controls/FluAutoSuggestBox.qml</file>
|
||||
<file>controls/FluNavigationView.qml</file>
|
||||
<file>controls/FluPaneItem.qml</file>
|
||||
<file>controls/FluPaneItemHeader.qml</file>
|
||||
<file>controls/FluPaneItemSeparator.qml</file>
|
||||
<file>controls/FluScrollablePage.qml</file>
|
||||
<file>controls/FluContentPage.qml</file>
|
||||
<file>controls/FluArea.qml</file>
|
||||
</qresource>
|
||||
</RCC>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user