QT QML 界面设计教程4——选项卡的按键样式

最新推荐文章于 2024-07-25 18:09:35 发布

notfindjob

最新推荐文章于 2024-07-25 18:09:35 发布

阅读量86

点赞数 3

文章标签： qt java 前端

本文链接：https://blog.csdn.net/notfindjob/article/details/139800076

版权

MyTabButton.qml

import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Controls.impl 2.14
import QtQuick.Templates 2.14 as Template1

Template1.TabButton {
    id: control

    property color textColor: (control.checked||control.hovered) ? "blue" : "white"
    property color buttonColor: control.checked ? "lightgreen": "#36c588"

    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
                            implicitContentWidth + leftPadding + rightPadding)
    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
                             implicitContentHeight + topPadding + bottomPadding)

    padding: 0
    leftPadding: 12
    rightPadding: 12
    spacing: 6
    font{
        family: "SimSun"
        pixelSize: 20
    }

    //自定义的QmlIconLabel
    contentItem: MyIconLabel {
        text: control.text
        font: control.font
        color: control.textColor
        spacing: control.spacing
        source: control.icon.source
    }

    background: Rectangle {
        implicitHeight: 40
        height: control.height - 1
        color: control.buttonColor
    }
}

调用：

 MyTabButton{
                x: 0
                y: 0
                width: 120

                text:qsTr("选项名称")
                font.preferShaping: false
                wheelEnabled: false
                font.kerning: false


                onClicked:
                {
                      
                       toolBarPatient.visible=true;
                       toolBarScanner.visible=false;
                       toolBarImpantView.visible=false;
                       toolBarConsult.visible=false;
                       toolBarReport.visible=false;
                       patientTab.visible=true;
                       scannerTab.visible=false;
                       implantTab.visible=false;
                       consultTab.visible=false;
                       reportTab.visible=false;
                }
            }