Browse Source

added list delegate for simpler list editing

pull/2/head
Skycoder42 7 years ago
parent
commit
2a8b34ac79
  1. 10
      examples/mvvmcore/SampleCore/settings.xml
  2. 14
      src/imports/mvvmquick/OverviewListView.qml
  3. 4
      src/imports/mvvmquick/icons/ic_chevron_right_white_24px.svg
  4. 1
      src/imports/mvvmquick/qtmvvmquick_plugin.qrc
  5. 2
      src/imports/mvvmquick/settingsentrymodel.cpp
  6. 14
      src/mvvmquick/BoolDelegate.qml
  7. 31
      src/mvvmquick/ListDelegate.qml
  8. 2
      src/mvvmquick/MsgDelegate.qml
  9. 27
      src/mvvmquick/RadioListEdit.qml
  10. 14
      src/mvvmquick/SwitchDelegate.qml
  11. 10
      src/mvvmquick/inputviewfactory.cpp
  12. 2
      src/mvvmquick/qtmvvmquick_module.qrc

10
examples/mvvmcore/SampleCore/settings.xml

@ -89,5 +89,15 @@
type="int" type="int"
title="Enter a &number" title="Enter a &number"
default="42" /> default="42" />
<Entry key="prop8"
type="selection"
title="Select a &amp;mode"
default="Text 2">
<Property key="editable" type="bool">true</Property>
<Property key="listElements" type="list">
<Element type="string">Text 1</Element>
<Element type="string">Text 2</Element>
</Property>
</Entry>
</Category> </Category>
</SettingsConfig> </SettingsConfig>

14
src/imports/mvvmquick/OverviewListView.qml

@ -24,7 +24,7 @@ ListView {
contentItem: GridLayout { contentItem: GridLayout {
id: grid id: grid
rows: 2 rows: 2
columns: 2 columns: 3
columnSpacing: 14 columnSpacing: 14
TintIcon { TintIcon {
@ -59,6 +59,18 @@ ListView {
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
Layout.fillWidth: true Layout.fillWidth: true
} }
TintIcon {
id: openIcon
source: "image://svg/de/skycoder42/qtmvvm/quick/icons/ic_chevron_right"
Layout.row: 0
Layout.column: 2
Layout.rowSpan: 2
Layout.fillHeight: true
Layout.preferredWidth: iconSize.width
Layout.preferredHeight: iconSize.height
Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
}
} }
} }
} }

4
src/imports/mvvmquick/icons/ic_chevron_right_white_24px.svg

@ -0,0 +1,4 @@
<svg fill="#FFFFFF" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
<path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/>
<path d="M0 0h24v24H0z" fill="none"/>
</svg>

After

Width:  |  Height:  |  Size: 210 B

1
src/imports/mvvmquick/qtmvvmquick_plugin.qrc

@ -7,6 +7,7 @@
<file alias="ic_close.svg">icons/ic_close_white_24px.svg</file> <file alias="ic_close.svg">icons/ic_close_white_24px.svg</file>
<file alias="ic_search.svg">icons/ic_search_white_24px.svg</file> <file alias="ic_search.svg">icons/ic_search_white_24px.svg</file>
<file alias="ic_settings_backup_restore.svg">icons/ic_settings_backup_restore_white_24px.svg</file> <file alias="ic_settings_backup_restore.svg">icons/ic_settings_backup_restore_white_24px.svg</file>
<file alias="ic_chevron_right.svg">icons/ic_chevron_right_white_24px.svg</file>
</qresource> </qresource>
<qresource prefix="/de/skycoder42/qtmvvm/quick/qml"> <qresource prefix="/de/skycoder42/qtmvvm/quick/qml">
<file>FileDialog.qml</file> <file>FileDialog.qml</file>

2
src/imports/mvvmquick/settingsentrymodel.cpp

@ -92,7 +92,7 @@ QHash<int, QByteArray> SettingsEntryModel::roleNames() const
{TitleRole, "title"}, {TitleRole, "title"},
{ToolTipRole, "tooltip"}, {ToolTipRole, "tooltip"},
{DelegateUrlRole, "delegateUrl"}, {DelegateUrlRole, "delegateUrl"},
{SettingsValueRole, "settingsValue"}, {SettingsValueRole, "inputValue"},
{PropertiesRole, "properties"} {PropertiesRole, "properties"}
}; };
} }

14
src/mvvmquick/BoolDelegate.qml

@ -7,8 +7,18 @@ CheckDelegate {
text: title text: title
Component.onCompleted: checked = settingsValue; //TODO buggy, use binding? function asBool(value) {
onCheckedChanged: settingsValue = checked; if(typeof value == "string")
return value === "true";
else
return Boolean(value);
}
Component.onCompleted: checked = asBool(inputValue)
onCheckedChanged: {
if(asBool(inputValue) !== checked)
inputValue = checked;
}
contentItem: GridLayout { contentItem: GridLayout {
columns: 2 columns: 2

31
src/mvvmquick/ListDelegate.qml

@ -0,0 +1,31 @@
import QtQuick 2.10
import QtQuick.Controls 2.3
import QtQuick.Layouts 1.3
ItemDelegate {
id: _listDelegate
text: title
signal showInput(string key, string title, string type, var defaultValue, var properties);
contentItem: ColumnLayout {
Label {
id: _titleLabel
text: _listDelegate.text
font.bold: true
elide: Label.ElideRight
Layout.fillWidth: true
}
Label {
id: _textLabel
visible: tooltip
text: tooltip
wrapMode: Text.WordWrap
Layout.fillWidth: true
}
}
onClicked: showInput(key, title, "radiolist", inputValue, properties)
}

2
src/mvvmquick/MsgDelegate.qml

@ -27,5 +27,5 @@ ItemDelegate {
} }
} }
onClicked: showInput(key, title, type, settingsValue, properties) onClicked: showInput(key, title, type, inputValue, properties)
} }

