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

update

Browse Source
This commit is contained in:
朱子楚\zhuzi
2024-03-07 13:58:23 +08:00
parent 723c2a864a
commit 2a03f24941
19 changed files with 338 additions and 217 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
example/qml/page/T_Theme.qml
View File

@ -7,32 +7,40 @@ import "../component"
FluScrollablePage{
property var colorData: [FluColors.Yellow,FluColors.Orange,FluColors.Red,FluColors.Magenta,FluColors.Purple,FluColors.Blue,FluColors.Teal,FluColors.Green]
id:root
title:"Theme"
FluArea{
Layout.fillWidth: true
Layout.topMargin: 20
height: 270
Layout.preferredHeight: 340
paddings: 10
ColumnLayout{
spacing:0
anchors{
left: parent.left
}
RowLayout{
FluText{
text:"主题颜色"
Layout.topMargin: 10
}
RowLayout{
Layout.topMargin: 5
Repeater{
model: [FluColors.Yellow,FluColors.Orange,FluColors.Red,FluColors.Magenta,FluColors.Purple,FluColors.Blue,FluColors.Teal,FluColors.Green]
delegate: FluRectangle{
model: root.colorData
delegate: Rectangle{
width: 42
height: 42
radius: [4,4,4,4]
radius: 4
color: mouse_item.containsMouse ? Qt.lighter(modelData.normal,1.1) : modelData.normal
border.color: modelData.darkest
FluIcon {
anchors.centerIn: parent
iconSource: FluentIcons.AcceptMedium
iconSize: 15
visible: modelData === FluTheme.themeColor
visible: modelData === FluTheme.accentColor
color: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
}
MouseArea{
@ -40,12 +48,41 @@ FluScrollablePage{
anchors.fill: parent
hoverEnabled: true
onClicked: {
FluTheme.themeColor = modelData
FluTheme.accentColor = modelData
}
}
}
}
}
Row{
Layout.topMargin: 10
spacing: 10
FluText{
text:"自定义主题颜色"
anchors.verticalCenter: parent.verticalCenter
}
FluColorPicker{
id:color_picker
current: FluTheme.accentColor.normal
onAccepted: {
FluTheme.accentColor = FluColors.createAccentColor(current)
}
FluIcon {
anchors.centerIn: parent
iconSource: FluentIcons.AcceptMedium
iconSize: 15
visible: {
for(var i =0 ;i< root.colorData.length; i++){
if(root.colorData[i] === FluTheme.accentColor){
return false
}
}
return true
}
color: FluTheme.dark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
}
}
}
FluText{
text:"夜间模式"
Layout.topMargin: 20
@ -88,7 +125,7 @@ FluScrollablePage{
CodeExpander{
Layout.fillWidth: true
Layout.topMargin: -1
code:'FluTheme.themeColor = FluColors.Orange
code:'FluTheme.accentColor = FluColors.Orange
FluTheme.dark = true