QT常用界面设计组件——其它数值输入和显示组件

实例功能

QSlider:滑动条,通过滑动设置数值,可用于数值输入。(此实例使用四个滑动条输入红、绿、蓝三色的Alpha值,然后合成颜色,作为一个QTextEdit组件的底色)

QScrollBar:卷滚条,与QSlider功能类似,还可以用于卷滚区域

QProgressBar:进度条,一般用于显示任务进度,可用于数值的百分比显示(实例程序中滑动一个Slider,获取其值并更新ScrollBar和ProgressBar)

QDial:表盘式数值输入组件,通过转动表针获取输入值

QLCDNumber:模仿LCD数字的显示组件,可以显示整数或浮点数,显示整数可以使用不同进制数值(实例程序中通过转动表盘,获得的值显示在LCD中)

QT常用界面设计组件——其它数值输入和显示组件_第1张图片

各组件的主要功能和属性

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的小刻度可见
}

 

 

你可能感兴趣的:(Qt,QT,QSlider,QProgessBar,QDial)