27
src/mvvmquick/RadioListEdit.qml

@ -0,0 +1,27 @@
import QtQuick 2.10
import QtQuick.Controls 2.3
ListView {
id: _edit
property var inputValue
property alias listElements: _edit.model
readonly property bool isExtended: Boolean(model[0] && model[0].name)
implicitHeight: dummyDelegate.height * model.length
ScrollBar.vertical: ScrollBar {}
delegate: RadioDelegate {
width: parent.width
text: isExtended ? _edit.model[index].name : modelData
checked: (isExtended ? _edit.model[index].value : modelData) == inputValue
onClicked: inputValue = (isExtended ? _edit.model[index].value : modelData)
}
RadioDelegate {
id:dummyDelegate
visible: false
text: "dummy"
}
}

14
src/mvvmquick/SwitchDelegate.qml

@ -7,8 +7,18 @@ Controls.SwitchDelegate {
text: title text: title
Component.onCompleted: checked = settingsValue; function asBool(value) {
onCheckedChanged: settingsValue = checked; if(typeof value == "string")
return value === "true";
else
return Boolean(value);
}
Component.onCompleted: checked = asBool(inputValue)
onCheckedChanged: {
if(asBool(inputValue) !== checked)
inputValue = checked;
}
contentItem: GridLayout { contentItem: GridLayout {
columns: 2 columns: 2

10
src/mvvmquick/inputviewfactory.cpp

@ -67,6 +67,8 @@ QUrl InputViewFactory::getInputUrl(const QByteArray &type, const QVariantMap &vi
return QStringLiteral("qrc:/qtmvvm/inputs/UrlField.qml"); return QStringLiteral("qrc:/qtmvvm/inputs/UrlField.qml");
else if(type == "selection" || type == "list") else if(type == "selection" || type == "list")
return QStringLiteral("qrc:/qtmvvm/inputs/ListEdit.qml"); return QStringLiteral("qrc:/qtmvvm/inputs/ListEdit.qml");
else if(type == "radiolist")
return QStringLiteral("qrc:/qtmvvm/inputs/RadioListEdit.qml");
else { else {
logCritical() << "Failed to find any input view for input type:" << type; logCritical() << "Failed to find any input view for input type:" << type;
return QUrl(); return QUrl();
@ -83,10 +85,10 @@ QUrl InputViewFactory::getDelegate(const QByteArray &type, const QVariantMap &vi
else if(type == QMetaType::typeName(QMetaType::Bool)) else if(type == QMetaType::typeName(QMetaType::Bool))
return QStringLiteral("qrc:/qtmvvm/delegates/BoolDelegate.qml"); return QStringLiteral("qrc:/qtmvvm/delegates/BoolDelegate.qml");
else if(type == "switch") else if(type == "switch")
return QStringLiteral("qrc:/qtmvvm/inputs/SwitchDelegate.qml"); return QStringLiteral("qrc:/qtmvvm/delegates/SwitchDelegate.qml");
//TODO add else if((type == "selection" || type == "list") &&
// else if(type == "selection" || type == "list") !viewProperties.value(QStringLiteral("editable"), false).toBool())
// return QStringLiteral("qrc:/qtmvvm/inputs/ListDelegate.qml"); return QStringLiteral("qrc:/qtmvvm/delegates/ListDelegate.qml");
else else
return QStringLiteral("qrc:/qtmvvm/delegates/MsgDelegate.qml"); return QStringLiteral("qrc:/qtmvvm/delegates/MsgDelegate.qml");
} }

2
src/mvvmquick/qtmvvmquick_module.qrc

@ -8,11 +8,13 @@
<file>FontEdit.qml</file> <file>FontEdit.qml</file>
<file>UrlField.qml</file> <file>UrlField.qml</file>
<file>Switch.qml</file> <file>Switch.qml</file>
<file>RadioListEdit.qml</file>
</qresource> </qresource>
<qresource prefix="/qtmvvm/delegates"> <qresource prefix="/qtmvvm/delegates">
<file>BoolDelegate.qml</file> <file>BoolDelegate.qml</file>
<file>MsgDelegate.qml</file> <file>MsgDelegate.qml</file>
<file>SwitchDelegate.qml</file> <file>SwitchDelegate.qml</file>
<file>ListDelegate.qml</file>
</qresource> </qresource>
<qresource prefix="/qtmvvm/views"> <qresource prefix="/qtmvvm/views">
<file>SettingsView.qml</file> <file>SettingsView.qml</file>

Loading…
Cancel
Save