天天看点

Qt-QML-Button-ButtonStyle-实现鼠标滑过点击效果

这里盗版贴上Qt帮助文档中的部分关于Button的属性内容

Qt-QML-Button-ButtonStyle-实现鼠标滑过点击效果

Button有自己的style 的属性,可以实现自己的想法,经过摸索,我暂时做出了鼠标滑入,点击,和正常的效果

简单的效果如下图

Qt-QML-Button-ButtonStyle-实现鼠标滑过点击效果

默认为红色,鼠标划入为绿色,鼠标点击为黄色

下面是实现代码

import QtQuick 2.0

import QtQuick.Controls 1.4

import QtQuick.Controls.Styles 1.4

Button

{

   id: root_Button

   property string nomerPic: "qrc:/Images/001.png"

   property string hoverPic: "qrc:/Images/002.png"

   property string pressPic: "qrc:/Images/003.png"

   style: ButtonStyle

   {

       background:Rectangle

       {

           implicitHeight:root_Button.height

           implicitWidth:root_Button.width

           Image

           {

               anchors.fill: parent

               source:

               {

                   if(control.hovered)

                   {

                       if(control.pressed)

                       {

                           pressPic

                       }

                       else

                           hoverPic

                   }

                   else

                       nomerPic

               }

           }

       }

   }

}

有什么不懂得 ,可以问我哦。