样式，常用组件

欢迎：新建Qt工程

编辑：编辑查看Qt工程的代码

设计：跳转到UI设计师界面

调试：调试Qt项目

项目：工程的配置界面

帮助：Qt的帮助手册

Layouts:布局管理器（组件在水平/垂直方向对齐）

Spacers:分隔器

Buttons:按钮

Item Views...odel-Based):图像显示有关的各种视图

Item Widge...tem-Based)：列表框（表格，树状列表，横向列表）

Containers:容器（可以把其他所有组件嵌套到容器中）

Input Widgets:各种输入组件

Display Widgets:各种显示组件

常用的组件：

1）标签：(lable)

   作用：用来显示字符串     常用的属性：       geometry 设置位置坐标，设置宽和高

         font 设置标签上字体的大小

2) 单行输出框：(line edit)

   作用：用来获取键盘输入的文字内容     常用的属性：       geometry 设置位置坐标，设置宽和高

         font 设置标签上字体的大小

     placeholdertext 设置输入框默认提示信息       echomode 设置输入框隐藏信息还是显示信息         显示->normal

           隐藏->password

3）普通按钮： (pushbutton)

   常用的属性：     geometry 设置位置坐标，设置宽和高

       font 设置标签上字体的大小

QT中样式设计(qss语句的使用)

什么是样式设计?酷炫效果

类似于网页设计中的css，为了让你的QT界面更加的好看

如何跳到QT改变样式表的界面?

  右键点击组件，选择改变样式表即可

(1)常用的qss语句

font: 48pt"楷体";//字体设置成楷体 48号字

color: rgb(255,0,0);//前景色设置成(255,0,0)按钮的前景色指的就是按钮上文字的颜色

background-color: rgb(0,85,255);//背景色设置成(0,85,255)按钮的背景色指的就是按钮背景的颜色

border-color:rgb(0,85,255);//边框颜色设置成(0,85,255)

background-image: url(:/new/prefix1/pic/3.jpg);//设置背景图片

background-image: ur(你需要的图片的绝对路径);

border-image: url(:/new/prefix1/pic/2.jpg);//设置边框图片(边框图片跟组件的大小保持一致)

border-image: url(你需要的图片的绝对路径);

border-radius:f5px; //把倒角设置为15个像素，倒角的大小不能超过组件高度的一半

border:2px solid#ff0000;//把边框的宽度设置为2个像素，颜色设置成ff0000

QPushButton:pressed{ 设置按钮按下的时候背景图片,主界面的样式中使用background-image: url(:/button down.png);}

QPushButton:pressed#regBt{ 设置指定按钮regBt按钮按下时候背景图片，主界面的样式中使用background-image: url(:/button down.png);}

QPushButton:hover{ 主界面的样式中使用background-color:#ff00ff;鼠标进入控件设置景颜色}

QMainWindow{border-image: url(:/new/prefix1/pic/3.jpg);} //让图片只作用于主窗口

注意：QT中路径写法：

本来路径：D:\QTtest\untitled15\image\1.png

QT要求：D:/QTtest/untitled15/image/1.png

路径有两种：

  第一种：绝对路径，比如：D:/QTtest/untitled15/image/1.png

  第二种：添加了资源文件后，写资源文件的相对路径，比如：

  border-image: url(:/new/prefix1/image/1682391068745168.png);

 

(2)给组件添加背景图片--》给你的QT工程添加资源文件资源文件:你的QT工程需要用到的外部文件都叫做资源文件,常见的资源文件有图片，音频文件，视频文件

添加资源文件的步骤:

第一步:在你的QT工程文件夹中把要添加的图片保存到新建的文件夹中

第二步:右键点击工程名，选择add new--》选择QT，选择QT resources file --》点击add prefix,接着再点击add fies --》会自动弹出文件对话框,找到自己要添加的图片,添加即可

第二步:ctrl+s保存即可 I