main
zhuzihcu 2023-04-04 16:39:41 +08:00
parent 206669e5f0
commit 47ab4dabbd
4 changed files with 182 additions and 21 deletions

View File

@ -93,7 +93,7 @@ Rectangle{
iconSize: 11 iconSize: 11
text:minimizeText text:minimizeText
radius: 0 radius: 0
textColor: root.textColor iconColor: root.textColor
color: hovered ? minimizeHoverColor : minimizeNormalColor color: hovered ? minimizeHoverColor : minimizeNormalColor
onClicked: { onClicked: {
d.win.showMinimized() d.win.showMinimized()
@ -107,7 +107,7 @@ Rectangle{
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
visible: d.resizable visible: d.resizable
radius: 0 radius: 0
textColor: root.textColor iconColor: root.textColor
text:d.isRestore?restoreText:maximizeText text:d.isRestore?restoreText:maximizeText
iconSize: 11 iconSize: 11
onClicked: { onClicked: {
@ -122,7 +122,7 @@ Rectangle{
height: 30 height: 30
radius: 0 radius: 0
iconSize: 10 iconSize: 10
textColor: hovered ? Qt.rgba(1,1,1,1) : root.textColor iconColor: hovered ? Qt.rgba(1,1,1,1) : root.textColor
color:hovered ? closeHoverColor : closeNormalColor color:hovered ? closeHoverColor : closeNormalColor
onClicked: { onClicked: {
d.win.close() d.win.close()

View File

@ -17,7 +17,7 @@ Button {
} }
return hovered ? hoverColor : normalColor return hovered ? hoverColor : normalColor
} }
property color textColor: { property color iconColor: {
if(FluTheme.dark){ if(FluTheme.dark){
if(disabled){ if(disabled){
return Qt.rgba(130/255,130/255,130/255,1) return Qt.rgba(130/255,130/255,130/255,1)
@ -57,7 +57,7 @@ Button {
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
anchors.centerIn: parent anchors.centerIn: parent
color:control.textColor color:control.iconColor
text: (String.fromCharCode(iconSource).toString(16)); text: (String.fromCharCode(iconSource).toString(16));
} }
FluTooltip{ FluTooltip{

View File

@ -10,20 +10,20 @@ Item {
property color normalColor: FluTheme.dark ? FluColors.Grey120 : FluColors.Grey120 property color normalColor: FluTheme.dark ? FluColors.Grey120 : FluColors.Grey120
property color hoverColor: FluTheme.dark ? FluColors.Grey10 : FluColors.Black property color hoverColor: FluTheme.dark ? FluColors.Grey10 : FluColors.Black
width: 400 width: 400
height: 300 height: 300
implicitHeight: height
implicitWidth: width
MouseArea{
anchors.fill: parent
preventStealing: true
}
FluObject{ FluObject{
id:d id:d
} }
Component.onCompleted: {
for(var i =0 ;i <d.children.length;i++){
console.debug(d.children[i].title)
}
}
ListView{ ListView{
id:nav_list id:nav_list
height: 40 height: 40

View File

@ -1,34 +1,133 @@
import QtQuick import QtQuick
import QtQuick.Controls import QtQuick.Controls
import QtQuick.Controls.impl 2.15
import QtQuick.Templates 2.15 as T
import FluentUI import FluentUI
T.ScrollBar { ScrollBar {
id: control id: control
property color handleNormalColor: Qt.rgba(134/255,134/255,134/255,1) property color handleNormalColor: Qt.rgba(134/255,134/255,134/255,1)
property color handleHoverColor: Qt.lighter(handleNormalColor) property color handleHoverColor: Qt.lighter(handleNormalColor)
property color handlePressColor: Qt.darker(handleNormalColor) property color handlePressColor: Qt.darker(handleNormalColor)
property bool expand: false
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding) implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding) implicitContentHeight + topPadding + bottomPadding)
padding: 4 visible: control.policy !== ScrollBar.AlwaysOff
visible: control.policy !== T.ScrollBar.AlwaysOff
minimumSize: 0.3 minimumSize: 0.3
topPadding:{
if(vertical){
if(expand)
return 15
return 2
}else{
if(expand){
return 2
}
return 4
}
}
bottomPadding:{
if(vertical){
if(expand)
return 15
return 2
}else{
if(expand){
return 2
}
return 4
}
}
leftPadding:{
if(vertical){
if(expand){
return 2
}
return 4
}else{
if(expand)
return 15
return 2
}
}
rightPadding:{
if(vertical){
if(expand){
return 2
}
return 4
}else{
if(expand)
return 15
return 2
}
}
Behavior on topPadding {
NumberAnimation{
duration: 150
}
}
Behavior on bottomPadding {
NumberAnimation{
duration: 150
}
}
Behavior on leftPadding {
NumberAnimation{
duration: 150
}
}
Behavior on rightPadding {
NumberAnimation{
duration: 150
}
}
contentItem: Rectangle { contentItem: Rectangle {
implicitWidth: hovered || pressed ? 6 : 2 id:item_react
implicitHeight: hovered || pressed ? 6 : 2 implicitWidth: expand ? 8 : 2
implicitHeight: expand ? 8 : 2
radius: width / 2 radius: width / 2
layer.samples: 4 layer.samples: 4
layer.enabled: true layer.enabled: true
layer.smooth: true layer.smooth: true
color: control.pressed?handlePressColor:control.hovered?handleHoverColor:handleNormalColor color: control.pressed?handlePressColor:control.hovered?handleHoverColor:handleNormalColor
opacity:(control.policy === T.ScrollBar.AlwaysOn || control.size < 1.0)?1.0:0.0 opacity:(control.policy === ScrollBar.AlwaysOn || control.size < 1.0)?1.0:0.0
}
background: Rectangle{
radius: 5
color: {
if(expand && item_react.opacity){
if(FluTheme.dark){
return Qt.rgba(0,0,0,1)
}
return Qt.rgba(1,1,1,1)
}
return Qt.rgba(0,0,0,0)
}
MouseArea{
id:mouse_item
hoverEnabled: true
anchors.fill: parent
onEntered: {
timer.restart()
console.debug("onEntered")
}
onExited: {
timer.restart()
console.debug("onExited")
}
}
}
Timer{
id:timer
interval: 800
onTriggered: {
expand = mouse_item.containsMouse || btn_top.hovered || btn_bottom.hovered || btn_left.hovered || btn_right.hovered
}
} }
Behavior on implicitWidth { Behavior on implicitWidth {
NumberAnimation{ NumberAnimation{
@ -36,4 +135,66 @@ T.ScrollBar {
} }
} }
FluIconButton{
id:btn_top
iconSource: FluentIcons.CaretSolidUp
anchors.horizontalCenter: parent.horizontalCenter
width:10
height:10
z:100
iconColor: hovered ? FluColors.Black : FluColors.Grey120
iconSize: 8
anchors.top: parent.top
anchors.topMargin: 4
visible:vertical && expand
onClicked:{
decrease()
}
}
FluIconButton{
id:btn_bottom
iconSource: FluentIcons.CaretSolidDown
visible:vertical && expand
width:10
height:10
iconSize: 8
iconColor: hovered ? FluColors.Black : FluColors.Grey120
anchors.horizontalCenter: parent.horizontalCenter
anchors.bottom: parent.bottom
anchors.bottomMargin: 4
onClicked:{
increase()
}
}
FluIconButton{
id:btn_left
iconSource: FluentIcons.CaretSolidLeft
visible:!vertical && expand
width:10
height:10
iconSize: 8
iconColor: hovered ? FluColors.Black : FluColors.Grey120
anchors.leftMargin: 4
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
onClicked:{
decrease()
}
}
FluIconButton{
id:btn_right
iconSource: FluentIcons.CaretSolidRight
visible:!vertical && expand
width:10
height:10
iconSize: 8
iconColor: hovered ? FluColors.Black : FluColors.Grey120
anchors.rightMargin: 4
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
onClicked:{
increase()
}
}
} }