BlinCT
BlinCTJan. 22, 2021, 8:12 a.m.

Правильное расположение элементов в ListView

Всем привет.
Столкнулся с такой задачкой, имеется модель с данными.

ListView
{
  id: tableView

  anchors.top: rowHeader.bottom
  anchors.left: parent.left
  anchors.right: parent.right
  anchors.bottom: parent.bottom

  flickableDirection: TableView.VerticalFlick

  clip: true
  model: root.model

  delegate: Rectangle
  {
    id: rect
    clip: true

    implicitWidth: 543
    implicitHeight: 22
    border.width: 1
    color: "red"

    Repeater
    {
      id: celsRepeater

      model: root.model.columnCount()

      Rectangle
      {
        id: rextText

        border.color: "blue"
        width: root.model.getSizeLongString(index)
        height: 15

        Text
        {
          width: 50

          height: 35

          anchors.fill: parent

          text: root.model.display
        }
      }
    }
  }

Метод columnCount() это invocable из С++ части передающий нужное колличество столбцов(то что должно в репиторе дать понять о колличестве элементов).
Но у меня создается такой трешь

В данной модели у меня 2 столбца, а поулчается вот что...
И еще такая ошибка "Unable to assign [undefined] to QString"
Заранее благодарю)

We recommend hosting TIMEWEB
We recommend hosting TIMEWEB
Stable hosting, on which the social network EVILEG is located. For projects on Django we recommend VDS hosting.

Do you like it? Share on social networks!

19
Алексей Внуков
  • Jan. 22, 2021, 8:39 a.m.
  • (edited)

