QmlDesigner: Add listmodeleditor

Task-number: QDS-2294
Change-Id: I66cae3a0d4265ab112eaf6b04e3a5972d185ff43
Reviewed-by: Tim Jenssen <tim.jenssen@qt.io>

14 files changed, 618 insertions, 49 deletions

diff --git a/src/plugins/qmldesigner/CMakeLists.txt b/src/plugins/qmldesigner/CMakeLists.txt
index 12b58ac14f3..32c988b6492 100644
--- a/src/plugins/qmldesigner/CMakeLists.txt
+++ b/src/plugins/qmldesigner/CMakeLists.txt
@@ -387,6 +387,13 @@ extend_qtc_plugin(QmlDesigner
 )
 
 extend_qtc_plugin(QmlDesigner
+  SOURCES_PREFIX components/listmodeleditor
+  SOURCES
+    listmodeleditordialog.cpp listmodeleditordialog.h
+    listmodeleditordialog.cpp listmodeleditormodel.h
+)
+
+extend_qtc_plugin(QmlDesigner
   SOURCES_PREFIX designercore
   SOURCES
     exceptions/exception.cpp
diff --git a/src/plugins/qmldesigner/components/componentcore/componentcore_constants.h b/src/plugins/qmldesigner/components/componentcore/componentcore_constants.h
index 2fa19a5c243..a8db25f4176 100644
--- a/src/plugins/qmldesigner/components/componentcore/componentcore_constants.h
+++ b/src/plugins/qmldesigner/components/componentcore/componentcore_constants.h
@@ -181,6 +181,9 @@ const char addFlowActionToolTip[] = QT_TRANSLATE_NOOP("QmlDesignerContextMenu",
 const char fitRootToScreenToolTip[] = QT_TRANSLATE_NOOP("QmlDesignerContextMenu", "Fit the root element inside the available space.");
 const char fitSelectionToScreenToolTip[] = QT_TRANSLATE_NOOP("QmlDesignerContextMenu", "Fit the selected elements inside the available space.");
 
+const char editListModelDisplayName[] = QT_TRANSLATE_NOOP("QmlDesignerContextMenu",
+                                                          "Edit List Model...");
+
 const int priorityFirst = 280;
 const int prioritySelectionCategory = 220;
 const int priorityQmlPreviewCategory = 200;
diff --git a/src/plugins/qmldesigner/components/componentcore/designeractionmanager.cpp b/src/plugins/qmldesigner/components/componentcore/designeractionmanager.cpp
index 479f40203cb..fb7d4ce2029 100644
--- a/src/plugins/qmldesigner/components/componentcore/designeractionmanager.cpp
+++ b/src/plugins/qmldesigner/components/componentcore/designeractionmanager.cpp
@@ -41,10 +41,14 @@
 #include <qmldesignerplugin.h>
 #include <viewmanager.h>
 
+#include <listmodeleditor/listmodeleditordialog.h>
+#include <listmodeleditor/listmodeleditormodel.h>
+
 #include <QHBoxLayout>
 #include <QGraphicsLinearLayout>
 
 #include <coreplugin/actionmanager/actionmanager.h>
+#include <coreplugin/icore.h>
 #include <utils/algorithm.h>
 #include <utils/qtcassert.h>
 #include <utils/utilsicons.h>
@@ -335,6 +339,64 @@ public:
     }
 };
 
