实例功能
QSlider:滑动条,通过滑动设置数值,可用于数值输入。(此实例使用四个滑动条输入红、绿、蓝三色的Alpha值,然后合成颜色,作为一个QTextEdit组件的底色)
QScrollBar:卷滚条,与QSlider功能类似,还可以用于卷滚区域
QProgressBar:进度条,一般用于显示任务进度,可用于数值的百分比显示(实例程序中滑动一个Slider,获取其值并更新ScrollBar和ProgressBar)
QDial:表盘式数值输入组件,通过转动表针获取输入值
QLCDNumber:模仿LCD数字的显示组件,可以显示整数或浮点数,显示整数可以使用不同进制数值(实例程序中通过转动表盘,获得的值显示在LCD中)
各组件的主要功能和属性
1.QSlider
QSlider、QScrollBar和Qdail三个组件都从QAbstractSlider继承而来,有一些共同的属性,QSlider是滑动的标尺型组件,滑动标尺上的滑块能改变值
QAbstractSlider的主要属性包括以下几种:
QSlider的专有属性有两个:
2.QScrollBar
3.QDial
QDial是仪表盘式的组件,通过旋转表盘获取输入值,其特有属性如下:
4.QProgressBar
QProgessBar的父类是Widget,一般用于进度条显示,常见属性如下:
5.QLCDNumber
QLCDNumber是模拟LCD显示数字的组件,可以显示整数或小数,但是就像真正的LCD一样,需要设置显示数字的个数
其主要属性如下:
实例代码的实现
1.红、绿、蓝配色
在UI设计界面,点击hSlider组件,点击右键选择"Go to slot"对话框选择valueChanged(int)信号,生成的槽函数中代码如下:
void Widget::on_hSlider_red_valueChanged(int value)
{
//拖动滑动条时设置textEdit的底色
Q_UNUSED(value);
QColor color;
int R = ui->hSlider_red->value();
int G = ui->hSlider_green->value();
int B = ui->hSlider_blue->value();
int alpha = ui->hSlider_apha->value();
color.setRgb(R,G,B,alpha); //使用setRgb函数获得颜色
QPalette pal = ui->textEdit->palette();
pal.setColor(QPalette::Base,color); //设置底色
ui->textEdit->setPalette(pal);
}
以上代码是hSlider_red的valueChanged(int)信号的槽函数代码,其他三个滑动条的相应代码也与它完全相同,因此在设计界面时无需为其他三个组件再生成槽函数,只需将它们的valueChange(int)槽函数hSlider_blue、hSlider_green函数相关联即可
在窗口类Widget的构造函数中实现此功能
Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this);
QObject::connect(ui->hSlider_green,SIGNAL(valueChanged(int)),
this,SLOT(on_hSlider_red_valueChanged(int)));
QObject::connect(ui->hSlider_alpha,SIGNAL(valueChanged(int)),
this,SLOT(on_hSlider_red_valueChanged(int)));
QObject::connect(ui->hSlider_blue,SIGNAL(valueChanged(int)),
this,SLOT(on_hSlider_red_valueChanged(int)));
}
这样关联之后,这四个滑动条的任意一个值改变时,都会发射valueChanged()信号,从而改变textEdit组件的底色,并且每次都调用同一个槽函数,避免了重复编写代码
2.LCD显示
在UI设计界面中,点击Dail组件,右键选择"Go to slot",选择valueChanged(int),槽函数内容如下:
void Widget::on_dial_valueChanged(int value)
{
//将LCD的显示值为Dail的值
ui->lcdNumber->display(value);
//将进度条进度设置为Dail的值
ui->progressBar->setValue(value);
ui->dial->setNotchesVisible(true); //设置Dail的小刻度可见
}