Qt 是一個(gè)跨平臺(tái)C++圖形界面開發(fā)庫(kù),利用Qt可以快速開發(fā)跨平臺(tái)窗體應(yīng)用程序,在Qt中我們可以通過拖拽的方式將不同組件放到指定的位置,實(shí)現(xiàn)圖形化開發(fā)極大的方便了開發(fā)效率,本章將重點(diǎn)介紹Slider
滑塊條組件的常用方法及靈活運(yùn)用。
當(dāng)涉及到C++ Qt開發(fā)中的Slider
滑塊條組件時(shí),你可能會(huì)用到QSlider
類。QSlider
是一個(gè)用于選擇整數(shù)值的控件,常用于調(diào)整范圍內(nèi)的數(shù)值,如音量、亮度等。在水平方向上的Slider
通常被稱為水平滑塊(Horizontal Slider),而在垂直方向上的Slider被稱為垂直滑塊(Vertical Slider)。
水平滑塊(Horizontal Slider)特點(diǎn)
- 方向: 在水平軸上移動(dòng),允許用戶通過拖動(dòng)滑塊來(lái)選擇數(shù)值。
- 應(yīng)用場(chǎng)景: 適用于需要在水平方向上進(jìn)行范圍選擇的情況,比如調(diào)整音量、進(jìn)度等。
垂直滑塊(Vertical Slider)特點(diǎn)
- 方向: 在垂直軸上移動(dòng),允許用戶通過拖動(dòng)滑塊來(lái)選擇數(shù)值。
- 應(yīng)用場(chǎng)景: 適用于需要在垂直方向上進(jìn)行范圍選擇的情況,比如調(diào)整亮度、高度等。
這兩種Slider
都是在用戶界面中提供直觀、交互式的方式來(lái)選擇數(shù)值范圍的優(yōu)秀組件,它們能夠很好地與Qt應(yīng)用程序的其他部分集成。
以下是QSlider
類的一些常用方法的說明和概述,以表格形式進(jìn)行說明:
方法 | 描述 |
---|---|
QSlider(Qt::Orientation, QWidget *parent = nullptr) |
構(gòu)造函數(shù),創(chuàng)建一個(gè)滑塊控件。Qt::Orientation 參數(shù)指定方向(Qt::Horizontal 或Qt::Vertical )。 |
setMinimum(int min) |
設(shè)置滑塊的最小值。 |
setMaximum(int max) |
設(shè)置滑塊的最大值。 |
setSingleStep(int step) |
設(shè)置用戶通過鼠標(biāo)或鍵盤按鍵時(shí),滑塊的單步大小。 |
setPageStep(int step) |
設(shè)置用戶通過點(diǎn)擊滑塊軌道時(shí),滑塊的頁(yè)面步長(zhǎng)。 |
setValue(int value) |
設(shè)置滑塊的當(dāng)前值。 |
value() const |
返回滑塊的當(dāng)前值。 |
setTickInterval(int ti) |
設(shè)置刻度間隔,以便顯示刻度標(biāo)記。 |
setTickPosition(TickPosition position) |
設(shè)置刻度標(biāo)記的位置(NoTicks 、TicksAbove 、TicksBelow 、TicksBothSides )。 |
sliderPosition() const |
返回滑塊的位置,通常與value() 相同,但可能在某些情況下不同(例如,未捕獲的移動(dòng))。 |
setTracking(bool enable) |
啟用/禁用實(shí)時(shí)跟蹤。如果啟用,滑塊在拖動(dòng)時(shí)會(huì)實(shí)時(shí)更新值;禁用時(shí),只有在釋放鼠標(biāo)時(shí)才更新。 |
setTickInterval(int ti) |
設(shè)置刻度間隔,以便顯示刻度標(biāo)記。 |
setTickPosition(TickPosition position) |
設(shè)置刻度標(biāo)記的位置(NoTicks 、TicksAbove 、TicksBelow 、TicksBothSides )。 |
這些方法提供了一些基本的控制和配置選項(xiàng),以便根據(jù)應(yīng)用程序的需求對(duì)QSlider
進(jìn)行調(diào)整。在使用這些方法時(shí),你可以根據(jù)具體的場(chǎng)景和用戶體驗(yàn)需求來(lái)靈活選擇參數(shù)值。
1.1 使用滑塊條事件
如下圖,我們首先創(chuàng)建一個(gè)頁(yè)面UI,在頁(yè)面中左側(cè)放置Vertical Slider
垂直滑塊,底部放置Horizontal Slider
水平滑塊,在水平滑塊的上方放置兩個(gè)lineEdit
組件,在其右側(cè)是兩個(gè)調(diào)節(jié)按鈕。
不論是水平滑塊(Horizontal Slider)條還是垂直滑塊(Vertical Slider)條其都有一個(gè)valueChanged(int)
的槽函數(shù),該信號(hào)用于接收滑塊條的參數(shù)改變情況,通常會(huì)返回到函數(shù)參數(shù)上,此時(shí)只需要在槽函數(shù)內(nèi)對(duì)該參數(shù)進(jìn)行捕捉處理即可,如下代碼,通過捕捉滑塊進(jìn)度并將其輸出到編輯框內(nèi);
// 垂直滑塊(Vertical Slider)條
void MainWindow::on_verticalSlider_valueChanged(int value)
{
// 轉(zhuǎn)換整數(shù)為string
QString myString = QString::number(value);
// 設(shè)置到編輯框內(nèi)
ui->lineEdit->setText(myString);
}
// 水平滑塊(Horizontal Slider)條
void MainWindow::on_horizontalSlider_valueChanged(int value)
{
// 轉(zhuǎn)換整數(shù)為string
QString myString = QString::number(value);
// 設(shè)置到編輯框內(nèi)
ui->lineEdit_2->setText(myString);
}
當(dāng)用戶點(diǎn)擊頁(yè)面中的設(shè)置按鈕時(shí),此時(shí)在后端只需要調(diào)用verticalSlider
或horizontalSlider
滑塊條的setValue
屬性即可實(shí)現(xiàn)對(duì)滑塊條的賦值。
// 設(shè)置垂直滑塊(Vertical Slider)條進(jìn)度
void MainWindow::on_pushButton_clicked()
{
// 字符串轉(zhuǎn)整數(shù)
int x = ui->lineEdit->text().toUInt();
// 設(shè)置數(shù)值到滑塊條
ui->verticalSlider->setValue(x);
}
// 設(shè)置水平滑塊(Horizontal Slider)條
void MainWindow::on_pushButton_2_clicked()
{
int x = ui->lineEdit_2->text().toUInt();
ui->horizontalSlider->setValue(x);
}
運(yùn)行代碼,讀者可自行測(cè)試滑塊條的取值與設(shè)置功能,如下圖所示;
1.2 滑塊條與信號(hào)綁定
滑塊條同樣可以與信號(hào)綁定,在某些時(shí)候我們希望只需要變動(dòng)滑塊條的位置就能實(shí)現(xiàn)特定的功能,此時(shí)就需要對(duì)特定的滑塊條綁定信號(hào)與槽函數(shù),如下圖所示,我們?cè)谧髠?cè)調(diào)色板位置放置四個(gè)滑塊條用于調(diào)整顏色參數(shù),在右側(cè)放置一個(gè)textEdit
編輯框,當(dāng)讀者滑動(dòng)滑塊時(shí)右側(cè)則出現(xiàn)相對(duì)應(yīng)的顏色。
首先,我們以第一個(gè)紅色Horizontal Slider
滑塊條為例,通過右鍵選中轉(zhuǎn)到槽,選擇valueChaged(int)
這個(gè)槽函數(shù),并實(shí)現(xiàn)如下邏輯,在代碼中我們分別讀入四個(gè)進(jìn)度條的默認(rèn)值,并率先設(shè)置到textEdit
組件上,接著就是對(duì)textEdit
底色的設(shè)置。
// 變色槽函數(shù)
void MainWindow::on_SliderRed_valueChanged(int value)
{
Q_UNUSED(value);
QColor color;
int R=ui->SliderRed->value(); // 讀取SliderRed的當(dāng)前值
int G=ui->SliderGreen->value(); // 讀取 SliderGreen 的當(dāng)前值
int B=ui->SliderBlue->value(); // 讀取 SliderBlue 的當(dāng)前值
int alpha=ui->SliderAlpha->value();// 讀取 SliderAlpha 的當(dāng)前值
color.setRgb(R,G,B,alpha); // 使用QColor的setRgb()函數(shù)獲得顏色
QPalette pal=ui->textEdit->palette(); // 獲取textEdit原有的 palette
pal.setColor(QPalette::Base,color); // 設(shè)置palette的基色(即背景色)
ui->textEdit->setPalette(pal); // 設(shè)置為textEdit的palette,改變textEdit的底色
}
接著,我們?cè)?code>MainWindow構(gòu)造函數(shù)上分別綁定三個(gè)信號(hào),將 SliderGreen
,SliderBlue
,SliderAlpha
與第一個(gè)滑塊條 SliderRead
關(guān)聯(lián)起來(lái),并全部綁定到on_SliderRed_valueChanged
槽函數(shù)上,此時(shí)的實(shí)現(xiàn)效果為,當(dāng)其他三個(gè)選擇條數(shù)值改變時(shí),同樣會(huì)觸發(fā)on_SliderRed_valueChanged
槽函數(shù)執(zhí)行變色。
MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), ui(new Ui::MainWindow)
{
ui->setupUi(this);
QObject::connect(ui->SliderRed,SIGNAL(valueChanged(int)),this,SLOT(on_SliderRed_valueChanged(int)));
QObject::connect(ui->SliderGreen,SIGNAL(valueChanged(int)),this,SLOT(on_SliderRed_valueChanged(int)));
QObject::connect(ui->SliderBlue,SIGNAL(valueChanged(int)),this,SLOT(on_SliderRed_valueChanged(int)));
QObject::connect(ui->SliderAlpha,SIGNAL(valueChanged(int)),this,SLOT(on_SliderRed_valueChanged(int)));
}
至此,讀者可自行拖拽滑塊條以獲得不同的配色方案,如下圖所示,這里需要提醒讀者默認(rèn)滑塊條是0-99
而顏色的長(zhǎng)度為0-255
讀者需要自行調(diào)整滑塊條的顏色值,以獲取更多的配色方案。文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-758486.html
文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-758486.html
到了這里,關(guān)于C++ Qt開發(fā):Slider滑塊條組件的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!