+class EditListModelAction final : public ModelNodeContextMenuAction
+{
+public:
+    EditListModelAction()
+        : ModelNodeContextMenuAction("EditListModel",
+                                     ComponentCoreConstants::editListModelDisplayName,
+                                     {},
+                                     ComponentCoreConstants::rootCategory,
+                                     QKeySequence("Alt+e"),
+                                     1001,
+                                     &openDialog,
+                                     &isListViewInBaseState,
+                                     &isListViewInBaseState)
+    {}
+
+    static bool isListViewInBaseState(const SelectionContext &selectionState)
+    {
+        return selectionState.isInBaseState() && selectionState.singleNodeIsSelected()
+               && selectionState.currentSingleSelectedNode().metaInfo().isSubclassOf(
+                   "QtQuick.ListView");
+    }
+
+    bool isEnabled(const SelectionContext &) const override { return true; }
+
+    static ModelNode listModelNode(const ModelNode &listViewNode)
+    {
+        if (listViewNode.hasProperty("model")) {
+            if (listViewNode.hasBindingProperty("model"))
+                return listViewNode.bindingProperty("model").resolveToModelNode();
+            else if (listViewNode.hasNodeProperty("model"))
+                return listViewNode.nodeProperty("model").modelNode();
+        }
+
+        ModelNode newModel = listViewNode.view()->createModelNode("QtQml.Models.ListModel", 2, 15);
+        listViewNode.nodeProperty("mode").reparentHere(newModel);
+
+        return newModel;
+    }
+
+    static void openDialog(const SelectionContext &selectionState)
+    {
+        ListModelEditorModel model;
+
+        ModelNode targetNode = selectionState.targetNode();
+        if (!targetNode.isValid())
+            targetNode = selectionState.currentSingleSelectedNode();
+        if (!targetNode.isValid())
+            return;
+
+        model.setListModel(listModelNode(targetNode));
+
+        ListModelEditorDialog dialog{Core::ICore::mainWindow()};
+        dialog.setModel(&model);
+
+        dialog.exec();
+    }
+};
+
 bool flowOptionVisible(const SelectionContext &context)
 {
     return QmlFlowViewNode::isValidQmlFlowViewNode(context.rootNode());
@@ -1217,6 +1279,8 @@ void DesignerActionManager::createDefaultDesignerActions()
                           priorityGenericToolBar));
 
     addDesignerAction(new ChangeStyleAction());
+
+    addDesignerAction(new EditListModelAction);
 }
 
 void DesignerActionManager::createDefaultAddResourceHandler()
