QML: навигация между страницами qml с точки зрения дизайна

Question

QML: навигация между страницами qml с точки зрения дизайна

Нам нужно разработать проект QtQuick, где у нас около 100 экранов.

Я попытался сделать демонстрационный проект для навигации, который имеет три экрана при нажатии кнопки. Я использовал понятия «состояния» в навигации между страницами. Первоначально я пытался сделать то же самое, используя «Загрузчик», но загрузчик не смог сохранить предыдущее состояние страницы, он перезагружал всю страницу во время навигации.

Ниже приведен фрагмент кода файла main.qml.

// import QtQuick 1.0 // to target S60 5th Edition or Maemo 5
import QtQuick 1.1

Rectangle {
id:main_rectangle
width: 360
height: 640

Page1{
id:page1
}

Page2{
id:page2
}

Page3{
id:page3
}

states: [
State {

name: "page2"
PropertyChanges { target: page3; visible:false; }
PropertyChanges { target: page1; visible:false; }
PropertyChanges { target: page2; visible:true; }
},
State {
name: "page1"PropertyChanges { target: page3; visible:false; }
PropertyChanges { target: page2; visible:false; }
PropertyChanges { target: page1; visible:true; }
},

State {
name: "page3"PropertyChanges { target: page1; visible:false; }
PropertyChanges { target: page2; visible:false; }
PropertyChanges { target: page3; visible:true; }
}

]

}

Это хорошо работает с небольшим POC с тремя экранами, но невозможно определить состояния для 100 экранов.

С точки зрения проектирования мы пришли к выводу, что для создания контроллера C ++ мы контролируем состояния, видимость различных страниц.

Нужны предложения, как реализовать логику ‘State’ в C ++.

8

c++qml qt qt-quick

Решение

Другие решения

Я предлагаю использовать StackView от Qt Quick Components. Вот это его документация.

1

Источник

Accepted Answer

Вот простейшее решение в простом QML, использующее настраиваемый список страниц (например, модель) + элементы Repeater + Loader, чтобы не загружать все при запуске (отложенное создание экземпляров) и не уничтожать страницу после ее скрытия (чтобы не приходилось перезагружать ее если вернемся к этому)

import QtQuick 1.1

Rectangle {
id: main_rectangle;
width: 360;
height: 640;

// Put the name of the QML files containing your pages (without the '.qml')
property variant pagesList  : [
"Page1",
"Page2",
"Page3",
"Page4",
"Page5"];

// Set this property to another file name to change page
property string  currentPage : "Page1";

Repeater {
model: pagesList;
delegate: Loader {
active: false;
asynchronous: true;
anchors.fill: parent;
visible: (currentPage === modelData);
source: "%1.qml".arg(modelData)
onVisibleChanged:      { loadIfNotLoaded(); }
Component.onCompleted: { loadIfNotLoaded(); }

function loadIfNotLoaded () {
// to load the file at first show
if (visible && !active) {
active = true;
}
}
}
}
}

Надеюсь, поможет !

6