mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2024-11-26 21:37:04 +08:00
update
This commit is contained in:
parent
47597471dd
commit
96355b0a97
@ -81,7 +81,7 @@
|
|||||||
|
|
||||||
![](doc/preview/carousel.png)
|
![](doc/preview/carousel.png)
|
||||||
|
|
||||||
## IntoBar提示框组件
|
## InfoBar提示框组件
|
||||||
|
|
||||||
![](doc/preview/infobar.png)
|
![](doc/preview/infobar.png)
|
||||||
|
|
||||||
|
@ -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"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -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: {
|
||||||
|
@ -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
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -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()
|
||||||
|
@ -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:{
|
||||||
|
@ -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: {
|
||||||
|
@ -61,6 +61,9 @@ Button {
|
|||||||
Behavior on x {
|
Behavior on x {
|
||||||
NumberAnimation { duration: 200 }
|
NumberAnimation { duration: 200 }
|
||||||
}
|
}
|
||||||
|
Behavior on scale {
|
||||||
|
NumberAnimation { duration: 150 }
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user