diff --git a/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditor.pri b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditor.pri
new file mode 100644
index 00000000000..cd6938aab4b
--- /dev/null
+++ b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditor.pri
@@ -0,0 +1,7 @@
+SOURCES += \
+    $$PWD/listmodeleditordialog.cpp \
+    $$PWD/listmodeleditormodel.cpp
+
+HEADERS += \
+    $$PWD/listmodeleditordialog.h \
+    $$PWD/listmodeleditormodel.h
diff --git a/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditordialog.cpp b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditordialog.cpp
new file mode 100644
index 00000000000..4a8745b62da
--- /dev/null
+++ b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditordialog.cpp
@@ -0,0 +1,163 @@
+/****************************************************************************
+**
+** Copyright (C) 2020 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of Qt Creator.
+**
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU
+** General Public License version 3 as published by the Free Software
+** Foundation with exceptions as appearing in the file LICENSE.GPL3-EXCEPT
+** included in the packaging of this file. Please review the following
+** information to ensure the GNU General Public License requirements will
+** be met: https://www.gnu.org/licenses/gpl-3.0.html.
+**
+****************************************************************************/
+
+#include "listmodeleditordialog.h"
+#include "listmodeleditormodel.h"
+
+#include <theme.h>
+
+#include <coreplugin/icore.h>
+#include <utils/algorithm.h>
+#include <utils/stylehelper.h>
+
+#include <QHeaderView>
+#include <QInputDialog>
+#include <QKeyEvent>
+#include <QTableView>
+#include <QToolBar>
+
+#include <vector>
+
+namespace QmlDesigner {
+
+namespace {
+QIcon getIcon(Theme::Icon icon)
+{
+    const QString fontName = "qtds_propertyIconFont.ttf";
+
+    return Utils::StyleHelper::getIconFromIconFont(fontName, Theme::getIconUnicode(icon), 30, 30);
+}
+} // namespace
+
+ListModelEditorDialog::ListModelEditorDialog(QWidget *parent)
+    : QDialog(parent)
+{
+    resize((Core::ICore::mainWindow()->size() * 8) / 10);
+
+    QVBoxLayout *mainLayout = new QVBoxLayout(this);
+
+    QToolBar *toolBar = new QToolBar();
+    toolBar->setIconSize({30, 30});
+    mainLayout->addWidget(toolBar);
+    m_tableView = new QTableView;
+    mainLayout->addWidget(m_tableView);
+
+    m_addRowAction = toolBar->addAction(getIcon(Theme::Icon::addRowAfter), tr("Add Row"));
+    m_removeRowsAction = toolBar->addAction(getIcon(Theme::Icon::deleteRow), tr("Remove Columns"));
+    m_addColumnAction = toolBar->addAction(getIcon(Theme::Icon::addColumnAfter), tr("Add Column"));
+    m_removeColumnsAction = toolBar->addAction(getIcon(Theme::Icon::deleteColumn),
+                                               tr("Remove Columns"));
+}
+
+ListModelEditorDialog::~ListModelEditorDialog() = default;
+
+void ListModelEditorDialog::setModel(ListModelEditorModel *model)
+{
+    m_model = model;
+
+    connect(m_addRowAction, &QAction::triggered, m_model, &ListModelEditorModel::addRow);
+    connect(m_addColumnAction, &QAction::triggered, this, &ListModelEditorDialog::openColumnDialog);
+    connect(m_removeRowsAction, &QAction::triggered, this, &ListModelEditorDialog::removeRows);
+    connect(m_removeColumnsAction, &QAction::triggered, this, &ListModelEditorDialog::removeColumns);
+    connect(m_tableView->horizontalHeader(),
+            &QHeaderView::sectionDoubleClicked,
+            this,
+            &ListModelEditorDialog::changeHeader);
+
+    m_tableView->setModel(model);
+    m_tableView->horizontalHeader()->setMinimumSectionSize(60);
+    m_tableView->verticalHeader()->setMinimumSectionSize(25);
+    m_tableView->horizontalHeader()->setSectionResizeMode(QHeaderView::ResizeToContents);
+    m_tableView->verticalHeader()->setSectionResizeMode(QHeaderView::ResizeToContents);
+}
+
+void ListModelEditorDialog::keyPressEvent(QKeyEvent *event)
+{
+    if (event->key() == Qt::Key_Backspace || event->key() == Qt::Key_Delete) {
+        for (const QModelIndex index : m_tableView->selectionModel()->selectedIndexes())
+            m_model->setData(index, QVariant(), Qt::EditRole);
+    }
+}
+
+void ListModelEditorDialog::openColumnDialog()
+{
+    bool ok;
+    QString columnName = QInputDialog::getText(
+        this, tr("Add Property"), tr("Property Name:"), QLineEdit::Normal, "", &ok);
+    if (ok && !columnName.isEmpty())
+        m_model->addColumn(columnName);
+}
+
+void ListModelEditorDialog::removeRows()
+{
+    const QList<QModelIndex> indices = m_tableView->selectionModel()->selectedRows();
+    std::vector<int> rows;
+    rows.reserve(indices.size());
+
+    for (QModelIndex index : indices)
+        rows.push_back(index.row());
+
+    std::sort(rows.begin(), rows.end());
+
+    rows.erase(std::unique(rows.begin(), rows.end()), rows.end());
+
+    std::reverse(rows.begin(), rows.end());
+
+    for (int row : rows)
+        m_model->removeRow(row);
+}
+
+void ListModelEditorDialog::removeColumns()
+{
+    const QList<QModelIndex> indices = m_tableView->selectionModel()->selectedColumns();
+    std::vector<int> columns;
+    columns.reserve(indices.size());
+
+    for (QModelIndex index : indices)
+        columns.push_back(index.column());
+
+    std::sort(columns.begin(), columns.end());
+
+    columns.erase(std::unique(columns.begin(), columns.end()), columns.end());
+
+    std::reverse(columns.begin(), columns.end());
+
+    for (int row : columns)
+        m_model->removeColumn(row);
+}
+
+void ListModelEditorDialog::changeHeader(int column)
+{
+    const QString propertyName = QString::fromUtf8(m_model->propertyNames()[column]);
+
+    bool ok;
+    QString newPropertyName = QInputDialog::getText(
+        this, tr("Change Propertry"), tr("Column Name:"), QLineEdit::Normal, propertyName, &ok);
+
+    if (ok && !newPropertyName.isEmpty())
+        m_model->renameColumn(column, newPropertyName);
+}
+
+} // namespace QmlDesigner
diff --git a/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditorview.h b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditordialog.h
index 6cfdddde5a1..519d0869fae 100644
--- a/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditorview.h
+++ b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditordialog.h
@@ -25,14 +25,48 @@
 
 #pragma once
 
