zoukankan      html  css  js  c++  java
  • 自定义QT窗口部件外观之QStyle

    自定义QT窗口部件外观

    重新定义Qt内置窗口部件的外观常用的方法有两种:一是通过子类化QStyle 类或者预定义的一个样式,例如QWindowStyle,来定制应用程序的观感;二是使用Qt样式表。

    QStyle 类的使用

    1.      准备必要的背景图片。在你想添加自定义风格的工程目录下新建一个文件夹“images”,将背景图片等放入文件夹“images”。

    2.      点击Qt Creator的“文件”->“新建文件或工程”->模板选择“Qt”,再选择Qt资源文件->点击“选择”按钮->输入名称->点击“下一步”->点击“完成”。

    3.      双击打开Qt Creator的项目管理器中的“**.qrc”资源文件,单击“添加”->“添加前缀”,将前缀名“/new/***”更名为“/”->再次单击“添加”->“添加文件”->将工程目录下“images”文件夹的图片添加进来。保存并关闭资源管理器。

    4.      下面开始创建样式子类。新建C++类,命名为myStyle。

    5.      修改头文件“mystyle.h”。头文件修改好后如下:

    #include<QtGui>

    #include<QPalette>

    #include<QMotifStyle>

    classmyStyle:publicQMotifStyle

    {

       Q_OBJECT

    public:

       myStyle();

    //以下三个函数在装载Style和卸载Style时调用,它可以是适当修改窗口部件和调色板

       voidpolish(QPalette&palette);//改变调色板为样式指定的颜色调色板

       voidpolish(QWidget*widget);//初始化给定窗口部件的外观,窗口部件每一次创建后首次显示之前调用

       voidunpolish(QWidget*widget);//取消polish()的作用

       intpixelMetric(PixelMetricmetric,constQStyleOption*option,

                        constQWidget*widget)const;//设置各部件的线宽,大小等

       intstyleHint(StyleHinthint,constQStyleOption*option,

                      constQWidget*widget,QStyleHintReturn*returnData)const;//分别设置各种部件的布局,比如checkbox的text在左边或者在右边

     

       voiddrawPrimitive(PrimitiveElementelement,constQStyleOption*option,

                           QPainter*painter,constQWidget*widget)const;

    //这个则是最重要的,在这里面可以实现对不同部件的原始元素的绘制,当然你也可以调用默认的方法.element这个参数就是我们需要重绘的部件的原始元素

     

       voiddrawControl(ControlElementelement,constQStyleOption*option,

                         QPainter*painter,constQWidget*widget)const;

    };

    我们这里用QMotifStyle类作为基类,当然你也可以采用其他预定义的样式作为基类。至于选择哪个基类来继承完全取决用户,通常选择和自己所期望的最相近的类来继承。这里贴一个图,主要是继承层次的图:

           

    6.      实现文件“mystyle.cpp”的函数定义。

    voidmyStyle::polish(QPalette&palette)

    {

       QColorbrown(212,140,95);//褐色

       QColorslightlyOpaqueBlack(0,0,0,63);

       QColorveryLightGreen(204,232,215);//浅绿色

       QPixmapbackgroundImage(":/images/bgPortrait.jpg");

       QPixmapbuttonImage(":/images/wood.jpg");

       QPixmapmidImage=buttonImage;//滑动条背景

       QPainterpainter;//画笔

       painter.begin(&midImage);

       painter.setPen(Qt::NoPen);

       painter.fillRect(midImage.rect(),slightlyOpaqueBlack);

       painter.end();

       palette=QPalette(brown);//调色板

       palette.setBrush(QPalette::BrightText,Qt::white);

       palette.setBrush(QPalette::Base,veryLightGreen);//设置输入框背景

       palette.setBrush(QPalette::Highlight,Qt::darkGreen);//设置鼠标选中的背景色为深绿色

       palette.setBrush(QPalette::Button,buttonImage);//设置按钮背景

       palette.setBrush(QPalette::Mid,midImage);//设置滑动条背景

       palette.setBrush(QPalette::Window,backgroundImage);//设置应用程序背景

       QBrushbrush=palette.background();

       brush.setColor(brush.color().dark());

       palette.setBrush(QPalette::Disabled,QPalette::WindowText,brush);

       palette.setBrush(QPalette::Disabled,QPalette::Text,brush);

       palette.setBrush(QPalette::Disabled,QPalette::ButtonText,brush);

       palette.setBrush(QPalette::Disabled,QPalette::Base,brush);

       palette.setBrush(QPalette::Disabled,QPalette::Button,brush);

       palette.setBrush(QPalette::Disabled,QPalette::Mid,brush);

    }

    应用程序的颜色外观主要在这个函数设定,至于可以设置哪些外观,请参考Qt帮助文档的 “QPalette::ColorRole”部分。

    voidmyStyle::polish(QWidget*widget)

    {

       if(qobject_cast<QPushButton*>(widget)

                ||qobject_cast<QComboBox*>(widget))

           widget->setAttribute(Qt::WA_Hover,true);

       //鼠标进入或者离开窗口部件所在区域时,会产生一个绘制事件

    }

    voidmyStyle::unpolish(QWidget*widget)

    {

       if(qobject_cast<QPushButton*>(widget)

                ||qobject_cast<QComboBox*>(widget))

           widget->setAttribute(Qt::WA_Hover,false);

    }

    intmyStyle::pixelMetric(QStyle::PixelMetricmetric,

                             constQStyleOption*option,constQWidget*widget)const

    {

       switch(metric)

       {

       casePM_ComboBoxFrameWidth:

           return6;

       casePM_ScrollBarExtent:

           returnQMotifStyle::pixelMetric(metric,option,widget)+4;

       default:

           returnQMotifStyle::pixelMetric(metric,option,widget);

       }

    }

    intmyStyle::styleHint(QStyle::StyleHinthint,

                           constQStyleOption*option,constQWidget*widget,

                           QStyleHintReturn*returnData)const

    {

       switch(hint)

       {

       caseSH_DitherDisabledText:

           returnint(false);

       caseSH_EtchDisabledText:

           returnint(true);

       default:

           returnQMotifStyle::styleHint(hint,option,widget,returnData);

       }

    }

    voidmyStyle::drawPrimitive(QStyle::PrimitiveElementelement,

                                constQStyleOption*option,QPainter*painter,constQWidget*widget)const

    {

       QMotifStyle::drawPrimitive(element,option,painter,widget);

    }

    这里采用的是默认的绘制函数,如果要改变PushButton等部件的形状外观,请上网查阅相关资料或查阅相关书籍。

    voidmyStyle::drawControl(QStyle::ControlElementelement,

                              constQStyleOption*option,QPainter*painter,constQWidget*widget)const

    {

       QMotifStyle::drawControl(element,option,painter,widget);

    }

    这里也是采用默认的绘制函数。

    7.       修改“main.cpp”文件。首先添加 #include"mystyle.h"

    然后在main函数中添加QApplication::setStyle(newmyStyle);

    这样,自定义样式的工作就全部完成了。这里只是对QStyle类的使用做了简单介绍。你也可以参考Qt的Demo例子“styles”。如需详细了解自定义样式的相关知识,请访问网站http://doc.trolltech.com/4.3/style-reference.html

    http://blog.csdn.net/liuguangzhou123/article/details/7458450

  • 相关阅读:
    一步一步教你elasticsearch在windows下的安装
    Query DSL for elasticsearch Query
    [转] webpack之前端性能优化(史上最全,不断更新中。。。)
    [转] Javascript模块化编程(一):模块的写法
    [转] 2016 JavaScript 发展现状大调查
    [转] 前端性能的几个基础指标
    [转] 视频直播前端方案
    [转] Web前端开发工程师常用技术网站整理
    [转] getBoundingClientRect判断元素是否可见
    [转] js前端解决跨域问题的8种方案(最新最全)
  • 原文地址:https://www.cnblogs.com/findumars/p/6361995.html
Copyright © 2011-2022 走看看