本文大纲 #
- 添加好友界面UI设计
- 界面逻辑代码
添加好友界面UI设计 #
- 颜色风格
本软件采用谷歌marterial design风格，选用DEEP PURPLE做前景色，AMBER做装饰色生成的配色如下：
/* Palette generated by Material Palette - materialpalette.com/deep-purple/amber */
.dark-primary-color { background: #512DA8; }
.default-primary-color { background: #673AB7; }
.light-primary-color { background: #D1C4E9; }
.text-primary-color { color: #FFFFFF; }
.accent-color { background: #FFC107; }
.primary-text-color { color: #212121; }
.secondary-text-color { color: #757575; }
.divider-color { border-color: #BDBDBD; }
- qt布局的问题
要把sizePolicy设置成Ignore才能让布局中的Strengh生效 QT sizeHint 及 Policy的用法
下拉菜单设计 #
- 参考文章
-
实操
QT QComboBox样式设置全解析 戳这里
注意，最重要的一点就是要使qss生效，在代码中还要加一句：
ui->productBox->setView(new QListView());
a. 好友查询界面的性别选择框
border统一1px；border-radius统一2px
- 按钮尺寸
https://www.uisdc.com/button-design-5
高 = 文字行高 + Xn，X=自然数，n=4
宽 = 文字宽度 + Xn，X=自然数，n=4
- 字体大小
点大小和像素大小的换算 https://blog.csdn.net/zhoudonghao4381/article/details/80192527
字体规范 https://www.xueui.cn/design-theory/ui-designers-essential-skills-common-font-specification-2.html
px 相关单位 https://blog.csdn.net/lianfengzhidie/article/details/86663715
设计规范 https://docs.microsoft.com/zh-cn/windows/uwp/design/ https://www.zhihu.com/question/19791196 https://zhuanlan.zhihu.com/p/34865398
设置全局样式表 #
参考链接：https://blog.csdn.net/nodeman/article/details/106309928
TIP:在QT Designer中父窗口设置控件样式表可以在子窗口继承
使用现有Ui文件对界面进行测试 #
https://blog.csdn.net/u012423865/article/details/51597200
使用自己的ui千万要保证.ui文件的widget名字与自己声明的类名一致 https://blog.csdn.net/rjc_lihui/article/details/88397009
让控件在布局中左右对齐 #
https://www.pianshen.com/article/1267989284/
查询结果列表 单个item #
vs2019配置Qt #
https://www.jb51.net/article/183061.htm