-#include <abstractview.h>
+#include <QDialog>
+
+QT_BEGIN_NAMESPACE
+class QAbstractItemModel;
+class QTableView;
+QT_END_NAMESPACE
+
+namespace Ui {
+class ListModelEditorDialog;
+}
 
 namespace QmlDesigner {
 
-class ListModelEditorView : public AbstractView
+class ListModelEditorModel;
+
+class ListModelEditorDialog : public QDialog
 {
+    Q_OBJECT
+
 public:
-    ListModelEditorView();
+    explicit ListModelEditorDialog(QWidget *parent = nullptr);
+    ~ListModelEditorDialog();
+
+    void setModel(ListModelEditorModel *model);
+
+protected:
+    void keyPressEvent(QKeyEvent *) override;
+
+private:
+    void addRow();
+    void openColumnDialog();
+    void removeRows();
+    void removeColumns();
+    void changeHeader(int column);
+
+private:
+    ListModelEditorModel *m_model{};
+    QAction *m_addRowAction{};
+    QAction *m_removeRowsAction{};
+    QAction *m_addColumnAction{};
+    QAction *m_removeColumnsAction{};
+    QTableView *m_tableView{};
 };
 
 } // namespace QmlDesigner
diff --git a/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditormodel.cpp b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditormodel.cpp
index 050071dcbde..98722c3e8fb 100644
--- a/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditormodel.cpp
+++ b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditormodel.cpp
@@ -25,11 +25,278 @@
 
 #include "listmodeleditormodel.h"
 
