实例功能
QSlider:滑动条,通过滑动设置数值,可用于数值输入。(此实例使用四个滑动条输入红、绿、蓝三色的Alpha值,然后合成颜色,作为一个QTextEdit组件的底色)
QScrollBar:卷滚条,与QSlider功能类似,还可以用于卷滚区域
QProgressBar:进度条,一般用于显示任务进度,可用于数值的百分比显示(实例程序中滑动一个Slider,获取其值并更新ScrollBar和ProgressBar)
QDial:表盘式数值输入组件,通过转动表针获取输入值
QLCDNumber:模仿LCD数字的显示组件,可以显示整数或浮点数,显示整数可以使用不同进制数值(实例程序中通过转动表盘,获得的值显示在LCD中)
各组件的主要功能和属性
1.QSlider
QSlider、QScrollBar和Qdail三个组件都从QAbstractSlider继承而来,有一些共同的属性,QSlider是滑动的标尺型组件,滑动标尺上的滑块能改变值
QAbstractSlider的主要属性包括以下几种:
- minimum、maximum:设置输入范围的最小值和最大值
- singleStep:单步长
- pageStep:在Slider上输入焦点,按PgUp和PgDn键时变化的值
- value:组件的当前值,拖动滑块时会自动改变其值,并且限定在maximum和minimum之间
- sliderPosition:滑块的位置
- tracking:如果tracking=true,sliderPosition就等于value,如果改变value,则sliderPositon也将改变
- orientation:Slider的方向,之后水平和垂直两个选项
- intertedAppeaerance:显示的方向是否为反向,如果其值为false,则Slider的数值自左向右增大,反之增大方向相反
- invertedControls:方向按键控制
QSlider的专有属性有两个:
- tickPosition:标尺刻度的显示位置(NoTicks:不显示刻度、TicksBothSides:两边都有刻度、TicksAbove:标尺上方显示刻度、TicksBelow:标尺下方显示刻度、TicksLeft标尺左侧显示刻度、TicksRight标尺右侧显示刻度)
- tickInterval:标尺刻度的间隔值,若设置为0,则自动选择singleStep和pageStep之间自动选择
2.QScrollBar
- QScrollBar是从QAbstractSlider继承来的,只有其基本属性,没有专属属性
3.QDial
QDial是仪表盘式的组件,通过旋转表盘获取输入值,其特有属性如下:
- ontchesVisible:表盘的小刻度是否可见
- notchTarget:表盘刻度间的间隔像素值
4.QProgressBar
QProgessBar的父类是Widget,一般用于进度条显示,常见属性如下:
- minimum、maximum:最大值和最小值
- vlaue:当前值
- textVisible:是否显示文字,文字一般为百分比,用以表示进度
- orientation:可以设置为水平或垂直方向
- format:文字显示的格式,默认为%p%(%p%、%v、%m分别为显示百分比、显示当前值和显示总步数)
5.QLCDNumber
QLCDNumber是模拟LCD显示数字的组件,可以显示整数或小数,但是就像真正的LCD一样,需要设置显示数字的个数
其主要属性如下:
- digiitCount:显示的数的个数,如果有小数点,也算一位
- smallDecimalPoint:是否有小数点
- mode:数字的进制
- value:返回显示值,浮点数,若设置为显示整数,则需要设置为intValue
实例代码的实现
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的小刻度可见
}