export Creator Widget component to Cocos2d-x Layout Node

.gitignore

@@ -63,3 +63,9 @@ quick_gen_project_*_autogen.sh.meta
 #/////////////////////////////////////////////////////////////////////////////
 
 .idea/
+
+#/////////////////////////////////////////////////////////////////////////////
+# vscode files
+#/////////////////////////////////////////////////////////////////////////////
+
+.vscode/

creator_project/packages/creator-luacpp-support/CreatorReader.fbs

@@ -102,6 +102,7 @@ table Node
     tag:int = 0;
     anim:AnimationRef;
     colliders:[Collider];
+    widget:Widget;
     groupIndex:int;
 }
 
@@ -354,6 +355,24 @@ table Collider
     radius:float;                   // CircleCollider
 }
 
+table Widget
+{
+    isAlignOnce:bool;
+    alignFlags:int;
+    left:float;
+    right:float;
+    top:float;
+    bottom:float;
+    verticalCenter:float;
+    horizontalCenter:float;
+    isAbsLeft:bool;
+    isAbsRight:bool;
+    isAbsTop:bool;
+    isAbsBottom:bool;
+    isAbsHorizontalCenter:bool;
+    isAbsVerticalCenter:bool;
+}
+
 table DragonBones
 {
     node:Node;

creator_project/packages/creator-luacpp-support/core/parser/Node.js

@@ -1,5 +1,6 @@
 const state = require('./Global').state;
 const Collider = require('./Collider');
+const Widget = require('./Widget');
 let Utils = require('./Utils');
 const fs = require('fs');
 
@@ -194,6 +195,7 @@ class Node {
 
         this.parse_clip();
         this.parse_colliders();
+        this.parse_widget();
     }
 
     parse_child(node_idx) {
@@ -224,6 +226,13 @@ class Node {
         }
     }
 
+    parse_widget() {
+        let component = Node.get_node_components_of_type(this._node_data, 'cc.Widget');
+        if(component.length === 1) {
+            this._properties.widget = Widget.parse(component[0]);
+        }
+    }
+
     parse_clip() {
         let component = Node.get_node_component_of_type(this._node_data, 'cc.Animation');
         if (component) {

creator_project/packages/creator-luacpp-support/core/parser/Utils.js

@@ -220,7 +220,7 @@ let get_tiledmap_path_by_uuid = function (uuid) {
     }
 }
 
-let DEBUG = false;
+let DEBUG = true;
 log = function(s) {
     if (DEBUG)
         Utils.log(s);

creator_project/packages/creator-luacpp-support/core/parser/Widget.js

@@ -0,0 +1,34 @@
+let Utils = require('./Utils');
+
+class Widget {
+    static parse(data) {
+        let result = {};
+
+        result.isAlignOnce = data.isAlignOnce;
+        result.alignFlags = data._alignFlags;
+
+        // margin value, only support pixel, didn't support percentage
+        result.left = data._left;
+        result.right = data._right;
+        result.top = data._top;
+        result.bottom = data._bottom;
+        result.verticalCenter = data._verticalCenter;
+        result.horizontalCenter = data._horizontalCenter;
+
+        // If true, value is pixel, otherwise is percentage (0 - 1)
+        // invalid value in cocos2d-x
+        result.isAbsLeft = data._isAbsLeft;
+        result.isAbsRight = data._isAbsRight;
+        result.isAbsTop = data._isAbsTop;
+        result.isAbsBottom = data._isAbsBottom;
+        result.isAbsHorizontalCenter = data._isAbsHorizontalCenter;
+        result.isAbsVerticalCenter = data._isAbsVerticalCenter;
+
+        Utils.log("parse widget result value:" + JSON.stringify(result));
+
+        return result;
+    }
+}
+
+
+module.exports = Widget;

creator_project/packages/creator-luacpp-support/reader/CMakeLists.txt

@@ -31,6 +31,7 @@ set(READER_HEADER
     Macros.h
     ui/RichtextStringVisitor.h
     ui/PageView.h
+    ui/WidgetExport.h
 )
 
 set(READER_SOURCE
@@ -46,6 +47,7 @@ set(READER_SOURCE
     CreatorReader.cpp
     ui/PageView.cpp
     ui/RichtextStringVisitor.cpp
+    ui/WidgetExport.cpp
 )
 
 if(BUILD_LUA_LIBS)

creator_project/packages/creator-luacpp-support/reader/CreatorReader.cpp

@@ -131,12 +131,20 @@ CreatorReader::CreatorReader()
 {
     _animationManager = new AnimationManager();
     _collisionManager = new ColliderManager();
+    _widgetManager = new WidgetManager();
+    _animationManager->autorelease();
+    _collisionManager->autorelease();
+    _widgetManager->autorelease();
+    CC_SAFE_RETAIN(_animationManager);
+    CC_SAFE_RETAIN(_collisionManager);
+    CC_SAFE_RETAIN(_widgetManager);
 }
 
 CreatorReader::~CreatorReader()
 {
     CC_SAFE_RELEASE_NULL(_collisionManager);
     CC_SAFE_RELEASE_NULL(_animationManager);
+    CC_SAFE_RELEASE_NULL(_widgetManager);
 }
 
 CreatorReader* CreatorReader::createWithFilename(const std::string& filename)
@@ -274,11 +282,14 @@ cocos2d::Scene* CreatorReader::getSceneGraph() const
             child->setPosition(child->getPosition() + _positionDiffDesignResolution);
 
     _animationManager->playOnLoad();
-    
+
     node->addChild(_collisionManager);
     node->addChild(_animationManager);
     _collisionManager->start();
 
+    _widgetManager->setupWidgets();
+    node->addChild(_widgetManager);
+
     return static_cast<cocos2d::Scene*>(node);
 }
 
@@ -292,6 +303,11 @@ ColliderManager* CreatorReader::getColliderManager() const
     return _collisionManager;
 }
 
+WidgetManager* CreatorReader::getWidgetManager() const
+{
+    return _widgetManager;
+}
+
 std::string CreatorReader::getVersion() const
 {
     return _version;
@@ -465,6 +481,8 @@ void CreatorReader::parseNode(cocos2d::Node* node, const buffers::Node* nodeBuff
     parseNodeAnimation(node, nodeBuffer);
 
     parseColliders(node, nodeBuffer);
+
+    parseWidget(node, nodeBuffer);
 }
 
 void CreatorReader::parseNodeAnimation(cocos2d::Node* node, const buffers::Node* nodeBuffer) const
@@ -599,6 +617,62 @@ void CreatorReader::parseColliders(cocos2d::Node* node, const buffers::Node* nod
         _collisionManager->addCollider(collider);
 }
 
+void CreatorReader::parseWidget(cocos2d::Node *node, const buffers::Node *nodeBuffer) const
+{
+    const auto& info = nodeBuffer->widget();
+    auto widgetNode = dynamic_cast<ui::Widget*>(node);
+    if ((info != nullptr) && (widgetNode != nullptr)) {
+        // save the widget margin info
+        const auto& margin = ui::Margin(info->left(),info->top(),info->right(), info->bottom());
+        auto parameter = ui::RelativeLayoutParameter::create();
+        parameter->setMargin(margin);
+
+        WidgetAdapter::AlignComb alignComb = static_cast<WidgetAdapter::AlignComb>(info->alignFlags());
+        switch (alignComb) {
+            case WidgetAdapter::AlignComb::TOP_LEFT :
+                parameter->setAlign(cocos2d::ui::RelativeLayoutParameter::RelativeAlign::PARENT_TOP_LEFT);
+                break;
+            case WidgetAdapter::AlignComb::TOP_RIGHT :
+                parameter->setAlign(cocos2d::ui::RelativeLayoutParameter::RelativeAlign::PARENT_TOP_RIGHT);
+                break;
+            case WidgetAdapter::AlignComb::RIGHT_BOTTOM :
+                parameter->setAlign(cocos2d::ui::RelativeLayoutParameter::RelativeAlign::PARENT_RIGHT_BOTTOM);
+                break;
+            case WidgetAdapter::AlignComb::LEFT_BOTTOM :
+                parameter->setAlign(cocos2d::ui::RelativeLayoutParameter::RelativeAlign::PARENT_LEFT_BOTTOM);
+                break;
+            case WidgetAdapter::AlignComb::LEFT_CENTER_VERTICAL :
+                parameter->setAlign(cocos2d::ui::RelativeLayoutParameter::RelativeAlign::PARENT_LEFT_CENTER_VERTICAL);
+                break;
+            case WidgetAdapter::AlignComb::RIGHT_CENTER_VERTICAL :
+                parameter->setAlign(cocos2d::ui::RelativeLayoutParameter::RelativeAlign::PARENT_RIGHT_CENTER_VERTICAL);
+                break;
+            case WidgetAdapter::AlignComb::TOP_CENTER_HORIZONTAL :
+                parameter->setAlign(cocos2d::ui::RelativeLayoutParameter::RelativeAlign::PARENT_TOP_CENTER_HORIZONTAL);
+                break;
+            case WidgetAdapter::AlignComb::BOTTOM_CENTER_HORIZONTAL :
+                parameter->setAlign(cocos2d::ui::RelativeLayoutParameter::RelativeAlign::PARENT_BOTTOM_CENTER_HORIZONTAL);
+                break;
+            case WidgetAdapter::AlignComb::CENTER_IN_PARENT :
+                parameter->setAlign(cocos2d::ui::RelativeLayoutParameter::RelativeAlign::CENTER_IN_PARENT);
+                break;
+            default:
+                CCLOG("align combination of UI Node: %s isn't supported", node->getName().c_str());
+                CCASSERT(false, "Only 9 creator align combinations are supported by cocos2d-x");
+                break;
+        }
+
+        auto widgetInfo = WidgetAdapter::create();
+        // TODO: support Layout target, how to get the layout target?
+        // parameter->setRelativeToWidgetName(const std::string &name);
+        // widgetInfo->setLayoutTarget(cocos2d::Node *layoutTarget);
+        widgetNode->setLayoutParameter(parameter);
+        widgetInfo->setAdaptNode(widgetNode);
+        widgetInfo->setIsAlignOnce(info->isAlignOnce());
+        _widgetManager->_needAdaptWidgets.pushBack(widgetInfo);
+    }
+}
+
 cocos2d::Sprite* CreatorReader::createSprite(const buffers::Sprite* spriteBuffer) const
 {
     cocos2d::Sprite* sprite = cocos2d::Sprite::create();

creator_project/packages/creator-luacpp-support/reader/CreatorReader.h

@@ -34,6 +34,7 @@
 #include "collider/ColliderManager.h"
 #include "dragonbones/DragonBonesHeaders.h"
 #include "dragonbones/cocos2dx/CCDragonBonesHeaders.h"
+#include "ui/WidgetExport.h"
 
 
 
@@ -62,6 +63,12 @@ class CreatorReader: public cocos2d::Ref
      */
     ColliderManager* getColliderManager() const;
 
+    /**
+     Return the WidgetManager. It is added as a child of the Scene to make Creator Widget component take effect.
+     @return The `WidgetManager` of the scene
+     */
+    WidgetManager* getWidgetManager() const;
+
     /**
      Returns the FlatBuffers Schema version.
      @return a string containing the flatbuffer's schema version
@@ -88,6 +95,7 @@ class CreatorReader: public cocos2d::Ref
     void parseNode(cocos2d::Node* node, const buffers::Node* nodeBuffer) const;
     void parseNodeAnimation(cocos2d::Node* node, const buffers::Node* nodeBuffer) const;
     void parseColliders(cocos2d::Node* node, const buffers::Node* nodeBuffer) const;
+    void parseWidget(cocos2d::Node* node, const buffers::Node* nodeBuffer) const;
 
     cocos2d::Sprite* createSprite(const buffers::Sprite* spriteBuffer) const;
     void parseSprite(cocos2d::Sprite* sprite, const buffers::Sprite* spriteBuffer) const;
@@ -160,14 +168,17 @@ class CreatorReader: public cocos2d::Ref
     // variables
     cocos2d::Data _data;
     std::string _version;
-    
+
     AnimationManager *_animationManager;
     ColliderManager *_collisionManager;
+
+    // Widget in creator is a component used to do Layout
+    WidgetManager *_widgetManager;
 
     // creator will make scene at the center of screen when apply design solution strategy, cocos2d-x doesn't do it like this
     // this value record the diff
     cocos2d::Vec2 _positionDiffDesignResolution;
-    
+
     CREATOR_DISALLOW_COPY_ASSIGN_AND_MOVE(CreatorReader);
 };