Михаиллл
МихаилллШілде 15, 2019, 2:10 Т.Қ.

Трудности с созданием ListView в QML

Добрый день.
Сделал несколько эллементов интерфейса.
Эти эллементы пытаюсь запихнуть в ListView интерфейс плывет, некоторые части не отображаются, а при нажатии снизу вверх ListView обновляется.
Скажите пожалуйста почему так? И как правильно добавлять в ListView? И можно ли Обойтись без ListView , просто размещая эллементы на основном окне, но так, что-бы была возможность их прогручивать?

import QtQuick 2.12
import QtQuick.Controls 2.12

Item {
    id: mainElement
    width: 400
    height: 700

    ListView
    {
        id: listViewFerstWindow
        anchors.right: parent.right
        anchors.rightMargin: 0
        anchors.left: parent.left
        anchors.leftMargin: 0
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 0
        anchors.top: parent.top
        anchors.topMargin: 0
        model: 1

        delegate: Item
        {
            id: itemDelegateFirstWindow

    Rectangle {
        id: rectangle
        height: 19
        color: "#e3ded3"
        anchors.right: parent.right
        anchors.rightMargin: 0
        anchors.left: parent.left
        anchors.leftMargin: 0
        anchors.top: parent.top
        anchors.topMargin: 0

        Text {
            id: element1
            x: 78
            y: 4
            width: 214
            height: 14
            text: qsTr("8 (800) 700 0002 - отдел продаж")
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.verticalCenter: parent.verticalCenter
            font.pixelSize: 12
        }
    }

    Rectangle {
        id: rectangle1
        height: mainElement.height * 0.15
        color: "#ffffff"
        anchors.top: rectangle.bottom
        anchors.topMargin: 0
        anchors.right: parent.right
        anchors.rightMargin: 0
        anchors.left: parent.left
        anchors.leftMargin: 0

        Image {
            id: imageLabel
            width: parent.width * 0.75
            anchors.left: parent.left
            anchors.leftMargin: 0
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 0
            anchors.top: parent.top
            anchors.topMargin: 0
            fillMode: Image.PreserveAspectFit
            source: "qrc:/Images/Images/Xwd9C1BM5QA.jpg"
        }

        Button {
            id: buttonMenu
//            x: 314
//            y: 37
            anchors.left: imageLabel.right
            anchors.right: parent.right
            width: parent.height * 0.5
            height: parent.height * 0.8
            text: qsTr("")
            anchors.rightMargin: parent.height * 0.2
            anchors.leftMargin: parent.height * 0.2
            anchors.verticalCenter: parent.verticalCenter
            background: Rectangle{
                color: "white"
            }

            Image {
                id: image1
                anchors.fill: parent
                fillMode: Image.PreserveAspectFit
                source: "qrc:/Images/Images/menuRed.png"
            }
        }
    }

    Rectangle {
        id: rectangle2
        x: 141
        y: 143
        width: 99
        height: 26
        color: "#db4c4c"
        radius: height * 0.3

        MouseArea {
            id: mouseAreaRassrochka
            anchors.bottomMargin: 0
            anchors.fill: parent

            Text {
                id: element2
                x: 82
                y: parent.height * 0.05
                //width: 5
                height: 7
                text: qsTr("Продаем")
                font.weight: Font.ExtraBold
                font.capitalization: Font.MixedCase
                font.family: "Times New Roman"
                elide: Text.ElideLeft
                color: "white"
                anchors.horizontalCenter: parent.horizontalCenter
                font.pixelSize: parent.height * 0.4
            }

            Text {
                id: element3
                x: 87
                y: parent.height * 0.45
                text: qsTr("в рассрочку!")
                font.weight: Font.ExtraBold
                font.family: "Times New Roman"
                font.capitalization: Font.MixedCase
                color: "white"
                anchors.horizontalCenterOffset: 0
                anchors.horizontalCenter: parent.horizontalCenter
                font.pixelSize: parent.height * 0.4
            }
        }
    }

    Rectangle{
        color: "red"
        width: 200
        height: 200
        y: 650
    }


}
    }



}


Рекомендуем хостинг TIMEWEB
Рекомендуем хостинг TIMEWEB
Стабильный хостинг, на котором располагается социальная сеть EVILEG. Для проектов на Django рекомендуем VDS хостинг.

Ол саған ұнайды ма? Әлеуметтік желілерде бөлісіңіз!

13
Pavel K.
  • Шілде 15, 2019, 2:29 Т.Қ.
  • (өңделген)

например для селфиш ОС есть SilicaFlickable — самый базовый контейнер, который позволяет прокручивать экран
или обрати внимание на VerticalScrollDecorator {}
ну или вот https://doc.qt.io/qt-5.9/qtquickcontrols2-gallery-pages-scrollbarpage-qml.html
делает тоже самое что и SilicaFlickable

//Page {
// id: page

