From e35f0a79c458554483700ccf2e6665a59587075c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=8E=8B=E5=8A=B2=E9=B9=8F?= <jingpeng.wang@outlook.com>
Date: Mon, 1 Mar 2021 18:59:09 +0800
Subject: [PATCH] add simple layout demo

---
 doric-Qt/doric/demo/DoricDemoBridge.cpp | 54 +++++++++++++------------
 doric-Qt/doric/doric.pro.user           |  2 +-
 doric-Qt/doric/qml.qrc                  |  4 +-
 doric-Qt/doric/resources/main.qml       | 15 +++++--
 doric-Qt/doric/resources/vlayout.qml    |  4 --
 doric-demo/src/SimpleDemo.ts            | 28 +++++++++++++
 6 files changed, 71 insertions(+), 36 deletions(-)
 create mode 100644 doric-demo/src/SimpleDemo.ts

diff --git a/doric-Qt/doric/demo/DoricDemoBridge.cpp b/doric-Qt/doric/demo/DoricDemoBridge.cpp
index c17f078d..c8a48edd 100644
--- a/doric-Qt/doric/demo/DoricDemoBridge.cpp
+++ b/doric-Qt/doric/demo/DoricDemoBridge.cpp
@@ -8,33 +8,37 @@
 DoricDemoBridge::DoricDemoBridge(QObject *parent) : QObject(parent) {}
 
 void DoricDemoBridge::navigate(QVariant route) {
+  QString name;
   switch (route.toInt()) {
   case 0:
-    QString name = "Snake.es5.js";
-    QString script = DoricUtils::readAssetFile("/doric/bundles", name);
-
-    QQuickView *view = new QQuickView();
-    {
-      const QUrl url(QStringLiteral("qrc:/doric/qml/view.qml"));
-      view->setSource(url);
-      view->setWidth(450);
-      view->setHeight(800);
-    }
-
-    {
-      QQmlComponent component(view->engine());
-      const QUrl url(QStringLiteral("qrc:/doric/qml/panel.qml"));
-      component.loadUrl(url);
-      QQuickItem *quickItem = qobject_cast<QQuickItem *>(component.create());
-      DoricPanel *panel = new DoricPanel(view->engine(), quickItem);
-      quickItem->setWidth(450);
-      quickItem->setHeight(800);
-      quickItem->setParentItem(view->rootObject());
-
-      panel->config(script, name, NULL);
-    }
-
-    view->show();
+    name = "SimpleDemo.es5.js";
+    break;
+  case 1:
+    name = "Snake.es5.js";
     break;
   }
+  QString script = DoricUtils::readAssetFile("/doric/bundles", name);
+
+  QQuickView *view = new QQuickView();
+  {
+    const QUrl url(QStringLiteral("qrc:/doric/qml/view.qml"));
+    view->setSource(url);
+    view->setWidth(450);
+    view->setHeight(800);
+  }
+
+  {
+    QQmlComponent component(view->engine());
+    const QUrl url(QStringLiteral("qrc:/doric/qml/panel.qml"));
+    component.loadUrl(url);
+    QQuickItem *quickItem = qobject_cast<QQuickItem *>(component.create());
+    DoricPanel *panel = new DoricPanel(view->engine(), quickItem);
+    quickItem->setWidth(450);
+    quickItem->setHeight(800);
+    quickItem->setParentItem(view->rootObject());
+
+    panel->config(script, name, NULL);
+  }
+
+  view->show();
 }
diff --git a/doric-Qt/doric/doric.pro.user b/doric-Qt/doric/doric.pro.user
index b16dc97b..defeabde 100644
--- a/doric-Qt/doric/doric.pro.user
+++ b/doric-Qt/doric/doric.pro.user
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE QtCreatorProject>
-<!-- Written by QtCreator 4.14.0, 2021-03-01T11:14:08. -->
+<!-- Written by QtCreator 4.14.0, 2021-03-01T18:01:24. -->
 <qtcreator>
  <data>
   <variable>EnvironmentId</variable>