+#include <abstractview.h>
+#include <nodelistproperty.h>
+#include <variantproperty.h>
+
+#include <QVariant>
+
+#include <algorithm>
+#include <iterator>
+#include <memory>
+
 namespace QmlDesigner {
 
-ListModelEditorModel::ListModelEditorModel()
+class ListModelItem : public QStandardItem
+{
+public:
+    ListModelItem(ModelNode node, PropertyName propertyName)
+        : node(std::move(node))
+        , propertyName(propertyName)
+    {
+        setEditable(true);
+    }
+
+    QVariant maybeConvertToNumber(const QVariant &value)
+    {
+        bool canConvert = false;
+        double convertedValue = value.toDouble(&canConvert);
+        if (canConvert) {
+            return convertedValue;
+        }
+
+        return value;
+    }
+
+    QVariant data(int role) const override
+    {
+        if (role == Qt::BackgroundColorRole && hasInvalidValue)
+            return QColor{Qt::darkYellow};
+
+        return QStandardItem::data(role);
+    }
+
+    void setData(const QVariant &value, int role) override
+    {
+        if (role == Qt::DisplayRole || role == Qt::EditRole)
+            hasInvalidValue = !value.isValid();
+
+        if (role == Qt::EditRole) {
+            const QVariant &convertedValue = maybeConvertToNumber(value);
+            QStandardItem::setData(convertedValue, role);
+            if (value.isValid())
+                node.variantProperty(propertyName).setValue(convertedValue);
+            else
+                node.removeProperty(propertyName);
+        } else {
+            QStandardItem::setData(value, role);
+        }
+    }
+
+    void removeProperty() { node.removeProperty(propertyName); }
+
+    void renameProperty(const PropertyName &newPropertyName)
+    {
+        if (node.hasProperty(propertyName)) {
+            node.removeProperty(propertyName);
+            node.variantProperty(newPropertyName).setValue(data(Qt::EditRole));
+        }
+        propertyName = newPropertyName;
+    }
+
+public:
+    ModelNode node;
+    PropertyName propertyName;
+    bool hasInvalidValue = false;
+};
+
+namespace {
+QList<PropertyName> getPropertyNames(const ModelNode &listElementNode)
+{
+    auto properties = listElementNode.variantProperties();
+
+    QList<PropertyName> names;
+    names.reserve(properties.size());
+
+    for (const auto &property : properties)
+        names.push_back(property.name());
+
+    std::sort(names.begin(), names.end());
+
+    return names;
+}
+
+QList<PropertyName> mergeProperyNames(const QList<PropertyName> &first,
+                                      const QList<PropertyName> &second)
+{
+    QList<PropertyName> merged;
+    merged.reserve(first.size() + second.size());
+
+    std::set_union(first.begin(),
+                   first.end(),
+                   second.begin(),
+                   second.end(),
+                   std::back_inserter(merged));
+
+    return merged;
+}
+
+std::unique_ptr<ListModelItem> createItem(const ModelNode &listElementNode,
+                                          const PropertyName &propertyName)
+{
+    auto item = std::make_unique<ListModelItem>(listElementNode, propertyName);
+
+    QVariant value = listElementNode.variantProperty(propertyName).value();
+
+    item->setData(value, Qt::DisplayRole);
+
+    return item;
+}
+
+QList<QString> convertToStringList(const QList<PropertyName> &propertyNames)
+{
+    QList<QString> names;
+    names.reserve(propertyNames.size());
+
+    for (const auto &propertyName : propertyNames)
+        names.push_back(QString::fromUtf8(propertyName));
+
+    return names;
+}
+
+QList<PropertyName> createProperyNames(const QList<ModelNode> &listElementNodes)
+{
+    QList<PropertyName> propertyNames;
+    propertyNames.reserve(10);
+
+    for (const ModelNode &listElementNode : listElementNodes)
+        propertyNames = mergeProperyNames(getPropertyNames(listElementNode), propertyNames);
+
+    return propertyNames;
+}
+
+QList<QStandardItem *> createColumnItems(const ModelNode &listModelNode,
+                                         const PropertyName &propertyName)
+{
+    QList<QStandardItem *> items;
+    const auto listElementNodes = listModelNode.defaultNodeListProperty().toModelNodeList();
+
+    for (const ModelNode &listElementNode : listElementNodes)
+        items.push_back(createItem(listElementNode, propertyName).release());
+
+    return items;
+}
+
+void renameProperties(const QStandardItemModel *model,
+                      int columnIndex,
+                      const PropertyName &newPropertyName)
 {
+    for (int rowIndex = 0; rowIndex < model->rowCount(); ++rowIndex)
+        static_cast<ListModelItem *>(model->item(rowIndex, columnIndex))->renameProperty(newPropertyName);
+}
+
+} // namespace
+
+void ListModelEditorModel::populateModel()
+{
+    const auto listElementNodes = m_listModelNode.defaultNodeListProperty().toModelNodeList();
+
+    m_propertyNames = createProperyNames(listElementNodes);
+
+    setHorizontalHeaderLabels(convertToStringList(m_propertyNames));
+
+    createItems(listElementNodes);
+}
+
+void ListModelEditorModel::createItems(const QList<ModelNode> &listElementNodes)
+{
+    for (const ModelNode &listElementNode : listElementNodes)
+        appendItems(listElementNode);
+}
+
+void ListModelEditorModel::appendItems(const ModelNode &listElementNode)
+{
+    QList<QStandardItem *> row;
+    row.reserve(m_propertyNames.size());
+    for (const PropertyName &propertyName : propertyNames())
+        row.push_back(createItem(listElementNode, propertyName).release());
+
+    appendRow(row);
+}
+
+void ListModelEditorModel::addRow()
+{
+    auto newElement = m_listModelNode.view()->createModelNode("QtQml.Models.ListElement", 2, 15);
+    m_listModelNode.defaultNodeListProperty().reparentHere(newElement);
+
+    appendItems(newElement);
+}
+
+void ListModelEditorModel::addColumn(const QString &columnName)
+{
+    PropertyName propertyName = columnName.toUtf8();
+
+    auto found = std::lower_bound(m_propertyNames.begin(), m_propertyNames.end(), propertyName);
+
+    if (found != m_propertyNames.end() && *found == columnName)
+        return;
+
+    int newIndex = static_cast<int>(std::distance(m_propertyNames.begin(), found));
+
+    m_propertyNames.insert(found, propertyName);
+
+    insertColumn(newIndex, createColumnItems(m_listModelNode, propertyName));
+
+    setHorizontalHeaderItem(newIndex, new QStandardItem(columnName));
+}
+
+bool ListModelEditorModel::setValue(int row, int column, QVariant value, Qt::ItemDataRole role)
+{
+    QModelIndex index = createIndex(row, column, invisibleRootItem());
+    bool success = setData(index, value, role);
+    emit dataChanged(index, index);
+
+    return success;
+}
+
+void ListModelEditorModel::removeColumn(int column)
+{
+    QList<QStandardItem *> columnItems = QStandardItemModel::takeColumn(column);
+    m_propertyNames.removeAt(column);
+
+    for (QStandardItem *columnItem : columnItems) {
+        static_cast<ListModelItem *>(columnItem)->removeProperty();
+        delete columnItem;
+    }
+}
+
+void ListModelEditorModel::removeRow(int row)
+{
+    QList<QStandardItem *> rowItems = QStandardItemModel::takeRow(row);
+
+    if (rowItems.size())
+        static_cast<ListModelItem *>(rowItems.front())->node.destroy();
+
+    qDeleteAll(rowItems);
+}
+
+void ListModelEditorModel::renameColumn(int oldColumn, const QString &newColumnName)
+{
+    const PropertyName newPropertyName = newColumnName.toUtf8();
+
+    auto found = std::lower_bound(m_propertyNames.begin(), m_propertyNames.end(), newPropertyName);
+
+    if (found != m_propertyNames.end() && *found == newPropertyName)
+        return;
+
+    int newColumn = static_cast<int>(std::distance(m_propertyNames.begin(), found));
+
+    if (oldColumn == newColumn) {
+        *found = newPropertyName;
+        renameProperties(this, newColumn, newPropertyName);
+    } else if (newColumn < oldColumn) {
+        m_propertyNames.insert(found, newPropertyName);
+        m_propertyNames.erase(std::next(m_propertyNames.begin(), oldColumn + 1));
+        insertColumn(newColumn, takeColumn(oldColumn));
+        renameProperties(this, newColumn, newPropertyName);
+    } else {
+        m_propertyNames.insert(found, newPropertyName);
+        m_propertyNames.erase(std::next(m_propertyNames.begin(), oldColumn));
+        insertColumn(newColumn - 1, takeColumn(oldColumn));
+        renameProperties(this, newColumn - 1, newPropertyName);
+    }
 
+    setHorizontalHeaderLabels(convertToStringList(m_propertyNames));
 }
 
 } // namespace QmlDesigner