SilicaFlickable {

 }

// }

    Михаиллл
    • Шілде 15, 2019, 2:36 Т.Қ.

    У меня нет селфиш, есть виндовс, на худой конец есть макос и линукс. Но можно ли в виндовсе это сделать?

      Алексей Внуков
      • Шілде 15, 2019, 2:38 Т.Қ.

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

        Михаиллл
        • Шілде 15, 2019, 2:44 Т.Қ.

        Мне нужно что-бы було окно, которое прокручивается по вертикали (т.к. много эллементов интерфейса и они не влезают по вертикали в видимую часть экрана). В него ничего не нужно добавлять и убирать.

          Pavel K.
          • Шілде 15, 2019, 2:46 Т.Қ.
          • (өңделген)

          Скорее всего у вас модель не обьявлена, вот мой пример кода, но раз вам только скроллер нужен поместите все в контейнер Flickable {}

           model: modelVm.newList // newList  возвращает  список обьектов из плюсов
                  delegate: Rectangle{
                      width: parent.width
                      height: childrenRect.height + Theme.paddingMedium * 1.5 // heith like children's
                      color: "transparent"
                      border{ color: "Orange"; width:4}
                      Column{
                          width: parent.width
                          anchors.top: parent.top
                          anchors.left: parent.left
                          anchors.right: parent.right
                          anchors.margins: Theme.paddingMedium
          
                          spacing: Theme.paddingMedium
                          Label{
                              width: parent.width
                              text: "UserId: " + model.modelData.userId
                              wrapMode: Text.WordWrap
                          }
          
                          Label{
                              width: parent.width
                              text: "title: " + model.modelData.title
                              wrapMode: Text.WordWrap
                          }
                          Label{
                              width: parent.width
                              text: "Body: " + model.modelData.body
                              wrapMode: Text.WordWrap
                          }
          
            R
            • Шілде 15, 2019, 2:46 Т.Қ.
            • (өңделген)

            важко розібратись у цьому вашому коді... так наперший погляд не варто писати

                    id: listViewFerstWindow
                    anchors.right: parent.right
                    anchors.rightMargin: 0
                    anchors.left: parent.left
                    anchors.leftMargin: 0
                    anchors.bottom: parent.bottom
                    anchors.bottomMargin: 0
                    anchors.top: parent.top
                    anchors.topMargin: 0
            

            якщо ви хочите заповнити весь простір, достатньо anchors.fill: parent

            і ніде не додано розмір елемента
            delegate: Item
            {
            id: itemDelegateFirstWindow

                    спробуйте дописати         
                    width: parent.width
                    height: 100
            
              Михаиллл
              • Шілде 15, 2019, 2:50 Т.Қ.

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

                  ListView
                  {
                      id: listViewFerstWindow
                      anchors.right: parent.right
                      anchors.rightMargin: 0
                      anchors.left: parent.left
                      anchors.leftMargin: 0
                      anchors.bottom: parent.bottom
                      anchors.bottomMargin: 0
                      anchors.top: parent.top
                      anchors.topMargin: 0
                      model: 1
              
                      delegate: Item
                      {
                          id: itemDelegateFirstWindow
                          anchors.left: parent.left
                          anchors.right: parent.right
                          height: mainWindow1.height
              
                Михаиллл
                • Шілде 15, 2019, 2:55 Т.Қ.

                Может быть еще можно использовать ScrollView? Пробовал все поместить в ScrollView, но экран после этого не прокручивается.

                  Pavel K.
                  • Шілде 15, 2019, 2:56 Т.Қ.

                  советую заглянуть в офиц документацию по Qt https://doc.qt.io/qt-5.9/qtquickcontrols2-gallery-pages-scrollbarpage-qml.html
                  задайте фликабл контейнеру width: Theme.paddingLarge а hight : parent.heigh , где то намудрили скорее всего

                    Pavel K.
                    • Шілде 15, 2019, 3:02 Т.Қ.

                    https://doc.qt.io/qt-5/qml-qtquick-controls2-scrollview.html
                    читайте внимательнее )))
                    Примечание. ScrollView не обрезает содержимое автоматически. Если он не используется как полноэкранный элемент, вам следует установить для свойства clip значение true, как показано выше.
                    и там еще пример реализации всякой есть

                      Михаиллл
                      • Шілде 15, 2019, 3:28 Т.Қ.
                      • Жауап шешім ретінде белгіленді.

                      Вот такой вариант заработал

                          Flickable {
                              id: flickable
                              anchors.right: parent.right
                              anchors.rightMargin: 0
                              anchors.left: parent.left
                              anchors.leftMargin: 0
                              anchors.bottom: parent.bottom
                              anchors.bottomMargin: 0
                              anchors.top: parent.top
                              anchors.topMargin: 0
                              contentHeight: 2000
                      
                        Алексей Внуков
                        • Шілде 15, 2019, 4:07 Т.Қ.

                        вопрос, а зачем вообще ListView если там будет только 1 элемент? и как говорилось выше, в данной ситуации, это не правильная запись

                                anchors.right: parent.right
                                anchors.rightMargin: 0
                                anchors.left: parent.left
                                anchors.leftMargin: 0
                                anchors.bottom: parent.bottom
                                anchors.bottomMargin: 0
                                anchors.top: parent.top
                                anchors.topMargin: 0
                                contentHeight: 2000
                        

                        правильно будет написать

                         anchors.fill: parent
                        
                          Михаиллл
                          • Шілде 15, 2019, 5:24 Т.Қ.

                          Спасибо. Просто программа мне автоматом такую запись выдает порой.

                            Пікірлер

                            Тек рұқсаты бар пайдаланушылар ғана пікір қалдыра алады.
                            Кіріңіз немесе Тіркеліңіз
                            Ua

                            Qt - Тест 001. Сигналы и слоты

                            • Нәтиже:84ұпай,
                            • Бағалау ұпайлары4
                            Ua

                            Qt - Тест 001. Сигналы и слоты

                            • Нәтиже:42ұпай,
                            • Бағалау ұпайлары-8
                            ОК

                            Qt - Тест 001. Сигналы и слоты

                            • Нәтиже:47ұпай,
                            • Бағалау ұпайлары-6
                            Соңғы пікірлер
                            ИМ
                            Игорь МаксимовҚар. 22, 2024, 9:51 Т.Қ.
                            Django - Оқулық 017. Теңшелген Django кіру беті Добрый вечер Евгений! Я сделал себе авторизацию аналогичную вашей, все работает, кроме возврата к предидущей странице. Редеректит всегда на главную, хотя в логах сервера вижу запросы на правильн…
                            Evgenii Legotckoi
                            Evgenii LegotckoiҚаз. 31, 2024, 11:37 Т.Қ.
                            Django - Сабақ 064. Python Markdown кеңейтімін қалай жазуға болады Добрый день. Да, можно. Либо через такие же плагины, либо с постобработкой через python библиотеку Beautiful Soup
                            A
                            ALO1ZEҚаз. 19, 2024, 5:19 Т.Қ.
                            Qt Creator көмегімен fb3 файл оқу құралы Подскажите как это запустить? Я не шарю в программировании и кодинге. Скачал и установаил Qt, но куча ошибок выдается и не запустить. А очень надо fb3 переконвертировать в html
                            ИМ
                            Игорь МаксимовҚаз. 5, 2024, 4:51 Т.Қ.
                            Django - Сабақ 064. Python Markdown кеңейтімін қалай жазуға болады Приветствую Евгений! У меня вопрос. Можно ли вставлять свои классы в разметку редактора markdown? Допустим имея стандартную разметку: <ul> <li></li> <li></l…
                            d
                            dblas5Шілде 5, 2024, 8:02 Т.Қ.
                            QML - Сабақ 016. SQLite деректер қоры және онымен QML Qt-та жұмыс істеу Здравствуйте, возникает такая проблема (я новичок): ApplicationWindow неизвестный элемент. (М300) для TextField и Button аналогично. Могу предположить, что из-за более новой верси…
                            Енді форумда талқылаңыз
                            f
                            firstlunoxodАқп. 15, 2025, 1:46 Т.Қ.
                            Рисование на QGraphicsScene при зажатой кнопке мыши Подскажите, пожалуйста! Как данный класс можно дополнить, чтобы созданные объекты можно было перемещать мышкой по сцене?
                            Дмитрий
                            ДмитрийАқп. 3, 2025, 4:24 Т.Қ.
                            Создание deb-пакета. Как создать ярлык на рабочем столе после установки собственного deb-пакета? Всем привет. Сделал свой deb-пакет с программой. Всё устанавливается и работает. Ставлю по пути /usr/bin/my_application. Как для пользователя при установке пакета сразу создать ярлык на раб…
                            NW
                            Nayo WaiҚаң. 30, 2025, 7:22 Т.Қ.
                            не запускается компьютер!!! Не запускается компьютер (точнее работает блок , но сам монитор вообще жесть)В общем я ничего с интернета не скачивала в последнее время. На компе никаких левых пр…
                            n
                            nklyҚаң. 3, 2025, 12:52 Т.Қ.
                            Нужно запретить перемещение только некоторых итемов, остальные перемещать можно. Вопрос решен. Узнать QModelIndex элемента на который мы перетаскиваем другой элемент, можно с помощью функции indexAt(event->position().toPoint()) представления QTreeViev вызываемой в переопр…
                            M
                            MarselТам. 17, 2023, 12:26 Т.Ж.
                            OAuth2.0 через VK, получение email Спасибо большое за помощь и простите за то что отнял время своей невнимательностью.

                            Бізді әлеуметтік желілерде бақылаңыз