diff --git a/doric-Qt/doric/qml.qrc b/doric-Qt/doric/qml.qrc
index a2a7c05c..fc6f7c10 100644
--- a/doric-Qt/doric/qml.qrc
+++ b/doric-Qt/doric/qml.qrc
@@ -4,13 +4,11 @@
         <file alias="qtquickcontrols2.conf">./resources/qtquickcontrols2.conf</file>
     </qresource>
     <qresource prefix="/doric">
-        <file alias="doric-sandbox.js">../../doric-js/bundle/doric-sandbox.js</file>
         <file alias="doric-sandbox.es5.js">../../doric-js/bundle/doric-sandbox.es5.js</file>
-        <file alias="doric-lib.js">../../doric-js/bundle/doric-lib.js</file>
         <file alias="doric-lib.es5.js">../../doric-js/bundle/doric-lib.es5.js</file>
     </qresource>
     <qresource prefix="/doric/bundles">
-        <file alias="Snake.js">../../doric-demo/bundle/src/Snake.js</file>
+        <file alias="SimpleDemo.es5.js">../../doric-demo/bundle/src/SimpleDemo.es5.js</file>
         <file alias="Snake.es5.js">../../doric-demo/bundle/src/Snake.es5.js</file>
     </qresource>
     <qresource prefix="/doric/qml">
diff --git a/doric-Qt/doric/resources/main.qml b/doric-Qt/doric/resources/main.qml
index e0a81f51..efd236b6 100644
--- a/doric-Qt/doric/resources/main.qml
+++ b/doric-Qt/doric/resources/main.qml
@@ -12,19 +12,28 @@ ApplicationWindow {
 
         ListView {
             width: parent.width
-            model: 1
+            model: 2
             delegate: Rectangle {
                 Column {
                     anchors.centerIn: parent
                     Text {
-                        text: {return "Snake.js"}
+                        text: {
+                            switch (index) {
+                                case 0:
+                                    return "SimpleDemo.es5.js"
+                                case 1:
+                                    return "Snake.es5.js"
+                            }
+                        }
                     }
                 }
                 width: parent.width
                 height: 60
                 MouseArea {
                     anchors.fill: parent
-                    onClicked: {demoBridge.navigate(index)}
+                    onClicked: {
+                        demoBridge.navigate(index)
+                    }
                 }
             }
         }
diff --git a/doric-Qt/doric/resources/vlayout.qml b/doric-Qt/doric/resources/vlayout.qml
index 0e84f92c..1fab265d 100644
--- a/doric-Qt/doric/resources/vlayout.qml
+++ b/doric-Qt/doric/resources/vlayout.qml
@@ -3,9 +3,5 @@ import QtQuick.Controls 2.5
 
 Flex {
     flexDirection: "column"
-    alignItems: "center"
-    alignSelf: "center"
-    justifyContent: "spaceAround"
-    alignContent: "stretch"
 }
 
diff --git a/doric-demo/src/SimpleDemo.ts b/doric-demo/src/SimpleDemo.ts
new file mode 100644
index 00000000..563a24e0
--- /dev/null
+++ b/doric-demo/src/SimpleDemo.ts
@@ -0,0 +1,28 @@
+import { Group, Panel, text, gravity, Color, LayoutSpec, vlayout, hlayout, scroller, layoutConfig, stack, Gravity } from "doric";
+
+@Entry
+class LayoutDemo extends Panel {
+    build(rootView: Group) {
+        hlayout([
+            stack([], {
+                width: 100,
+                height: 100,
+                backgroundColor: Color.RED
+            }),
+            stack([], {
+                width: 100,
+                height: 100,
+                backgroundColor: Color.GREEN
+            }),
+            stack([], {
+                width: 100,
+                height: 100,
+                backgroundColor: Color.BLUE
+            })
+        ], {
+            width: 300,
+            height: 300,
+            backgroundColor: Color.BLACK
+        }).in(rootView)
+    }
+}
\ No newline at end of file