Chinaunix首页 | 论坛 | 博客
  • 博客访问: 1774544
  • 博文数量: 198
  • 博客积分: 4088
  • 博客等级: 上校
  • 技术积分: 2391
  • 用 户 组: 普通用户
  • 注册时间: 2011-05-15 16:29
个人简介

游戏开发,系统架构; 博客迁移到:http://www.jianshu.com/u/3ac0504b3b8c

文章分类

全部博文(198)

文章存档

2017年(1)

2016年(12)

2015年(1)

2014年(3)

2013年(13)

2012年(18)

2011年(150)

分类: C/C++

2011-07-20 13:29:01

使用Skin(皮肤)是制作酷酷界面的一个有利的工具,在用户界面GUI越来越重要的今天,一个应用程序如果只有一套皮肤,不能更换皮肤,那么这个应用程 序的生命力是非常值得人们怀疑的;那么使用Qt如何制作酷酷而又吸引人的界面呢?下面我会对在Qt下进行皮肤制作,异型窗口制作做一个总结,对于新手是一 个入门,对于老手算是一个参考吧,如果有不妥和不当之处,还请大家不吝指出。

制作漂亮的界面目前至少有两个关键因素,一个是窗口需要提供异型显示,另外一个就是提供换肤功能。前者是彰显当前年轻人个性的一个很好的方式,因而也是深受当今年轻人的热爱;后者则是在前者的基础之上给了年轻人对于自己喜好的软件样式的更广泛的选择。

异型窗口主要对应的是操作系统默认的窗口样式。它是相对于默认操作系统中规规矩矩的长方形窗口而产生的一种可以采用任何形状显示的GUI界面窗口。

任何一种操作系统,无论是MAC,Linux,还是Windows,在其GUI系统中都会提供一种默认的窗口样式。一般情况下这种样式都是比较规矩的长方 形,或者圆角长方形;这种显示样式是由操作系统提供的,如果你采用其上的IDE进行GUI界面开发,默认的界面样式仍然是系统默认的;然而,幸运的是,大 部分的成熟的GUI开发系统都会提供异型窗口开发的解决方案。

class LExample:public QWidget{
Q_OBJECT // QT的宏,如果使用QT的信号和槽,必须在类的声明中的第一行加入此宏;具体情况参考QT文档;
LExample(QWidget *pv_event);
}; /* class LExample */

注意:必须是公有继承,否则你这个窗口很多功能都实现不了。

LExample::LExample:
QWidget(pv_event, NULL, WStyle_Customize | WStyle_NoBorder){
//
}

注意:这两者不可缺一,否则会出现其他效果,并不是完全的异型界面了,读者可自行尝试;

第三步、如果整个程序主界面是异型,那么在主窗口初始化的时候增加下面这句话:

setBackgroundMode(QWidget::NoBackground);

注意:这一条语句并不是必要的,去掉也并不影响最终结果;

有些人一看到檬板俩字就像到了复杂的图像处理,已经有了要闪人的意思了,其实檬板的原理或许有点复杂,但是这里的做法却非常简单,我们只需要完成两副图片即可;

  • 第一副,是你准备显示的主界面图片,这个图片的形状,内容设计你自己可以随意定制;
  • 第二副,这是一张檬板图片,这个檬板图片是什么样子的?它是做什么用的?

这个檬板图片是一个黑白单色图片,也就是说这个图片只有黑白两色。檬板处理时,黑色是你要显示的主界面的部分,而白色则是要透明的部分。这样你就可以通过 这个檬板图片任意的控制你要显示的界面的形状了。另外,这个图片还有一个要求,就是大小要和前面的主界面图片相同,这样才能对整个主界面进行控制。

void LExample::paintEvent(QPaintEvent *pv_event){
//
QPixmap *pm_back_buffer = new QPixmap("images/main.png");
QBitmap *pm_mask = new QBitmap("images/main_mask.png");
// 设置檬板图片;
setMask(*pm_mask);
bitBlt(this, 0, 0 pm_back_buffer);
}

注意:这里并不赞成把加载图片和设置檬板图片放到这个方法内,最好是将这个放到初始化的方法内,这样才会提高程序效率;

如此,经过这五大步骤,你就可以实现异型窗口的实现了。

这一步的实现比较简单,具体的方法就是重载你用到的所有控件的paintEvent方法,自己控制控件界面的显示,全部采用配置文件+图片的方法,你就可以实现换肤功能了。

Reference: http://www-128.ibm.com/developerworks/cn/linux/guitoolkit/qt/skin/index.html http://blog.csdn.net/iamdbl/archive/2007/04/06/1555084.aspx

转载地址:http://blog.csdn.net/baymoon/article/details/1766916

阅读(7614) | 评论(0) | 转发(1) |
给主人留下些什么吧!~~