diff --git a/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditormodel.h b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditormodel.h
index e9638a1a6d8..35d41bee68b 100644
--- a/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditormodel.h
+++ b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditormodel.h
@@ -25,14 +25,41 @@
 
 #pragma once
 
+#include <modelnode.h>
+
 #include <QStandardItemModel>
 
 namespace QmlDesigner {
 
 class ListModelEditorModel : public QStandardItemModel
 {
+
 public:
-    ListModelEditorModel();
+    void setListModel(ModelNode node)
+    {
+        m_listModelNode = node;
+        populateModel();
+    }
+
+    void addRow();
+    void addColumn(const QString &columnName);
+
+    const QList<QmlDesigner::PropertyName> &propertyNames() const { return m_propertyNames; }
+
+    bool setValue(int row, int column, QVariant value, Qt::ItemDataRole role = Qt::EditRole);
+
+    void removeColumn(int column);
+    void removeRow(int row);
+    void renameColumn(int column, const QString &newColumnName);
+
+private:
+    void populateModel();
+    void createItems(const QList<ModelNode> &listElementNodes);
+    void appendItems(const ModelNode &listElementNode);
+
+private:
+    ModelNode m_listModelNode;
+    QList<QmlDesigner::PropertyName> m_propertyNames;
 };
 
 } // namespace QmlDesigner
