如何延迟 qml 中 Loader 元素内容的可见性？

Question

我正在使用 Loader 元素以异步方式加载主要内容 qml，并准备好它，同时在 window 上主动显示另一个 qml。

我正在尝试在 2 秒的计时器到期时显示 loader_two 内容。但是 loader_two 一旦加载就可见，甚至在计时器到期之前。我如何实现这一目标？

这是我的代码。

    Loader{
    id:loader_one
    active: true
    visible: true
    anchors.fill: parent
    asynchronous: true
    source: "Start.qml"
    onLoaded: {
        loader_two.active = true
        show_content_timer.start()
    }
}

Loader{
    id:loader_two
    active:false
    anchors.fill: parent
    asynchronous: true
    source: "Main_content.qml"
}
Timer{
    id: show_content_timer
    interval: 2000
    repeat: false
    running: false
    triggeredOnStart: false
    onTriggered:
    {
        console.log("2seconds expired")
        loader_one.source = ""
        loader_one.item.visible = false;
        loader_two.item.visible = true;
    }
}

Answer 1

使用一个组件然后执行 Component.create() 以创建一个将远程加载但在您调用 Component.create()

之前不会显示的项目

Loader {

    id: loader_one
    active: true
    visible: true
    anchors.fill: parent
    asynchronous: true
    source: "Start.qml"
    onLoaded: {
        loader_two.active = true
        show_content_timer.start();
    }
}

Component {
    id: loaderComponent 


    Loader{
        id:loader_two
        active:false
        anchors.fill: parent
        asynchronous: true
        source: "Main_content.qml";
    }

}

Timer {
    id: show_content_timer
    interval: 2000
    repeat: false
    running: false
    triggeredOnStart: false
    onTriggered:
    {
        console.log("2seconds expired")
        loaderComponent.create();
    }

Answer 2

我可以通过将 loader_two 的可见性默认设置为 false 并在我的计时器到期后将其设置为 true 来实现延迟。我通过控制 loader_two.item.visible 属性来尝试相同的操作，但之前没有用。

这是我的最终工作代码。谢谢

Loader{
id:loader_one
active: true
visible: true
anchors.fill: parent
asynchronous: true
source: "Start.qml"
onLoaded: {
    loader_two.active = true
    show_content_timer.start()
}
}

Loader{
id:loader_two
active:false
visible: false
anchors.fill: parent
asynchronous: true
source: "Main_content.qml"
}
Timer{
id: show_content_timer
interval: 2000
repeat: false
running: false
triggeredOnStart: false
onTriggered:
{
    console.log("2seconds expired")
    loader_one.source = ""
    loader_one.item.visible = false;
    loader_two.visible = true;
}
}

如何延迟 qml 中 Loader 元素内容的可见性？

How to delay the visibility of a Loader element content in qml?

qt

loader

qml