Qt/QML学习-ProgressBar

QML学习

main.qml

复制代码
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15

Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")

    ProgressBar {
        id: progressBar
        width: 300
        height: 20
        anchors.centerIn: parent
        from: 0
        to: 100
        value: 50
        // 显示进度过程动画,不显示具体进度
        indeterminate: checkBox.checked
        background: Rectangle {
            color: "yellow"
            border.width: 1
        }
        contentItem: Item {
            // 利用from、to、value绘制进度
            Rectangle {
                id: rect
                width: parent.width / 20
                height: parent.height - 10
                y: 5
                color: "red"
                property real indeterminateX: 0
                x: progressBar.indeterminate? indeterminateX
                   : parent.width
                   / (progressBar.to - progressBar.from)
                   * (progressBar.value - progressBar.from)
                   - width / 2
                Timer {
                    interval: 10
                    repeat: true
                    running: progressBar.indeterminate
                    onTriggered: {
                        rect.indeterminateX += progressBar.width / 100
                        if (rect.indeterminateX >= (progressBar.width - rect.width)) {
                            rect.indeterminateX = 0
                        }
                    }
                }
            }
        }
    }

    CheckBox {
        id: checkBox
        anchors.bottom: progressBar.top
        anchors.left: progressBar.left
    }

    TextInput {
        id: textInput
        anchors.bottom: progressBar.top
        anchors.left: checkBox.right
        font.pointSize: 30
        onEditingFinished: {
            progressBar.value = text
        }
    }

    Component.onCompleted: {
        textInput.text = progressBar.value
    }
}

演示

视频讲解

相关推荐
云上艺旅8 小时前
K8S学习之基础七十四:部署在线书店bookinfo
学习·云原生·容器·kubernetes
CoderIsArt8 小时前
QT中已知4个坐标位置求倾斜平面与倾斜角度
qt·平面
你觉得2058 小时前
哈尔滨工业大学DeepSeek公开课:探索大模型原理、技术与应用从GPT到DeepSeek|附视频与讲义下载方法
大数据·人工智能·python·gpt·学习·机器学习·aigc
A旧城以西9 小时前
数据结构(JAVA)单向,双向链表
java·开发语言·数据结构·学习·链表·intellij-idea·idea
无所谓จุ๊บ9 小时前
VTK知识学习(50)- 交互与Widget(一)
学习·vtk
FAREWELL000759 小时前
C#核心学习(七)面向对象--封装(6)C#中的拓展方法与运算符重载: 让代码更“聪明”的魔法
学习·c#·面向对象·运算符重载·oop·拓展方法
__lost9 小时前
Pysides6 Python3.10 Qt 画一个时钟
python·qt
吴梓穆10 小时前
UE5学习笔记 FPS游戏制作38 继承标准UI
笔记·学习·ue5
Three~stone10 小时前
MySQL学习集--DDL
数据库·sql·学习
胡斌附体10 小时前
qt socket编程正确重启tcpServer的姿势
开发语言·c++·qt·socket编程