diff --git a/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditorview.cpp b/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditorview.cpp
deleted file mode 100644
index c8d4017f1d9..00000000000
--- a/src/plugins/qmldesigner/components/listmodeleditor/listmodeleditorview.cpp
+++ /dev/null
@@ -1,35 +0,0 @@
-/****************************************************************************
-**
-** Copyright (C) 2020 The Qt Company Ltd.
-** Contact: https://www.qt.io/licensing/
-**
-** This file is part of Qt Creator.
-**
-** Commercial License Usage
-** Licensees holding valid commercial Qt licenses may use this file in
-** accordance with the commercial license agreement provided with the
-** Software or, alternatively, in accordance with the terms contained in
-** a written agreement between you and The Qt Company. For licensing terms
-** and conditions see https://www.qt.io/terms-conditions. For further
-** information use the contact form at https://www.qt.io/contact-us.
-**
-** GNU General Public License Usage
-** Alternatively, this file may be used under the terms of the GNU
-** General Public License version 3 as published by the Free Software
-** Foundation with exceptions as appearing in the file LICENSE.GPL3-EXCEPT
-** included in the packaging of this file. Please review the following
-** information to ensure the GNU General Public License requirements will
-** be met: https://www.gnu.org/licenses/gpl-3.0.html.
-**
-****************************************************************************/
-
-#include "listmodeleditorview.h"
-
-namespace QmlDesigner {
-
-ListModelEditorView::ListModelEditorView()
-{
-
-}
-
-} // namespace QmlDesigner
diff --git a/src/plugins/qmldesigner/designercore/include/modelnode.h b/src/plugins/qmldesigner/designercore/include/modelnode.h
index 6f3d5eb6dfb..3197e746ab5 100644
--- a/src/plugins/qmldesigner/designercore/include/modelnode.h
+++ b/src/plugins/qmldesigner/designercore/include/modelnode.h
@@ -91,9 +91,12 @@ public:
     ModelNode(const Internal::InternalNodePointer &internalNode, Model *model, const AbstractView *view);
     ModelNode(const ModelNode &modelNode, AbstractView *view);
     ModelNode(const ModelNode &other);
+    ModelNode(ModelNode &&other);
     ~ModelNode();
 
-    ModelNode& operator=(const ModelNode &other);
+    ModelNode &operator=(const ModelNode &other);
+    ModelNode &operator=(ModelNode &&other);
+
     TypeName type() const;
     QString simplifiedTypeName() const;
     QString displayName() const;
@@ -226,6 +229,15 @@ public:
     bool isSubclassOf(const TypeName &typeName, int majorVersion = -1, int minorVersion = -1) const;
     QIcon typeIcon() const;
 
+    friend void swap(ModelNode &first, ModelNode &second)
+    {
+        using std::swap;
+
+        swap(first.m_internalNode, second.m_internalNode);
+        swap(first.m_model, second.m_model);
+        swap(first.m_view, second.m_view);
+    }
+
 private: // functions
     Internal::InternalNodePointer internalNode() const;
 
diff --git a/src/plugins/qmldesigner/designercore/model/modelnode.cpp b/src/plugins/qmldesigner/designercore/model/modelnode.cpp
index b4c21564c72..eb2d2859974 100644
--- a/src/plugins/qmldesigner/designercore/model/modelnode.cpp
+++ b/src/plugins/qmldesigner/designercore/model/modelnode.cpp
@@ -93,7 +93,25 @@ ModelNode::ModelNode(const ModelNode &modelNode, AbstractView *view)
       m_model(modelNode.model()),
       m_view(view)
 {
+}
+
+ModelNode::ModelNode(ModelNode &&other)
+    : m_internalNode(std::move(other.m_internalNode))
+    , m_model(std::move(other.m_model))
+    , m_view(std::move(other.m_view))
+{
+    other.m_model = {};
+    other.m_view = {};
+}
 
