平时发现同学做的ppt找的材料图片不错_不知道从哪些网站可以获得,威海网站优化推广,什么网站不用备案,wordpress怎么打删除线一、 QLitWidget概述
注意#xff1a;本文不是简单翻译Qt文档或者接口函数#xff0c;而侧重于无代码Qt设计器下演示使用。 QListWidget也称列表框类#xff0c;它提供了一个类似于QListView提供的列表视图#xff0c;但是它具有一个用于添加和删除项的经典的基于项的接口…一、 QLitWidget概述
注意本文不是简单翻译Qt文档或者接口函数而侧重于无代码Qt设计器下演示使用。 QListWidget也称列表框类它提供了一个类似于QListView提供的列表视图但是它具有一个用于添加和删除项的经典的基于项的接口。在实际应用中多与堆栈窗体类配合使用。 它是Qt这些常用基础组件里我认为最被低估的类其实QListWidget反到灵活、简单、实用包括我自己在侧栏或者上栏也经常使用了QFrameQPushButton或者QToolButton组合拼接起来自己“造轮子”如下图卡巴和微信的侧栏列表框样式以及本文演示重点todesk侧边栏 大部分不熟悉的人潜意识里都觉得QListWidget太低级不好用只配实现下图左的效果本次我们按照ToDesk已有布局实现如下右图效果只用qt designer设计器和样式表且不使用一行代码 二、实例演示和试用
2.1、拖出列表框类并添加列表
如下图在Item Widget栏里1位置直接拖拽出List Widget会得到2位置所示的白框看这什么也没有那是因为没有列表菜单双击2位置空间在3位置点绿色添加按钮在输入名称就可显示了依次增加5个得到下右图所示 2.2、对QListWidget设置背景去除边框
QListWidget选中右键改变样式表输入以下内容得到下右图所示
QListWidget {background-color: rgb(240, 243, 248);border: 0;
} 2.3、调整字体大小
将所有列表菜单字体一次性全部字体大小调成12
QListWidget选中最右边窗口font12确认即可得到右图 2.4、调整每个列表菜单高度
解决每个列表菜单高度也叫Item高度。
此时每个按钮菜单已经可以点击或者选中了但是按钮高度太低导致都挤在了上面改变item高度还有每个按钮圆角我一般还是习惯样式表如下图
QListView::item {height: 45px;border-radius: 5px;
} 2.5、设置鼠标划过和选中效果
依旧是选中编辑样式表其中background背景颜色color字体颜色。设置完成后如右图 QListView::Item:hover {background: rgb(229, 237, 248);}QListView::Item:selected {background: rgb(204, 223, 248);color: rgb(0, 112, 249);
} 2.6、解决左侧图标
2.6.1 项目右键新建文件选择“Qt resource file”随便一个英文名后期会被视为路径建议resource此时得到右图在qrc文件位置添加现有文件把准备好的图标一把添加。 备注每个菜单有两个图标是因为选中后图标是蓝色所以是两个 2.6.2 选中右键编辑项目再选择属性滚动找到icon点小三角形再点选择资源找到第一个control对应黑色图标紧接着滚动到“选择 关”位置同样点小三角形再点选择资源找到第一个control对应蓝色图标确认即可。 2.6.3 按照上面的方面把5个列表依次设置图标完成后如下图会看到图标特别小我们需要根据图标大小设置一下在如下箭头所示位置iconsize的宽度和高度都设置为30得到下右图已经接近完美了 2.7、解决选中后的虚线框问题 这里也采用样式表去除选中列表框整体右键改变样式表增加如下如下图
QWidget:focus{
outline: none;
} 2.8 最终编译演示
此时已经完整完成侧边栏如下图下篇将演示和堆栈窗体类QStackedWidget结合起来实现翻页切换功能 总结实际上Qt提供给我们的是小孩积木到底堆成怎样效果取决于想象力和熟练度。下篇将QStackedWidget很容易的实现切换页相对于QFrameQPushButton或者QToolButton这种造轮子组和更加简洁、实用和易理解。
