欢迎来到天天文库
浏览记录
ID:27574001
大小:95.16 KB
页数:5页
时间:2018-12-03
《qtstylesheet实践(二)组合框qcombobox的定制》由会员上传分享,免费在线阅读,更多相关内容在学术论文-天天文库。
1、QtStyleSheet实践(二〉:组合框QGomboBox的定制导读组合框足一个並要li应川广泛的组件,一般由两个子组件组成:文木下拉单部分和按钮部分。在许多既耑要川户选择、乂需要阁户手动输入的应用场枭下,组合框能够很好的满足我们的需求。如我们经常使用的瑚I天软件QQ登录框,便是一个很好的应用例子:蠡QQO-X♦曇會▲■L找回S码[§s1显然,用户既对以自己手动输入新的QQ号码,也叶以在列表框屮选择历史输入记录。对f捉高用户体验是一个不错的亍•段。这篇博文里点讲述如何用QSS对组合框进行定制。基本自定义组合框的使
2、用非常简单,力了加快叙述速度,我们直接在QtDesigner屮拖一个QComboBox控件放到主窗门小。此时,我们什么都不川做就有了一个简单的组合框,如下:Widows▼们很显然,我们得添加-个文字,否则QComboBox不会显示任何内容。这祥山现的组合榴样式很荇通:一个文本加一个带箭头号的按钮就完了。既然主题是用QSS来定制组合框,那么我们第一件唞就是新逮一个.qss文件并添加到资源文件十进行编译-qss文件的内容初步编写如下:QComboBox{border:lpxsolidgray;border-radius
3、:3px;padding:lpx2pxlpx2px;ft针对于组合框中的文木内容min-width:9em;#组合框的最小宽度我们给组合根3个像索的關角,边框1个像索宽并将颜色设置为灰色。矜沂效果:VZrdows文本框部分似乎还不错,们是右边的按钮外观实在足太丑丫,和牿体风格不搭。我们继续芙化一下按钮。按钮是QComboBox的-"个子组件,Hl::drop-down指代。编写如下QSS代码:QComboBox::drop-down{subcontrol-origin:padding;subcontrol-posi
4、tion:topright;width:20px;border-1eft-width:lpx;border-1eft-color:darkgray;border一left一style:solid;/氺justasingleline氺/border一top一right一radius:3px;AsameradiusastheQComboBox*/border-bottom-right-radius:3px;QComboBox::down-arrow{image:url(:/misc/down_arrow_2);}"-可
5、以看到,我们分别将按钮右上角和农下角设罝了3个像索的岡角,这处因九我们前面给组合框的整体边框设冒.了圆角。如果不给按钮没貿.圆角,那么按钮的棱角将会遮挡住整体边框的關角效果。另外,我们改变了按钮上的箭头阁称心:down-arrow也妃一个子组件,我们川image属性锊换了系统默认的阌称。对比一下:WndowsrWrdows-嗯,整体风格上看起来协调些了。当然了,在::drop-down子组件的定制屮,我们将subcontro卜position诚性没置成了top,right。这样按钮就位于敁右边了。如果希望将按钮置f
6、•最左边显然也很简申。只满要将subcontrol-position设罝为top,left,然后改变一卜‘QComboBox的padding值就可以达到問的了。我们W拉出K拉框看看:WindowsWndows哲什么问题呢?显然,下拉框中的选项高度太小丫,沿起來挺别扭的。那么如何对下拉框进行定制呢?我们冇个很好的根仿对象:«户:▼密珥:AccountJ)XAccount-1XAccountsX使用其他录:找回360安籴卫士的登录框屮的下拉框看起来就挺不错,而a还冇图粘出现在选项的石边。下血我们就进入高级定制部分。看看
7、又该如何进行改进。高级自定义耍丈现上述效果,我们首先要做的就是将QComboBox设置为川•以编辑的(setEditable(p。这样,文本框中的内界才可以f•动进行输入。另外,我们还注意到,下拉框中的选项右边还右阁标,屮现,QQ的登录框屮也出现了图标。我们鉍直观的想法就是用布局钤理器(水T或番直的)将所冇组件组装成一个整体,然后爯添加到下拉框中去。怎么做呢?幸运的是,QComboBox内部也足Model/View框架米维护下拉框内矜的。冈此,最嵐接的方法就足定义一个QListWidget,将这个QListWidg
8、et没置力QComboBox的View,而将QListWidlget的Model设杜为QComboBox的Model。QListWidget只是一个View类,因此我们还得自定义View类中的Item啊。那好,自QWidget派生一个+类,实现水平布局,将所冇+组件添加到里面去:Comboboxltem::ComboboxItem(QWidget氺paren
此文档下载收益归作者所有