69 lines
2.2 KiB
QML
69 lines
2.2 KiB
QML
import QtQuick 2.14
|
|
import QtQuick.Controls 2.14
|
|
import "qrc:/QmlFiles/qml/components"
|
|
|
|
Button {
|
|
id: toolBarButtonWithText
|
|
property string iconSource: ""
|
|
property string buttonText: "" // 新增属性,用于设置文字
|
|
property color hoverColor: Colors.sColor_GoldWithBlack
|
|
property int buttonWidth: 40 // 默认宽度
|
|
property int buttonHeight: 40 // 默认高度
|
|
|
|
width: buttonWidth
|
|
height: buttonHeight
|
|
implicitWidth: buttonWidth
|
|
implicitHeight: buttonHeight
|
|
|
|
background: Rectangle {
|
|
width: parent.width
|
|
height: parent.height
|
|
color: "transparent"
|
|
border.color: "red"
|
|
border.width: 0
|
|
radius: 0
|
|
|
|
MouseArea {
|
|
id: mouseArea
|
|
anchors.fill: parent
|
|
hoverEnabled: true
|
|
|
|
onEntered: {
|
|
parent.color = toolBarButtonWithText.hoverColor
|
|
}
|
|
|
|
onExited: {
|
|
parent.color = "transparent"
|
|
}
|
|
onClicked: toolBarButtonWithText.clicked()
|
|
}
|
|
}
|
|
|
|
contentItem: Row { // 使用 Row 布局容器
|
|
id: contentRow
|
|
anchors.fill: parent
|
|
anchors.left: parent.left // 靠左对齐
|
|
anchors.verticalCenter: parent.verticalCenter // 垂直居中
|
|
spacing: 18 // 图片和文字之间的间距
|
|
|
|
Image {
|
|
id: image
|
|
source: toolBarButtonWithText.iconSource
|
|
width: toolBarButtonWithText.buttonHeight // 使用 buttonHeight 作为宽度,保持图标为正方形
|
|
height: toolBarButtonWithText.buttonHeight
|
|
fillMode: Image.PreserveAspectFit
|
|
}
|
|
|
|
Text {
|
|
id: textLabel
|
|
text: toolBarButtonWithText.buttonText // 使用新增的 buttonText 属性
|
|
font.pixelSize: 32 // 设置字体大小
|
|
font.family: "Microsoft YaHei" // 设置字体为微软雅黑
|
|
font.bold: true // 设置加粗
|
|
verticalAlignment: Text.AlignVCenter
|
|
height: toolBarButtonWithText.buttonHeight // 高度固定为 40 像素
|
|
color: "white" // 设置文字颜色为白色
|
|
font.letterSpacing: 5 // 设置文字间距为 10 像素
|
|
}
|
|
}
|
|
} |