This commit is contained in:
zhuzihcu 2023-03-16 14:34:20 +08:00
parent 47597471dd
commit 96355b0a97
8 changed files with 127 additions and 9 deletions

View File

@ -81,7 +81,7 @@
![](doc/preview/carousel.png) ![](doc/preview/carousel.png)
## IntoBar提示框组件 ## InfoBar提示框组件
![](doc/preview/infobar.png) ![](doc/preview/infobar.png)

View File

@ -189,4 +189,40 @@ FluScrollablePage{
} }
} }
} }
FluArea{
width: parent.width
height: 68
paddings: 10
FluDropDownButton{
disabled:drop_down_button_switch.selected
text:"DropDownButton"
anchors{
verticalCenter: parent.verticalCenter
left: parent.left
}
items:[
FluMenuItem{
text:"asdf"
}
]
}
Row{
spacing: 5
anchors{
verticalCenter: parent.verticalCenter
right: parent.right
}
FluToggleSwitch{
id:drop_down_button_switch
Layout.alignment: Qt.AlignRight
}
FluText{
text:"Disabled"
}
}
}
} }

View File

@ -36,7 +36,6 @@ Button {
} }
contentItem: FluText { contentItem: FluText {
text: control.text text: control.text
anchors.centerIn: parent
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
color: { color: {

View File

@ -1,6 +1,79 @@
import QtQuick 2.15 import QtQuick 2.15
import QtQuick.Controls 2.15
import FluentUI 1.0 import FluentUI 1.0
Item { Button {
property bool disabled: false
property color normalColor: FluTheme.isDark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(254/255,254/255,254/255,1)
property color hoverColor: FluTheme.isDark ? Qt.rgba(68/255,68/255,68/255,1) : Qt.rgba(251/255,251/255,251/255,1)
property color disableColor: FluTheme.isDark ? Qt.rgba(59/255,59/255,59/255,1) : Qt.rgba(252/255,252/255,252/255,1)
id: control
topPadding:5
bottomPadding:5
leftPadding:15
rightPadding:35
enabled: !disabled
focusPolicy:Qt.TabFocus
property alias items: menu.content
Keys.onSpacePressed: control.visualFocus&&clicked()
background: Rectangle{
border.color: FluTheme.isDark ? "#505050" : "#DFDFDF"
border.width: 1
radius: 4
FluFocusRectangle{
visible: control.visualFocus
radius:8
}
color:{
if(disabled){
return disableColor
}
return hovered ? hoverColor :normalColor
}
FluIcon{
iconSource:FluentIcons.ChevronDown
iconSize: 15
anchors{
right: parent.right
rightMargin: 10
verticalCenter: parent.verticalCenter
}
color:title.color
}
}
contentItem: FluText {
id:title
text: control.text
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
color: {
if(FluTheme.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)
}
}
}
onClicked: {
menu.open()
}
FluMenu{
id:menu
width: control.width
}
} }

View File

@ -6,9 +6,10 @@ Menu {
id: popup id: popup
default property alias content: container.data default property alias content: container.data
width: 140
height: container.height
background: Rectangle { background: Rectangle {
implicitWidth: 140
implicitHeight: container.height
color:FluTheme.isDark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(237/255,237/255,237/255,1) color:FluTheme.isDark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(237/255,237/255,237/255,1)
radius: 5 radius: 5
@ -19,6 +20,7 @@ Menu {
spacing: 5 spacing: 5
topPadding: 5 topPadding: 5
bottomPadding: 5 bottomPadding: 5
width: popup.width
id:container id:container
function closePopup(){ function closePopup(){
popup.close() popup.close()

View File

@ -4,7 +4,12 @@ import QtQuick.Controls 2.15
Item { Item {
id:root id:root
width: 140 width: {
if(root.parent){
return root.parent.width
}
return 140
}
height: 32 height: 32
property string text: "MenuItem" property string text: "MenuItem"
@ -12,7 +17,7 @@ Item {
Rectangle{ Rectangle{
anchors.centerIn: parent anchors.centerIn: parent
width: 100 width: root.width-40
height: 32 height: 32
radius: 4 radius: 4
color:{ color:{

View File

@ -32,7 +32,7 @@ Button {
if(selected&&disabled){ if(selected&&disabled){
return 3 return 3
} }
if(hovered){ if(pressed){
if(selected){ if(selected){
return 5 return 5
} }
@ -48,7 +48,7 @@ Button {
} }
Behavior on border.width { Behavior on border.width {
NumberAnimation{ NumberAnimation{
duration: 100 duration: 150
} }
} }
border.color: { border.color: {

View File

@ -61,6 +61,9 @@ Button {
Behavior on x { Behavior on x {
NumberAnimation { duration: 200 } NumberAnimation { duration: 200 }
} }
Behavior on scale {
NumberAnimation { duration: 150 }
}
} }
} }