From 0ea9675005a5b307d40dbfdefd3a5d0a84ae363a Mon Sep 17 00:00:00 2001 From: Atul R Date: Thu, 6 Jun 2019 10:00:04 +0200 Subject: [PATCH] Adds test flow for yoga widgets --- demo.ts | 84 +++++++++++++-------- src/cpp/core/FlexLayout/flexlayout_wrap.cpp | 12 ++- src/cpp/core/FlexLayout/flexlayout_wrap.h | 2 +- src/cpp/core/YogaWidget/yogawidget.h | 4 +- src/lib/QtGui/QWidget/index.ts | 5 +- src/lib/core/FlexLayout/index.ts | 4 + src/lib/core/YogaWidget/index.ts | 9 +++ 7 files changed, 81 insertions(+), 39 deletions(-) create mode 100644 src/lib/core/YogaWidget/index.ts diff --git a/demo.ts b/demo.ts index 237ce7e67..8e6c1f24e 100644 --- a/demo.ts +++ b/demo.ts @@ -9,45 +9,67 @@ import { QRadioButton } from "./src/lib/QtWidgets/QRadioButton"; import { QLineEdit } from "./src/lib/QtWidgets/QLineEdit"; import { FlexLayout } from "./src/lib/core/FlexLayout"; -const win = new QMainWindow(); -const view = new QWidget(); -win.setCentralWidget(view); +// Test all widgets in this one. This works as of now! +const testGridLayout = () => { + const win = new QMainWindow(); + const view = new QWidget(); + win.setCentralWidget(view); -const gridLayout = new QGridLayout(); -const label = new QLabel(); -label.setText("Testing1234"); + const gridLayout = new QGridLayout(); + const label = new QLabel(); + label.setText("Testing1234"); + label.setStyleSheet("background-color:blue; color:white;"); -const label2 = new QLabel(); -label2.setText("Hello12321"); -label2.setStyleSheet("background-color:blue; color:white;"); -const label2FlexNode = label2.getFlexNode(); -console.log("lbl2 flexNode", label2FlexNode.debugValue()); -const flayout = new FlexLayout(); -flayout.addWidget(label2, label2FlexNode); + const button1 = new QPushButton(); + button1.setText("Yolo"); -const button1 = new QPushButton(); -button1.setText("Yolo"); + const checkbox = new QCheckBox(); + checkbox.setText("Checkbox text"); -const checkbox = new QCheckBox(); -checkbox.setText("Pumpkeen"); + const progressbar = new QProgressBar(); -const progressbar = new QProgressBar(); + const radiobutton = new QRadioButton(); -const radiobutton = new QRadioButton(); + const lineedit = new QLineEdit(); -const lineedit = new QLineEdit(); + gridLayout.addWidget(label); + gridLayout.addWidget(button1); + gridLayout.addWidget(checkbox); + gridLayout.addWidget(progressbar); + gridLayout.addWidget(radiobutton); + gridLayout.addWidget(lineedit); -gridLayout.addWidget(label); -gridLayout.addWidget(label2); -gridLayout.addWidget(button1); -gridLayout.addWidget(checkbox); -gridLayout.addWidget(progressbar); -gridLayout.addWidget(radiobutton); -gridLayout.addWidget(lineedit); + view.setLayout(gridLayout); -view.setLayout(gridLayout); + win.show(); + return win; +}; -win.show(); -// app.exec(); +// ----------------------------------------------- -(global as any).win = win; //to keep gc from collecting +// Doesnt work as of now. Testing flex here. +const testFlexLayout = () => { + const win = new QMainWindow(); + const view = new QWidget(); + win.setCentralWidget(view); + const label = new QLabel(win); + label.setText("Hello12321"); + label.setStyleSheet("background-color:blue; color:white;"); + const flayout = new FlexLayout(); + view.setStyleSheet( + ` + background-color: green; + qproperty-flex: 1; + qproperty-alignItems: center; + qproperty-justifyContent:center; + ` + ); + flayout.setFlexNode(view.getFlexNode()); + flayout.addWidget(label, label.getFlexNode()); + view.setLayout(flayout); + win.show(); + return win; +}; + +(global as any).win1 = testGridLayout(); //to keep gc from collecting +// (global as any).win2 = testFlexLayout(); //to keep gc from collecting diff --git a/src/cpp/core/FlexLayout/flexlayout_wrap.cpp b/src/cpp/core/FlexLayout/flexlayout_wrap.cpp index 6b1fec8d1..4b1b33146 100644 --- a/src/cpp/core/FlexLayout/flexlayout_wrap.cpp +++ b/src/cpp/core/FlexLayout/flexlayout_wrap.cpp @@ -11,7 +11,7 @@ Napi::Object FlexLayoutWrap::init(Napi::Env env, Napi::Object exports) { char CLASSNAME[] = "FlexLayout"; Napi::Function func = DefineClass(env, CLASSNAME, { InstanceMethod("addWidget", &FlexLayoutWrap::addWidget), - // InstanceMethod("setFlexNode", &FlexLayoutWrap::setFlexNode) + InstanceMethod("setFlexNode", &FlexLayoutWrap::setFlexNode), }); constructor = Napi::Persistent(func); exports.Set(CLASSNAME, func); @@ -58,3 +58,13 @@ Napi::Value FlexLayoutWrap::addWidget(const Napi::CallbackInfo& info) { return env.Null(); } +Napi::Value FlexLayoutWrap::setFlexNode(const Napi::CallbackInfo& info) { + Napi::Env env = info.Env(); + Napi::HandleScope scope(env); + + Napi::Object flexNodeObject = info[0].As(); + FlexNodeWrap* flexNodeWrap = Napi::ObjectWrap::Unwrap(flexNodeObject); + this->instance->setFlexNode(flexNodeWrap->getInternalInstance()); + + return env.Null(); +} diff --git a/src/cpp/core/FlexLayout/flexlayout_wrap.h b/src/cpp/core/FlexLayout/flexlayout_wrap.h index 62a4ae21a..534914c2c 100644 --- a/src/cpp/core/FlexLayout/flexlayout_wrap.h +++ b/src/cpp/core/FlexLayout/flexlayout_wrap.h @@ -17,7 +17,7 @@ class FlexLayoutWrap : public Napi::ObjectWrap{ static Napi::FunctionReference constructor; //wrapped methods Napi::Value addWidget(const Napi::CallbackInfo& info); - // Napi::Value setFlexNode(const Napi::CallbackInfo& info); + Napi::Value setFlexNode(const Napi::CallbackInfo& info); }; #endif //FLEXLAYOUT_WRAP_H \ No newline at end of file diff --git a/src/cpp/core/YogaWidget/yogawidget.h b/src/cpp/core/YogaWidget/yogawidget.h index fce359f05..b35712e95 100644 --- a/src/cpp/core/YogaWidget/yogawidget.h +++ b/src/cpp/core/YogaWidget/yogawidget.h @@ -1,5 +1,4 @@ -#ifndef YOGAWIDGET_H -#define YOGAWIDGET_H +#pragma once #include #include #include "nodestyle.h" @@ -163,4 +162,3 @@ public: }; -#endif // YOGAWIDGET_H diff --git a/src/lib/QtGui/QWidget/index.ts b/src/lib/QtGui/QWidget/index.ts index 012159787..ba65874df 100644 --- a/src/lib/QtGui/QWidget/index.ts +++ b/src/lib/QtGui/QWidget/index.ts @@ -1,10 +1,9 @@ import addon from "../../core/addon"; import { QLayout } from "../../QtWidgets/QLayout"; -import { Component } from "../../core/Component"; +import { YogaWidget } from "../../core/YogaWidget"; // Implement all native QWidget methods here so that all widgets get access to those aswell -export abstract class NodeWidget extends Component { - abstract native: any; +export abstract class NodeWidget extends YogaWidget { abstract layout?: QLayout; show() { this.native.show(); diff --git a/src/lib/core/FlexLayout/index.ts b/src/lib/core/FlexLayout/index.ts index e4cf51ab7..25c140278 100644 --- a/src/lib/core/FlexLayout/index.ts +++ b/src/lib/core/FlexLayout/index.ts @@ -6,6 +6,10 @@ import { FlexNode } from "./FlexNode"; export class FlexLayout extends Component { native = new addon.FlexLayout(); addWidget(childWidget: QWidget, childFlexNode: FlexNode) { + this.children.add(childWidget); this.native.addWidget(childWidget.native, childFlexNode.native); } + setFlexNode(flexNode: FlexNode) { + this.native.setFlexNode(flexNode.native); + } } diff --git a/src/lib/core/YogaWidget/index.ts b/src/lib/core/YogaWidget/index.ts new file mode 100644 index 000000000..515769f01 --- /dev/null +++ b/src/lib/core/YogaWidget/index.ts @@ -0,0 +1,9 @@ +import { Component } from "../Component"; +import { FlexNode } from "../FlexLayout/FlexNode"; + +export abstract class YogaWidget extends Component { + getFlexNode(): FlexNode { + const nativeFlexNode = this.native.getFlexNode(); + return new FlexNode(nativeFlexNode); + } +}