qcombox下拉框样式_ComboBox样式实例及下拉框的定制

导读

组合框是一个重要且应用广泛的组件，一般由两个子组件组成：文本下拉单部分和按钮部分。在许多既需要用户选择、又需要用户手动输入的应用场景下，组合框能够很好的满足我们的需求。如我们经常使用的聊天软件QQ登录框，便是一个很好的应用例子：

显然，用户既可以自己手动输入新的QQ号码，也可以在列表框中选择历史输入记录。对于提高用户体验是一个不错的手段。这篇博文重点讲述如何用QSS对组合框进行定制。

基本自定义

组合框的使用非常简单，为了加快叙述速度，我们直接在Qt

Designer中拖一个QComboBox控件放到主窗口中。此时，我们什么都不用做就有了一个简单的组合框，如下：

但很显然，我们得添加一个文字，否则QComboBox不会显示任何内容。这样出现的组合框样式很普通：一个文本加一个带箭头号的按钮就完了。既然主题是用QSS来定制组合框，那么我们第一件事就是新建一个.qss文件并添加到资源文件中进行编译。.qss文件的内容初步编写如下：

QComboBox {

border:1px solid gray;

border-radius:3px;

padding:1px 2px 1px 2px; # 针对于组合框中的文本内容

min-width:9em; # 组合框的最小宽度

}

我们给组合框3个像素的圆角，边框1个像素宽并将颜色设置为灰色。看看效果：