+ModelNode &ModelNode::operator=(ModelNode &&other)
+{
+    ModelNode newNode;
+
+    swap(other, newNode);
+    swap(*this, newNode);
+
+    return *this;
 }
 
 /*! \brief contructs a invalid model node
@@ -103,7 +121,6 @@ ModelNode::ModelNode(const ModelNode &modelNode, AbstractView *view)
 ModelNode::ModelNode():
         m_internalNode(new InternalNode)
 {
-
 }
 
 ModelNode::ModelNode(const ModelNode &other) = default;
diff --git a/src/plugins/qmldesigner/qmldesignerplugin.pro b/src/plugins/qmldesigner/qmldesignerplugin.pro
index bc0da990504..506b3d743b8 100644
--- a/src/plugins/qmldesigner/qmldesignerplugin.pro
+++ b/src/plugins/qmldesigner/qmldesignerplugin.pro
@@ -33,7 +33,7 @@ include(components/bindingeditor/bindingeditor.pri)
 include(components/annotationeditor/annotationeditor.pri)
 include(components/richtexteditor/richtexteditor.pri)
 include(components/transitioneditor/transitioneditor.pri)
-
+include(components/listmodeleditor/listmodeleditor.pri)
 
 BUILD_PUPPET_IN_CREATOR_BINPATH = $$(BUILD_PUPPET_IN_CREATOR_BINPATH)
 !isEmpty(BUILD_PUPPET_IN_CREATOR_BINPATH) {
diff --git a/src/plugins/qmldesigner/qmldesignerplugin.qbs b/src/plugins/qmldesigner/qmldesignerplugin.qbs
index b1129a9bf33..dceaf8656df 100644
--- a/src/plugins/qmldesigner/qmldesignerplugin.qbs
+++ b/src/plugins/qmldesigner/qmldesignerplugin.qbs
@@ -59,6 +59,7 @@ Project {
              "components/stateseditor",
              "components/texteditor",
              "components/timelineeditor",
+             "compenents/listmodeleditor",
         ])
 
         Properties {
@@ -843,6 +844,10 @@ Project {
                 "timelineeditor/timelineview.h",
                 "timelineeditor/timelinewidget.cpp",
                 "timelineeditor/timelinewidget.h",
+                "listmodeleditor/listmodeleditordialog.cpp ",
+                "listmodeleditor/listmodeleditordialog.h ",
+                "listmodeleditor/listmodeleditormodel.cpp ",
+                "listmodeleditor/listmodeleditordialog.h ",
                 "transitioneditor/transitioneditorview.cpp",
                 "transitioneditor/transitioneditorview.h",
                 "transitioneditor/transitioneditorwidget.cpp",
diff --git a/src/plugins/qmldesigner/qmldesignerunittestfiles.pri b/src/plugins/qmldesigner/qmldesignerunittestfiles.pri
index 282360a4ea5..cd4d52e8d3a 100644
--- a/src/plugins/qmldesigner/qmldesignerunittestfiles.pri
+++ b/src/plugins/qmldesigner/qmldesignerunittestfiles.pri
@@ -14,14 +14,12 @@ SOURCES += \
     $$PWD/designercore/model/import.cpp \
     $$PWD/designercore/model/abstractproperty.cpp \
     $$PWD/designercore/model/abstractview.cpp \
-    $$PWD/components/listmodeleditor/listmodeleditormodel.cpp \
     $$PWD/designercore/model/internalproperty.cpp \
     $$PWD/designercore/model/internalbindingproperty.cpp \
     $$PWD/designercore/model/internalnodeabstractproperty.cpp \
     $$PWD/designercore/model/internalnodelistproperty.cpp \
     $$PWD/designercore/model/internalnodeproperty.cpp \
     $$PWD/designercore/model/internalsignalhandlerproperty.cpp \
-    $$PWD/designercore/model/internalproperty.cpp \
     $$PWD/designercore/model/internalnode.cpp \
     $$PWD/designercore/model/internalvariantproperty.cpp \
     $$PWD/designercore/model/bindingproperty.cpp \
@@ -30,9 +28,9 @@ SOURCES += \
     $$PWD/designercore/model/nodeproperty.cpp \
     $$PWD/designercore/model/signalhandlerproperty.cpp \
     $$PWD/designercore/model/variantproperty.cpp\
-    $$PWD/designercore/model/annotation.cpp\
     $$PWD/designercore/model/annotation.cpp \
-    $$PWD/designercore/rewritertransaction.cpp
+    $$PWD/designercore/rewritertransaction.cpp \
+    $$PWD/components/listmodeleditor/listmodeleditormodel.cpp
 
 HEADERS += \
     $$PWD/designercore/include/modelnode.h \
@@ -41,7 +39,6 @@ HEADERS += \
     $$PWD/designercore/include/import.h \
     $$PWD/designercore/include/abstractproperty.h \
     $$PWD/designercore/include/abstractview.h \
-    $$PWD/components/listmodeleditor/listmodeleditormodel.h \
     $$PWD/designercore/model/model_p.h \
     $$PWD/designercore/include/qmldesignercorelib_global.h \
     $$PWD/designercore/model/internalbindingproperty.h \
@@ -58,4 +55,5 @@ HEADERS += \
     $$PWD/designercore/include/nodeproperty.h \
     $$PWD/designercore/include/signalhandlerproperty.h \
     $$PWD/designercore/include/variantproperty.h \
-    $$PWD/designercore/rewritertransaction.h
+    $$PWD/designercore/rewritertransaction.h \
+    $$PWD/components/listmodeleditor/listmodeleditormodel.h