Qt常用控件

常用控件

Combon：下拉框

在Window Icon中可以选择添加左上角图标

QLabel: 标签

作用: 可以在QLabel上显示图片, 文字等信息

常用函数:

• setText() 函数: 设置在标签上显示的文本
• setTextFormat() 函数: 设置标签的文本格式
• setAlignment() 函数: 设置内容的对齐方式
• setWordWrap() 函数: 设置自动换行
• setIndent() 函数: 设置缩进
• setMargin() 函数: 设置边距

例:

创建一个 QApplication 项目, 使用 QWidget, 在QWidget 上创建了三个标签, 用于三种格式:

• textLabel: 用于测试纯文本
• richLabel: 用于测试富文本(富文本支持HTML标签)
• mdLabel: 用于测试Markdown文本

先用 setTextFormat() 函数为标签设定文本格式, 再用 setText() 函数为其设置文本, 运行时文本就会按照相应的格式去显示.

void Widget::setLabelFormat() {
    //设置文本格式
    ui->textLabel->setTextFormat(Qt::PlainText);
    //设置标签上的文本
    ui->textLabel->setText("#### 纯"
                           "<p>文本</p>");

    ui->richLabel->setTextFormat(Qt::RichText);
    ui->richLabel->setText("<p>富</p>"
                           "<p>文</p>"
                           "<p>本</p>");


    ui->mdLabel->setTextFormat(Qt::MarkdownText);
    ui->mdLabel->setText("### markdown文本\n"
                            "- 无序列表\n"
                            "1. 有序列表\n"
                            "***\n"
                            "分割线");
}

设置文本样式

void LabelForm::setForm() {

    // 设置对齐方式
    ui->label->setText("这是一段文本");
    //右上方对齐
    ui->label->setAlignment(Qt::AlignRight | Qt::AlignTop);

    // 设置自动换行
    ui->label_2->setText("这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本");
    // 自动换行
    ui->label_2->setWordWrap(true);

    // 设置缩进
    ui->label_3->setText("这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本");
    ui->label_3->setWordWrap(true);
    //This property holds the label's text indent in pixels
    //单位：像素
    ui->label_3->setIndent(50);

    // 设置边距
    ui->label_4->setText("这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本这是一段很长的文本");
    ui->label_4->setWordWrap(true);
    //上下左右都空出50像素
    ui->label_4->setMargin(50);
}

效果:

QLabel自动缩放

新建一个工程, 放置一个 QLabel 设置 label 大小为 800 * 600

//设置label大小
ui->label->setGeometry(0, 0, 800, 600);

导入图片, 创建一个 Pixmap 对象, 并使用 setPixmap() 函数将图片显示在标签上

//创建pixmap对象
QPixmap pix("://imgs/107736296_p0.jpg");
//设置图片显示在窗口上
ui->label->setPixmap(pix);

使用 setScaledContents() 函数实现内容缩放, 跟随 label 的大小缩放内容

ui->label->setScaledContents(true);

至此, 我们发现一个问题: 调整窗口大小时, 图片并未跟随缩放.

原因是: 提前将 label 大小设置成了 800 * 600 在此基础上对图片进行了内容缩放, 窗口大小变化时, label 的大小并没有变化, 所以不会自动缩放.

解决方法:

重写 resizeEvent() 函数, 此函数会在窗口大小发生变化时调用. 在该函数中实现一个一个一个重新设置label大小的功能即可实现图片跟随窗口大小缩放的效果.

//窗口大小改变时会调用
void AutoScale::resizeEvent(QResizeEvent * event) {
    //event->size为此时窗口大小, 获取后再调用调用setGeometry()函数来重新设置label大小
    ui->label->setGeometry(0, 0, event->size().width(), event->size().height());
}

效果: