alex_lip
28 июня 2017 г. 12:46

от QT к QML

Добрый день.
Большое спасибо вам за ваши уроки.  Можете смело издавать книгу "100 первых уроков для QT/QML".
Теперь вопрос. Я сделал на QT разбор JSON файла (который я получаю с сайта при помощи networkadapter). Получил таблицу. На QT все работает. Теперь хочу эту таблицу показать в слое QML.
Благодаря уроку сигналы и слоты в QML передал в слой QML  одну ячейку из этой таблицы в текстовое поле. Все хорошо.
Но теперь "завис" никак не пойму как мне на основе разобранного JSON файла создать модель и передать ее на слой QML например в ListView. Количество полей мне заранее известно. Урок с примером Передача данных из QSqlQueryModel в Qml TableView для меня оказался слишком сложным. Можете на каком-то более простом примере пояснить?

3

Вам это нравится? Поделитесь в социальных сетях!

6
alex_lip
  • 29 июня 2017 г. 16:22
  • Ответ был помечен как решение.

Сам себе напишу ответ. Может быть кому-то пригодится.. Все делается также через контекст.
QT

int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
    QGuiApplication app(argc, argv);
 
    QStringList dataList;
    dataList.append("Item 1");
    dataList.append("Item 2");
    dataList.append("Item 3");
    dataList.append("Item 4");
 
    QQmlApplicationEngine engine;
 
    AppCore appCore;
    QQmlContext *context=engine.rootContext();
    context->setContextProperty("appCore", &appCore);
 
    context->setContextProperty("myModel", QVariant::fromValue(dataList));
 
    engine.load(QUrl(QLatin1String("qrc:/main.qml")));
 
    return app.exec();
}


QML

 ListView {
                width: 100; height: 100
 
                model: myModel
                delegate: Rectangle {
                    height: 25
                    width: 100
                    Text { text: modelData }
                }
    alex_lip
    • 29 июня 2017 г. 16:25

    Единственно что непонятно - какого хрена в QtQuick.Controls 2.0 нет объекта TableView (в 1.4 - он есть!)
    Как мне таблицу рисовать - непонятно...

      Evgenii Legotckoi
      • 1 июля 2017 г. 0:04

      Добрый день.

      Угораздило вас спросить, пока я был в переезде в другую страну.

      Вы молодец, нормальное решение.

      Что касается TableView, то я тоже был огорчён, когда увидел, что TableView отсутствует. Выкрутиться можно несколько иначе. Сделать Delegate для ListView, который будет формировать строку и оформление этой строки. Например вот в статье есть delegate для ListView в QML. Полагаю, что возможность рисования своего делегата для строки в ListView и сподвигло разработчиков не заморачиваться с отдельным TableView . Хотя это и прискорбно.

      Делегат подчиняется всем правилам вёрстки в QML, так что это просто дополнительный графический компонент, который нужно сверстать.

        Это возможно удивит, а может и нет))) так тоже работает:

        1. Text {
        2. id: page_text
        3. anchors.fill: parent
        4. textFormat: Text.RichText
        5. text: "<table border=\"1\">
        6. <caption>Таблица размеров обуви</caption>
        7. <tr>
        8. <th>Россия</th>
        9. <th>Великобритания</th>
        10. <th>Европа</th>
        11. <th>Длина ступни, см</th>
        12. </tr>
        13. <tr><td>34,5</td><td>3,5</td><td>36</td><td>23</td></tr>
        14. <tr><td>35,5</td><td>4</td><td>36⅔</td><td>23–23,5</td></tr>
        15. <tr><td>36</td><td>4,5</td><td>37⅓</td><td>23,5</td></tr>
        16. <tr><td>36,5</td><td>5</td><td>38</td><td>24</td></tr>
        17. <tr><td>37</td><td>5,5</td><td>38⅔</td><td>24,5</td></tr>
        18. <tr><td>38</td><td>6</td><td>39⅓</td><td>25</td></tr>
        19. <tr><td>38,5</td><td>6,5</td><td>40</td><td>25,5</td></tr>
        20. <tr><td>39</td><td>7</td><td>40⅔</td><td>25,5–26</td></tr>
        21. <tr><td>40</td><td>7,5</td><td>41⅓</td><td>26</td></tr>
        22. <tr><td>40,5</td><td>8</td><td>42</td><td>26,5</td></tr>
        23. <tr><td>41</td><td>8,5</td><td>42⅔</td><td>27</td></tr>
        24. <tr><td>42</td><td>9</td><td>43⅓</td><td>27,5</td></tr>
        25. <tr><td>43</td><td>9,5</td><td>44</td><td>28</td></tr>
        26. <tr><td>43,5</td><td>10</td><td>44⅔</td><td>28–28,5</td></tr>
        27. <tr><td>44</td><td>10,5</td><td>45⅓</td><td>28,5–29</td></tr>
        28. <tr><td>44,5</td><td>11</td><td>46</td><td>29</td></tr>
        29. <tr><td>45</td><td>11,5</td><td>46⅔</td><td>29,5</td></tr>
        30. <tr><td>46</td><td>12</td><td>47⅓</td><td>30</td></tr>
        31. <tr><td>46,5</td><td>12,5</td><td>48</td><td>30,5</td></tr>
        32. <tr><td>47</td><td>13</td><td>48⅔</td><td>31</td></tr>
        33. <tr><td>48</td><td>13,5</td><td>49⅓</td><td>31,5</td></tr>
        34. </table>"
        35. }

          Да, работает. Но это решение подходит в основном для отоюражения статической информацию, которая не меняется. А TableView или ListView позволяют работать с моделями данных и редактировать их, при соответствующей логике в программе.

            ВА
            • 27 июня 2019 г. 14:53
            • (ред.)

            Да это так... просто какого было мое удивление, хоть и поддерживается html на уровне 4-ки можно не тянуть тяжеловесный WebEngine в ряде случаев, например для печати данных в табличном виде, ведь таблицы бывают сложными, html в этом случае палочка выручалочка, единственно не смог повернуть текст в ячейке на 90 градусов:(
            Может както и можно, буду рад узнать.
            Такой вариант не канает:

            1. <p style="transform: rotate(-90deg);">Техн.<br>треб.</p>
            • может еще актуально, нашел на гитхабе на 2-х контролах Таблицу:
              https://github.com/valeksan/QMLTable
              Правда не успел опробывать, отпишетесь если понравится, там и мои контролы есть, на моей странице:)

              Комментарии

              Только авторизованные пользователи могут публиковать комментарии.
              Пожалуйста, авторизуйтесь или зарегистрируйтесь