diff --git a/doric-Qt/example/app/main.qml b/doric-Qt/example/app/main.qml
index 2747ee39..508ec167 100644
--- a/doric-Qt/example/app/main.qml
+++ b/doric-Qt/example/app/main.qml
@@ -100,7 +100,7 @@ ApplicationWindow {
ListView {
id: list
width: content.width
- model: 24
+ model: 25
boundsBehavior: Flickable.StopAtBounds
function getSource(index) : string {
@@ -126,32 +126,34 @@ ApplicationWindow {
case 9:
return "LayoutTestDemo.js"
case 10:
- return "ModalDemo.js"
+ return "ListDemo.js"
case 11:
- return "ModularDemo.js"
+ return "ModalDemo.js"
case 12:
- return "NavBarDemo.js"
+ return "ModularDemo.js"
case 13:
- return "NavigatorDemo.js"
+ return "NavBarDemo.js"
case 14:
- return "NetworkDemo.js"
+ return "NavigatorDemo.js"
case 15:
- return "NotificationDemo.js"
+ return "NetworkDemo.js"
case 16:
- return "PopoverDemo.js"
+ return "NotificationDemo.js"
case 17:
- return "ScrollerDemo.js"
+ return "PopoverDemo.js"
case 18:
- return "SimpleDemo.js"
+ return "ScrollerDemo.js"
case 19:
- return "SliderDemo.js"
+ return "SimpleDemo.js"
case 20:
- return "Snake.js"
+ return "SliderDemo.js"
case 21:
- return "StorageDemo.js"
+ return "Snake.js"
case 22:
- return "SwitchDemo.js"
+ return "StorageDemo.js"
case 23:
+ return "SwitchDemo.js"
+ case 24:
return "TextDemo.js"
}
}
diff --git a/doric-Qt/example/app/qml.qrc b/doric-Qt/example/app/qml.qrc
index 1bbc859a..f22fc54c 100644
--- a/doric-Qt/example/app/qml.qrc
+++ b/doric-Qt/example/app/qml.qrc
@@ -18,6 +18,7 @@
../../../doric-demo/bundle/src/ImageDemo.js
../../../doric-demo/bundle/src/InputDemo.js
../../../doric-demo/bundle/src/LayoutDemo.js
+ ../../../doric-demo/bundle/src/ListDemo.js
../../../doric-demo/bundle/src/LayoutTestDemo.js
../../../doric-demo/bundle/src/ModalDemo.js
../../../doric-demo/bundle/src/ModularDemo.js
@@ -54,6 +55,8 @@
../doric/resources/switch.qml
../doric/resources/draggable.qml
../doric/resources/flex.qml
+ ../doric/resources/list.qml
+ ../doric/resources/list-item.qml
../doric/resources/toast.qml
../doric/resources/alert.qml
diff --git a/doric-Qt/example/doric/DoricRegistry.cpp b/doric-Qt/example/doric/DoricRegistry.cpp
index a5305961..6ee4a813 100644
--- a/doric-Qt/example/doric/DoricRegistry.cpp
+++ b/doric-Qt/example/doric/DoricRegistry.cpp
@@ -21,6 +21,8 @@
#include "shader/DoricSwitchNode.h"
#include "shader/DoricTextNode.h"
#include "shader/DoricVLayoutNode.h"
+#include "shader/list/DoricListItemNode.h"
+#include "shader/list/DoricListNode.h"
#include "shader/slider/DoricSlideItemNode.h"
#include "shader/slider/DoricSliderNode.h"
@@ -49,6 +51,8 @@ DoricRegistry::DoricRegistry() {
registerViewNode("Switch");
registerViewNode("Draggable");
registerViewNode("FlexLayout");
+ registerViewNode("List");
+ registerViewNode("ListItem");
}
bool DoricRegistry::acquirePluginInfo(QString name) {
diff --git a/doric-Qt/example/doric/doric.pro b/doric-Qt/example/doric/doric.pro
index e3aae23f..4b0cb976 100644
--- a/doric-Qt/example/doric/doric.pro
+++ b/doric-Qt/example/doric/doric.pro
@@ -60,6 +60,8 @@ SOURCES += \
shader/DoricTextNode.cpp \
shader/DoricVLayoutNode.cpp \
shader/DoricViewNode.cpp \
+ shader/list/DoricListItemNode.cpp \
+ shader/list/DoricListNode.cpp \
shader/slider/DoricSlideItemNode.cpp \
shader/slider/DoricSliderNode.cpp \
utils/DoricConstant.cpp \
@@ -153,6 +155,8 @@ HEADERS += \
shader/DoricTextNode.h \
shader/DoricVLayoutNode.h \
shader/DoricViewNode.h \
+ shader/list/DoricListItemNode.h \
+ shader/list/DoricListNode.h \
shader/slider/DoricSlideItemNode.h \
shader/slider/DoricSliderNode.h \
template/DoricSingleton.h \
diff --git a/doric-Qt/example/doric/resources/list-item.qml b/doric-Qt/example/doric/resources/list-item.qml
new file mode 100644
index 00000000..709a4d1e
--- /dev/null
+++ b/doric-Qt/example/doric/resources/list-item.qml
@@ -0,0 +1,184 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.5
+import QtQuick.Layouts 1.15
+import QtGraphicalEffects 1.12
+
+import "util.mjs" as Util
+
+Rectangle {
+ id: root
+ property var wrapper
+
+ clip: true
+
+ property var uuid: Util.uuidv4()
+
+ property var tag: "ListItem"
+
+ onWidthChanged: {
+ console.log(tag, uuid + " onWidthChanged: " + this.width)
+
+ updateGradient()
+
+ slideItemBridge.apply(wrapper)
+ }
+
+ onHeightChanged: {
+ console.log(tag, uuid + " onHeightChanged: " + this.height)
+
+ updateGradient()
+
+ slideItemBridge.apply(wrapper)
+ }
+
+ color: 'transparent'
+
+ property var backgroundColor
+
+ onBackgroundColorChanged: {
+ color = backgroundColor
+ }
+
+ property var borderWidth: 0
+ onBorderWidthChanged: {
+ border.width = borderWidth
+ }
+
+ property var borderColor: ""
+ onBorderColorChanged: {
+ border.color = borderColor
+ }
+
+ MouseArea {
+ anchors.fill: parent
+ onClicked: {
+ console.log(tag, uuid + " wrapper: " + wrapper)
+ mouseAreaBridge.onClick(wrapper)
+ }
+ }
+
+ property var shadowColor
+ property var shadowRadius
+ property var shadowOffsetX
+ property var shadowOffsetY
+ property var shadowOpacity
+
+ onShadowOpacityChanged: {
+ if (shadowOpacity > 0) {
+ layer.enabled = true
+ } else {
+ layer.enabled = false
+ }
+ }
+
+ layer.enabled: false
+ layer.effect: DropShadow {
+ horizontalOffset: shadowOffsetX
+ verticalOffset: shadowOffsetY
+ radius: shadowRadius
+ samples: 16
+ color: shadowColor
+ transparentBorder: true
+ }
+
+
+ property var backgroundColorIsObject: false
+ onBackgroundColorIsObjectChanged: {
+ if (backgroundColorIsObject) {
+ lineGradient.anchors.fill = root
+ } else {
+ lineGradient.anchors.fill = null
+ }
+ }
+
+ property variant gradientColors: []
+ property variant gradientLocations: []
+
+ onGradientColorsChanged: {
+ console.log(tag, uuid + " onGradientColorsChanged: " + gradientColors)
+ if (gradientColors.length > 0) {
+ let stops = []
+
+ if (gradientLocations.length == 0) {
+ let unit = 1 / (gradientColors.length - 1)
+ for (let i = 0;i !== gradientColors.length;i++) {
+ let a = ((gradientColors[i] >> 24) & 0xff) / 255;
+ let r = ((gradientColors[i] >> 16) & 0xff) / 255;
+ let g = ((gradientColors[i] >> 8) & 0xff) / 255;
+ let b = ((gradientColors[i] >> 0) & 0xff) / 255;
+ let stop = stopComponent.createObject(root, {"position": unit * i, "color": Qt.rgba(r, g, b, a)})
+ console.log(tag, uuid + " onGradientColorsChanged: " + "position: " + unit * i + " color: " + Qt.rgba(r, g, b, a))
+ stops.push(stop)
+ }
+ } else {
+ for (let i = 0;i !== gradientColors.length;i++) {
+ let a = ((gradientColors[i] >> 24) & 0xff) / 255;
+ let r = ((gradientColors[i] >> 16) & 0xff) / 255;
+ let g = ((gradientColors[i] >> 8) & 0xff) / 255;
+ let b = ((gradientColors[i] >> 0) & 0xff) / 255;
+ let stop = stopComponent.createObject(root, {"position": gradientLocations[i], "color": Qt.rgba(r, g, b, a)})
+ console.log(tag, uuid + " onGradientColorsChanged: " + "position: " + gradientLocations[i] + " color: " + Qt.rgba(r, g, b, a))
+ stops.push(stop)
+ }
+ }
+
+ innerGradient.stops = stops
+ }
+ }
+
+ property var orientation: 0
+
+ function updateGradient() {
+ switch (orientation) {
+ case 0:
+ lineGradient.start = Qt.point(0, 0)
+ lineGradient.end = Qt.point(0, root.height)
+ break
+ case 1:
+ lineGradient.start = Qt.point(root.width, 0)
+ lineGradient.end = Qt.point(0, root.height)
+ break
+ case 2:
+ lineGradient.start = Qt.point(root.width, 0)
+ lineGradient.end = Qt.point(0, 0)
+ break
+ case 3:
+ lineGradient.start = Qt.point(root.width, root.height)
+ lineGradient.end = Qt.point(0, 0)
+ break
+ case 4:
+ lineGradient.start = Qt.point(0, root.height)
+ lineGradient.end = Qt.point(0, 0)
+ break
+ case 5:
+ lineGradient.start = Qt.point(0, root.height)
+ lineGradient.end = Qt.point(root.width, 0)
+ break
+ case 6:
+ lineGradient.start = Qt.point(0, 0)
+ lineGradient.end = Qt.point(root.width, 0)
+ break
+ case 7:
+ lineGradient.start = Qt.point(0, 0)
+ lineGradient.end = Qt.point(root.width, root.height)
+ break
+ }
+ }
+ onOrientationChanged: {
+ console.log(tag, uuid + " onOrientationChanged: " + orientation)
+
+ updateGradient()
+ }
+
+ LinearGradient {
+ Component {
+ id:stopComponent
+ GradientStop {}
+ }
+
+ id: lineGradient
+ gradient: Gradient {
+ id: innerGradient
+ }
+ }
+}
diff --git a/doric-Qt/example/doric/resources/list.qml b/doric-Qt/example/doric/resources/list.qml
new file mode 100644
index 00000000..dea66b71
--- /dev/null
+++ b/doric-Qt/example/doric/resources/list.qml
@@ -0,0 +1,48 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.5
+
+import "util.mjs" as Util
+
+ListView {
+ property var wrapper
+
+ property var uuid: Util.uuidv4()
+
+ property var tag: "List"
+
+ Rectangle {
+ id: bg
+ color: 'transparent'
+ }
+
+ property var backgroundColor
+
+ onBackgroundColorChanged: {
+ bg.color = backgroundColor
+ }
+
+ onWidthChanged: {
+ bg.implicitWidth = width
+ console.log(tag, uuid + " onWidthChanged: " + this.width)
+ }
+
+ onHeightChanged: {
+ bg.implicitHeight = height
+ console.log(tag, uuid + " onHeightChanged: " + this.height)
+ }
+
+ property var borderWidth: 0
+ onBorderWidthChanged: {
+ bg.border.width = borderWidth
+ }
+
+ property var borderColor: ""
+ onBorderColorChanged: {
+ bg.border.color = borderColor
+ }
+
+ onCurrentIndexChanged: {
+ console.log(tag, uuid + " onCurrentIndexChanged: " + this.currentIndex)
+ }
+
+}
diff --git a/doric-Qt/example/doric/shader/list/DoricListItemNode.cpp b/doric-Qt/example/doric/shader/list/DoricListItemNode.cpp
new file mode 100644
index 00000000..cb41421f
--- /dev/null
+++ b/doric-Qt/example/doric/shader/list/DoricListItemNode.cpp
@@ -0,0 +1,22 @@
+#include "DoricListItemNode.h"
+
+QQuickItem *DoricListItemNode::build() {
+ QQmlComponent component(getContext()->getQmlEngine());
+
+ const QUrl url(QStringLiteral("qrc:/doric/qml/list-item.qml"));
+ component.loadUrl(url);
+
+ if (component.isError()) {
+ qCritical() << component.errorString();
+ }
+
+ QQuickItem *item = qobject_cast(component.create());
+ this->createLayouts(item);
+
+ getLayouts()->setLayoutType(DoricLayoutType::DoricStack);
+
+ item->setProperty("wrapper", QString::number((qint64)this));
+ return item;
+}
+
+void DoricListItemNode::apply() { getLayouts()->apply(); }
diff --git a/doric-Qt/example/doric/shader/list/DoricListItemNode.h b/doric-Qt/example/doric/shader/list/DoricListItemNode.h
new file mode 100644
index 00000000..369f4edd
--- /dev/null
+++ b/doric-Qt/example/doric/shader/list/DoricListItemNode.h
@@ -0,0 +1,17 @@
+#ifndef DORICLISTITEMNODE_H
+#define DORICLISTITEMNODE_H
+
+#include "DoricExport.h"
+
+#include "shader/DoricStackNode.h"
+
+class DORIC_EXPORT DoricListItemNode : public DoricStackNode {
+public:
+ using DoricStackNode::DoricStackNode;
+
+ QQuickItem *build() override;
+
+ void apply();
+};
+
+#endif // DORICLISTITEMNODE_H
diff --git a/doric-Qt/example/doric/shader/list/DoricListNode.cpp b/doric-Qt/example/doric/shader/list/DoricListNode.cpp
new file mode 100644
index 00000000..d96c70a7
--- /dev/null
+++ b/doric-Qt/example/doric/shader/list/DoricListNode.cpp
@@ -0,0 +1,26 @@
+#include "DoricListNode.h"
+
+QQuickItem *DoricListNode::build() {
+ QQmlComponent component(getContext()->getQmlEngine());
+
+ const QUrl url(QStringLiteral("qrc:/doric/qml/list.qml"));
+ component.loadUrl(url);
+
+ if (component.isError()) {
+ qCritical() << component.errorString();
+ }
+
+ QQuickItem *item = qobject_cast(component.create());
+ this->createLayouts(item);
+
+ item->setProperty("wrapper", QString::number((qint64)this));
+ return item;
+}
+
+DoricViewNode *DoricListNode::getSubNodeById(QString id) {}
+
+void DoricListNode::blendSubNode(QJsonValue subProperties) {}
+
+void DoricListNode::blend(QQuickItem *view, QString name, QJsonValue prop) {}
+
+void DoricListNode::afterBlended(QJsonValue prop) {}
diff --git a/doric-Qt/example/doric/shader/list/DoricListNode.h b/doric-Qt/example/doric/shader/list/DoricListNode.h
new file mode 100644
index 00000000..1b23dbdf
--- /dev/null
+++ b/doric-Qt/example/doric/shader/list/DoricListNode.h
@@ -0,0 +1,36 @@
+#ifndef DORICLISTNODE_H
+#define DORICLISTNODE_H
+
+#include "DoricExport.h"
+
+#include "DoricListItemNode.h"
+#include "shader/DoricSuperNode.h"
+
+class DORIC_EXPORT DoricListNode : public DoricSuperNode {
+
+private:
+ QString renderItemFuncId;
+ int itemCount = 0;
+ int batchCount = 15;
+ QString onLoadMoreFuncId;
+ bool loadMore = false;
+ QString loadMoreViewId;
+ QString onScrollFuncId;
+ QString onScrollEndFuncId;
+ QList childNodes;
+
+public:
+ using DoricSuperNode::DoricSuperNode;
+
+ QQuickItem *build() override;
+
+ virtual DoricViewNode *getSubNodeById(QString id) override;
+
+ virtual void blendSubNode(QJsonValue subProperties) override;
+
+ virtual void blend(QQuickItem *view, QString name, QJsonValue prop) override;
+
+ virtual void afterBlended(QJsonValue prop) override;
+};
+
+#endif // DORICLISTNODE_H