在qt中有这样一个控件:
就是这个Horizontal Slider他的作用相信大家都知道了,也就是通过滑动来改变数值。今天我们就使用这个控件实现一个三原色滑动变色。
实现效果:
1.创建UI界面
这个就不用多说了,这个大家就按照我的这个去创建就好了。
2.编写代码
首先我们要初始话我们的属性:
cpp
//初始化红色滑动条
ui->hsred->setMaximum(255);
ui->hsred->setMinimum(0);
ui->hsred->setSingleStep(1);
ui->hsred->setPageStep(10);
ui->hsred->setOrientation(Qt::Horizontal);
//初始化绿色
ui->hsgreen->setMaximum(255);
ui->hsgreen->setMinimum(0);
ui->hsgreen->setSingleStep(1);
ui->hsgreen->setPageStep(10);
ui->hsgreen->setOrientation(Qt::Horizontal);
//初始化蓝色
ui->hsblue->setMaximum(255);
ui->hsblue->setMinimum(0);
ui->hsblue->setSingleStep(1);
ui->hsblue->setPageStep(10);
ui->hsblue->setOrientation(Qt::Horizontal);
//设置背景色
QString red = QString::number(ui->hsred->value());
QString green = QString::number(ui->hsgreen->value());
QString blue = QString::number(ui->hsblue->value());
ui->lered->setText(red);
ui->legreen->setText(green);
ui->leblue->setText(blue);
QString style = "background-color:rgb("+red+","+green+","+blue+");";
ui->lineEdit->setStyleSheet(style);
来讲几个知识点:
//初始化红色滑动条
ui->hsred->setMaximum(255);//这个 是设置滑动条的上限
ui->hsred->setMinimum(0);//这个是设置活动条的下限
ui->hsred->setSingleStep(1);//这个是设置步长
ui->hsred->setPageStep(10);//这个是你点击的时候滑动条一次增加的量
ui->hsred->setOrientation(Qt::Horizontal); // 设置滑动条方向为水平
讲完这个,就开始编写我们的槽函数了
3.槽函数的编写
在ui界面中选中滑动条右键----->转到槽,然后开始敲代码
cpp
void Widget::on_hsgreen_valueChanged(int value)
{
QString red = QString::number(ui->hsred->value());
QString green = QString::number(ui->hsgreen->value());
QString blue = QString::number(ui->hsblue->value());
ui->legreen->setText(green);
QString style = "background-color:rgb("+red+","+green+","+blue+");";
ui->lineEdit->setStyleSheet(style);
}
好了,就是如此简单,大家快去试试吧
!!!!!!!!!!!!!!!!!!!!!!!
下课!!!!!!
忘了 还有源码:
cpp
#include "widget.h"
#include "ui_widget.h"
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
//初始化红色滑动条
ui->hsred->setMaximum(255);
ui->hsred->setMinimum(0);
ui->hsred->setSingleStep(1);
ui->hsred->setPageStep(10);
ui->hsred->setOrientation(Qt::Horizontal);
//初始化绿色
ui->hsgreen->setMaximum(255);
ui->hsgreen->setMinimum(0);
ui->hsgreen->setSingleStep(1);
ui->hsgreen->setPageStep(10);
ui->hsgreen->setOrientation(Qt::Horizontal);
//初始化蓝色
ui->hsblue->setMaximum(255);
ui->hsblue->setMinimum(0);
ui->hsblue->setSingleStep(1);
ui->hsblue->setPageStep(10);
ui->hsblue->setOrientation(Qt::Horizontal);
//设置背景色
QString red = QString::number(ui->hsred->value());
QString green = QString::number(ui->hsgreen->value());
QString blue = QString::number(ui->hsblue->value());
ui->lered->setText(red);
ui->legreen->setText(green);
ui->leblue->setText(blue);
QString style = "background-color:rgb("+red+","+green+","+blue+");";
ui->lineEdit->setStyleSheet(style);
}
Widget::~Widget()
{
delete ui;
}
void Widget::on_hsred_valueChanged(int value)
{
QString red = QString::number(ui->hsred->value());
QString green = QString::number(ui->hsgreen->value());
QString blue = QString::number(ui->hsblue->value());
ui->lered->setText(red);
QString style = "background-color:rgb("+red+","+green+","+blue+");";
ui->lineEdit->setStyleSheet(style);
}
void Widget::on_hsgreen_valueChanged(int value)
{
QString red = QString::number(ui->hsred->value());
QString green = QString::number(ui->hsgreen->value());
QString blue = QString::number(ui->hsblue->value());
ui->legreen->setText(green);
QString style = "background-color:rgb("+red+","+green+","+blue+");";
ui->lineEdit->setStyleSheet(style);
}
void Widget::on_hsblue_valueChanged(int value)
{
QString red = QString::number(ui->hsred->value());
QString green = QString::number(ui->hsgreen->value());
QString blue = QString::number(ui->hsblue->value());
ui->leblue->setText(blue);
QString style = "background-color:rgb("+red+","+green+","+blue+");";
ui->lineEdit->setStyleSheet(style);
}