добрый, а можно минимальный проект для эксперемента? еслитам что-то важное - можете в личку

    BlinCT
    • Jan. 22, 2021, 9:09 a.m.

    Вот так должно быглядеть в конечном итоге.

    Как видите тут строка в которой есть 2 колонки с данными.

      BlinCT
      • Jan. 22, 2021, 9:10 a.m.

      Минимальный не получится, потому что данные формируются из драйвера диска, потом там формируются обьекты, кидается все в модель)
      Кароче это просто так не вытащить)

        Алексей Внуков
        • Jan. 22, 2021, 9:14 a.m.
        • (edited)

        смысл я понял по коду, просто нет сейчас времени писать тест, чтоб поковырять где что не так, возможно у вас косяк в самой модели. поэтому и говорю что мнимальный код запустить посмотреть. мне нужна только модель c парой строк данных, qml c листом и их связка

          BlinCT
          • Jan. 22, 2021, 9:17 a.m.

          Я могу скинуть код самой модели, но она без данных будет

            Алексей Внуков
            • Jan. 22, 2021, 9:18 a.m.

            давайте так, я чет придумаю

              Алексей Внуков
              • Jan. 22, 2021, 9:22 a.m.
              • (edited)

              я так понимаю. принцип такой, нужные данные помещаются в обьект класса, потом все обьекты класса помещаются в модель, которая уже после выводится в qml list?
              у меня есть проект где таким образом данные выводятся в лист только в виде тасков для менеджера. тогда только нужно настроить корректное отображение, а так будет +- код похожий, могу скинуть если интересно

                BlinCT
                • Jan. 22, 2021, 9:25 a.m.

                Ну давайте если можете, мне главное qml файлик. Мне кажется что я тут в обработке что то не то делаю. Или что то не доделал.

                  Алексей Внуков
                  • Jan. 22, 2021, 9:26 a.m.
                  • (edited)

                  я бы поставил что скорее всего проблема qml вместе с моделью

                    Алексей Внуков
                    • Jan. 22, 2021, 10:13 a.m.
                    • (edited)

                    если чисто qml:

                    import QtQuick 2.0
                    import QtQuick.Controls 2.12
                    import QtQuick.Window 2.13
                    import QtGraphicalEffects 1.15
                    
                    Window{
                        width: 640
                        height: 480
                        visible: true
                    
                    
                        Rectangle
                        {
                            id: rectangle
                            anchors.fill: parent
                            color: "#F0F2F5"
                        Flickable
                        {
                            clip: true
                            anchors.fill: parent
                            contentWidth: 1356
                    
                            ScrollBar.vertical: ScrollBar
                            {
                                width:5
                            }
                            ScrollBar.horizontal: ScrollBar
                            {
                                width:5
                            }
                    
                            property int c1: 0
                            property int c2: 0
                            property int c3: 0
                            property int c4: 0
                    
                            Component.onCompleted:
                            {
                    
                                red_model.append({color_l:"#E91E63", img_h: 1,head:"some text", head_b:"some text",l_body:"some text",img_c:"#F54E67", l_date:"01 июля", l_stage: "some text",h_col:"#F54E67"})
                                red_model.append({color_l:"#9C27B0", img_h: 0,head:"some text", head_b:"some text",l_body:"some text",img_c:"#F54E67", l_date:"01 июля", l_stage: "some text",h_col:"#F54E67"})
                            }
                    
                            Rectangle
                            {
                                id:rec1
                                radius: 3
                                height: 50
                                anchors.left: parent.left
                                anchors.leftMargin: 28
                                anchors.top: parent.top
                                anchors.topMargin: 27
                                width: 310
                                clip: true
                    
                                layer.enabled: true
                                        layer.effect: OpacityMask {
                                            maskSource: Item {
                                                width: rec1.width
                                                height: rec1.height
                                                Rectangle {
                                                    anchors.centerIn: parent
                                                    width: rec1.width
                                                    height:rec1.height 
                                                    radius: 3
                                                }
                                            }
                                        }
                    
                                Rectangle
                                {
                                    id:r1
                                    anchors.top: parent.top
                                    anchors.left: parent.left
                                    anchors.right: parent.right
                                    color: "#F54E67"
                                    height: 3
                                }
                    
                                Label
                                {
                                    id:lbl_col1
                                    anchors.top: r1.bottom
                                    anchors.topMargin: 7
                                    anchors.left: parent.left
                                    anchors.leftMargin: 15
                                    text:  "вид"
                                    font.pixelSize: 14
                                }
                    
                                Label
                                {
                                    anchors.top: lbl_col1.bottom
                                    anchors.topMargin: 3
                                    anchors.left: parent.left
                                    anchors.leftMargin: 15
                                    text:"Элементов: " + red_model.count
                                }
                            }
                    
                            Rectangle {
                                anchors.top: rec1.bottom
                                anchors.topMargin: 10
                                anchors.horizontalCenter: rec1.horizontalCenter
                                width: 23
                                height: 3
                                color: "#F0F2F5"
                                Row
                                {
                                    spacing: 7
                                Rectangle
                                {
                                    color: "#CBD0D6"
                                    height: 3
                                    width: 3
                                }
                                Rectangle
                                {
                                    color: "#CBD0D6"
                                    height: 3
                                    width: 3
                                }
                                Rectangle
                                {
                                    color: "#CBD0D6"
                                    height: 3
                                    width: 3
                                }
                                }
                            }
                    
                            ListModel
                            {
                                id:red_model
                            }
                    
                            ListView
                            {
                                id:red_list
                                anchors.left: rec1.left
                                anchors.right: rec1.right
                                anchors.top: rec1.bottom
                                anchors.topMargin: 20
                                anchors.bottom: parent.bottom
                                clip: true
                                model: red_model
                                spacing:10
                                delegate: Task
                                {
                                    id:task
                                    wid: rec1.width
                                    img_header_color:h_col
                                    imgc_lock:img_c
                                    lbl_color:color_l
                                    lbl_head: head
                                    head_body: head_b
                                    lbl_body: l_body
                                    lbl_date: l_date
                                    img_header: img_h
                                    lbl_stage: l_stage
                                }
                            }
                        }
                    }
                    }
                    
                    

                    а сам делегат у меня в отдельном файле Task.qml

                    import QtQuick 2.0
                    import QtQuick.Controls 2.12
                    
                    Rectangle {
                    
                    id: rectangle
                        width: wid
                        height:  img_h.y+lbl_d.y+13+ lbl.contentHeight
                        property int wid:310
                        property string lbl_color: ""
                        property int img_header: 0
                        property string img_header_color: "black"//цвет заглавия
                        property string lbl_date: ""
                        property string lbl_body: ""
                        property string lbl_head: ""
                        property string imgc_lock: "black"//цвет часов
                        property string lbl_stage: ""
                        property string head_body: ""
                        //property int test: 0
                    
                        function onChar(i)
                        {
                                return "@"
                        }
                    
                        color: "#FFFFFF"
                    
                        Label {
                            id: img_h
                            width: 16
                            height: 16
                            anchors.left: parent.left
                            anchors.top:parent.top
                            anchors.leftMargin: 10
                            anchors.topMargin: 11.33
                            font.pixelSize: 16
                            color: img_header_color
                            text:onChar(img_header)//img_header
                    
                        }
                    
                    
                        Label
                        {
                            id:lbl_h
                            text:"<font color=\"#000000\">"+lbl_head+"</font>"+" "+"<font color=\"#607D8B\">"+head_body+"</font>"
                            anchors.left: img_h.right
                            anchors.top:parent.top
                            anchors.leftMargin: 10
                            anchors.topMargin: 10
                            anchors.right: parent.right
                            anchors.rightMargin: 10
                            font.pixelSize: 13
                            wrapMode: Text.WordWrap
                            verticalAlignment: Text.AlignVCenter
                            color: "#26292B"
                    
                        }
                    
                        Rectangle
                        {
                            id: rec_separator
                            anchors.left: parent.left
                            anchors.top:lbl_h.bottom
                            anchors.leftMargin: 10
                            anchors.topMargin: 7
                            anchors.right: parent.right
                            anchors.rightMargin: 10
                            height: 1
                            color: "#E6E9Ef"
                        }
                    
                        Label
                        {
                            id:lbl_b
                            text:lbl_body //+ img_h.x+img_clock.x+33
                            anchors.left: parent.left
                            anchors.top:rec_separator.bottom
                            anchors.leftMargin: 10
                            anchors.topMargin: 7
                            anchors.right: parent.right
                            anchors.rightMargin: 10
                            font.pixelSize: 14
                            wrapMode: Text.WordWrap
                            verticalAlignment: Text.AlignVCenter
                             color: "#26292B"
                        }
                    
                        Label
                        {
                            id: img_clock
                            width: 13
                            height: 13
                            anchors.left: parent.left
                            anchors.verticalCenter: lbl_d.verticalCenter
                            anchors.leftMargin: 10
                            font.pixelSize: 13
                            text: "\ue007"
                            color:imgc_lock
                        }
                    
                        Label
                        {
                            id:lbl_d
                            anchors.left: img_clock.right
                            anchors.leftMargin: 5
                            anchors.top:lbl_b.bottom
                            anchors.bottom: parent.bottom
                            anchors.topMargin: 9
                            anchors.bottomMargin: 10
                            text:lbl_date
                            color: "#607D8B"
                            verticalAlignment: Text.AlignVCenter
                            font.pixelSize: 12
                        }
                    
                    
                        Rectangle
                        {
                            id:lbl_st
                            width:wid/2
                            anchors.right: parent.right
                            height: lbl.contentHeight+6
                            anchors.verticalCenter: lbl_d.verticalCenter
                            anchors.rightMargin: 10
                            radius:3
                            color:lbl_color
                            Text
                            {
                                id:lbl
                                anchors.verticalCenter: lbl_st.verticalCenter
                                anchors.left: parent.left
                                anchors.leftMargin: 6
                                anchors.right: parent.right
                                anchors.rightMargin: 6
                                color: "#FFFFFF"
                                text:lbl_stage
                                horizontalAlignment: Text.AlignHCenter
                                font.pixelSize: 12
                                verticalAlignment: Text.AlignVCenter
                                elide: Text.ElideRight
                              //  wrapMode: Text.WordWrap
                            }
                        }
                    }
                    
                    

                    код немного упростил, чтоб запускался без дополнительных трудностей

                      Алексей Внуков
                      • Jan. 22, 2021, 10:17 a.m.

                      в оригинале у меня модель qml заменяется соделью из С++, но принцип заполнения таска такой же

                        Алексей Внуков
                        • Jan. 22, 2021, 10:21 a.m.

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

                          Алексей Внуков
                          • Jan. 22, 2021, 10:38 a.m.

                          по вашему коду:
                          И еще такая ошибка "Unable to assign [undefined] to QString" - происходит когда в qml list передаются не существующие поля модели
                          columnCount() - если я правильно понял логику работы модели, то это поле нужно хранить в обьекте класса данных, чтоб потом через роль обратиться к нему, но это если у вас в каждом делегате будет разное колличество репитеров, если каждый раз одинаково то можно в моделе указывать, но у вас там что-то не так с реализацией

                            Алексей Внуков
                            • Jan. 22, 2021, 10:55 a.m.
                            • (edited)

                            немного поправив ваш делегат я получил такой результат

                              BlinCT
                              • Jan. 23, 2021, 6:33 a.m.

                              По поводу данной функции columnCount(), этот метод их модели возвращает колличество стобцов. Я просто из него сделал инвокбл метод.
                              И Я думал что для репитера это должно указывать столько он должен создать ячеек.
                              Наверное в этом и ошибка

                                BlinCT
                                • Jan. 23, 2021, 6:54 a.m.

                                Сейчас перепроверил сам метод, и он правильнео колличество обьектов передает. Значит проблема не в этом.

                                  BlinCT
                                  • Jan. 23, 2021, 9:25 a.m.

                                  Вся проблема в тмо что у меня репитор который должен правильно создавать по индексам эти ячейки. В случаи данной момедли 2 столбца а после засунуть туда правильный текст из модели. Вот тут какой то недочет у меня

                                    Алексей Внуков
                                    • Jan. 24, 2021, 11:34 a.m.

                                    а обязательно создавть через репитер? если с ним не получается, то можно в делегат просто квадрат с 2-я ячеками в них соответствующий текст, в модель обьекты так тоже писать (будет как мап - ключ-значение), и потом так же выносить в таблицу - получится левая колонка постоянная(ключи), а правая будет подтягиваться данными из системы

                                      BlinCT
                                      • Jan. 29, 2021, 12:21 p.m.
                                      • The answer was marked as a solution.

                                      В общем во сути ошибка была найдена) и она оказалась достаточно глупой с моей стороны, если я в листе создаю сроку с 2 колонками то наджо было делегат делать Row, а у меня там Rectangle)

                                        Comments

                                        Only authorized users can post comments.
                                        Please, Log in or Sign up
                                        B

                                        C++ - Test 002. Constants

                                        • Result:16points,
                                        • Rating points-10
                                        B

                                        C++ - Test 001. The first program and data types

                                        • Result:46points,
                                        • Rating points-6
                                        FL

                                        C++ - Test 006. Enumerations

                                        • Result:80points,
                                        • Rating points4
                                        Last comments
                                        k
                                        kmssrFeb. 9, 2024, 5:43 a.m.
                                        Qt Linux - Lesson 001. Autorun Qt application under Linux как сделать автозапуск для флэтпака, который не даёт создавать файлы в ~/.config - вот это вопрос ))
                                        Qt WinAPI - Lesson 007. Working with ICMP Ping in Qt Без строки #include <QRegularExpressionValidator> в заголовочном файле не работает валидатор.
                                        EVA
                                        EVADec. 25, 2023, 9:30 p.m.
                                        Boost - static linking in CMake project under Windows Ошибка LNK1104 часто возникает, когда компоновщик не может найти или открыть файл библиотеки. В вашем случае, это файл libboost_locale-vc142-mt-gd-x64-1_74.lib из библиотеки Boost для C+…
                                        J
                                        JonnyJoDec. 25, 2023, 7:38 p.m.
                                        Boost - static linking in CMake project under Windows Сделал всё по-как у вас, но выдаёт ошибку [build] LINK : fatal error LNK1104: не удается открыть файл "libboost_locale-vc142-mt-gd-x64-1_74.lib" Хоть убей, не могу понять в чём дел…
                                        G
                                        GvozdikDec. 19, 2023, 8:01 a.m.
                                        Qt/C++ - Lesson 056. Connecting the Boost library in Qt for MinGW and MSVC compilers Для решения твой проблемы добавь в файл .pro строчку "LIBS += -lws2_32" она решит проблему , лично мне помогло.
                                        Now discuss on the forum
                                        AC
                                        Alexandru CodreanuJan. 19, 2024, 10:57 p.m.
                                        QML Обнулить значения SpinBox Доброго времени суток, не могу разобраться с обнулением значение SpinBox находящего в делегате. import QtQuickimport QtQuick.ControlsWindow { width: 640 height: 480 visible: tr…
                                        BlinCT
                                        BlinCTDec. 27, 2023, 7:57 p.m.
                                        Растягивать Image на парент по высоте Ну и само собою дял включения scrollbar надо чтобы был Flickable. Так что выходит как то так Flickable{ id: root anchors.fill: parent clip: true property url linkFile p…
                                        Дмитрий
                                        ДмитрийJan. 10, 2024, 3:18 p.m.
                                        Qt Creator загружает всю оперативную память Проблема решена. Удалось разобраться с помощью утилиты strace. Запустил ее: strace ./qtcreator Начал выводиться весь лог работы креатора. В один момент он начал считывать фай…
                                        Evgenii Legotckoi
                                        Evgenii LegotckoiDec. 12, 2023, 5:48 p.m.
                                        Побуквенное сравнение двух строк Добрый день. Там случайно не высылается этот сигнал textChanged ещё и при форматировани текста? Если решиать в лоб, то можно просто отключать сигнал/слотовое соединение внутри слота и …

                                        Follow us in social networks