QML 进度条不动

Question

我正在使用 QT v5.12.6，在我的应用程序中，我计划在应用程序启动期间使用进度条大约 15 秒。在这 15 秒内操作如下：

1. QML 组件创建。
2. 与服务器的连接。
3. 其他启动操作将在后台运行。

一旦完成所有启动操作，我将隐藏我的启动屏幕，它只是一个矩形，其中包括带有进度条的加载文本。对于这 15 秒，我将增加进度条，但进度条在 10 秒内不会增加/移动。它看起来像是被吊死了，但如果我使用繁忙的指示器，它就会开始旋转。不幸的是，我不能使用繁忙的指示器组件，因为我需要一个进度条的外观和感觉。

我的应用程序在具有低端处理器和极低 RAM 速度的嵌入式平台上运行。我假设这个问题是由于 UI 上的负载，因为正在创建许多组件。

忙碌指示器和进度条之间有什么区别吗？还有关于如何在启动时处理 UI 负载的任何建议？

编辑 1： 添加了一个示例。我已经尽力模仿这个问题。在此示例中，busyindicator 和进度条都卡住了一段时间。但是在嵌入式设备中忙碌指示器工作但不知道如何。运行应用程序后请点击Click Me按钮。

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.3

Window {

    property int pbValue:0
    visible: true
    width: 500
    height: 400
    title: qsTr("Hello World")

    Rectangle{
        id: mySplashScreen
        anchors.fill: parent

        ProgressBar{
            id: pBar
            height: 20
            width: parent.width
            anchors.bottom: parent.bottom
            from:0
            value : pbValue
            to:30
        }

        BusyIndicator{
            anchors.right: parent.right
            running: (pbValue < pBar.to +1)
        }

        Button{
            text: "click me"
            onClicked: {
                //Create component equivalent to my application which has "n"
                //number of components like buttons, combobox, chart view etc.
                //Here just creating the rectangle more number of times.
                for(var i = 0 ; i < 15000 ;i++) //HINT : Increase/decrease the value if problem is not seen
                {
                    var comp = mycomp.createObject(mySplashScreen)
                }
            }
        }
    }

    Timer{
        id:timer
        interval: 250
        running: (pbValue < pBar.to +1)
        onTriggered: {
            pbValue += 1;
        }
    }

    Component{
        id:mycomp
        Rectangle{
            width: 200
            height: 200
            color: "green"
        }
    }
}

Answer 1

将您的对象创建代码以较小的间隔移动到单独的 Timer 中，而不是一次创建所有对象，而是每 25 MS 一次创建 50 个对象。

这将允许主事件循环在加载时处理其他事情，例如繁忙指示器的动画。

这是实现此功能的一种方法

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.3

Window {

    property int pbValue: 0
    visible: true
    width: 500
    height: 400
    title: qsTr("Hello World")

    Rectangle {
        id: mySplashScreen
        anchors.fill: parent

        ProgressBar {
             // changed handling of progress bar
            id: pBar
            height: 20
            width: parent.width
            anchors.bottom: parent.bottom
            from: 0
            value: compList.length // bind this value 
            to: 15000
        }

        BusyIndicator {
            anchors.right: parent.right
            running: (pbValue < pBar.to + 1)
        }

        Button {
            text: "click me"
            onClicked: {

                timer.running = true
            }
        }
    }

    property var compList: [] // created property to store all created components to track what has been done
    Timer {
        id: timer

        interval: 25
        running: false
        repeat: true
        onTriggered: {
            
            for (var i = 0; i < 50; i++) {
                var comp = mycomp.createObject(mySplashScreen) // moved component into timer
                compList.push(comp) // added component to huge list of components for tracking
            }

            pbValue = compList.length
            if ((pbValue >= 15000)) {
                timer.running = false
                console.log("All components completed")
            }
        }
    }

    Component {
        id: mycomp
        Rectangle {
            width: 200
            height: 200
            color: "green"
        }
    }
}