import { QMainWindow } from "./src/lib/QtWidgets/QMainWindow"; import { QWidget } from "./src/lib/QtGui/QWidget"; import { QGridLayout } from "./src/lib/QtWidgets/QGridLayout"; import { QLabel } from "./src/lib/QtWidgets/QLabel"; import { QPushButton, QPushButtonEvents } from "./src/lib/QtWidgets/QPushButton"; import { QCheckBox } from "./src/lib/QtWidgets/QCheckBox"; import { QProgressBar } from "./src/lib/QtWidgets/QProgressBar"; import { QRadioButton } from "./src/lib/QtWidgets/QRadioButton"; import { QLineEdit } from "./src/lib/QtWidgets/QLineEdit"; import { FlexLayout } from "./src/lib/core/FlexLayout"; import { QKeyEvent } from "./src/lib/QtGui/QEvent/QKeyEvent"; // 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"); label.setStyleSheet("background-color:blue; color:white;"); const button1 = new QPushButton(); button1.addEventListener(QPushButtonEvents.clicked, isChecked => { console.log("clicked", isChecked); }); button1.addEventListener(QPushButtonEvents.pressed, (...args) => { console.log("pressed", ...args); }); button1.addEventListener(QPushButtonEvents.released, (...args) => { console.log("released", ...args); }); button1.addEventListener(QPushButtonEvents.toggled, isToggled => { console.log("toggled", isToggled); }); button1.setText(`Button for Label with text: ${label.text()}`); const checkbox = new QCheckBox(); checkbox.setText("Checkbox text"); const progressbar = new QProgressBar(); const radiobutton = new QRadioButton(); const lineedit = new QLineEdit(); gridLayout.addWidget(label); gridLayout.addWidget(button1); gridLayout.addWidget(checkbox); gridLayout.addWidget(progressbar); gridLayout.addWidget(radiobutton); gridLayout.addWidget(lineedit); view.setLayout(gridLayout); win.show(); return win; }; // ----------------------------------------------- // BROKEN STUFF IN WINDOWS: // FLEX DIRECTION ROW // JUSTIFY CONTENT: SPACE-EVENLY, SPACE-AROUND // ALIGNSELF: STRETCH const example1 = () => { // rootView -> view1 -> label1 // -> label2 // -> view2 -> button const win = new QMainWindow(); win.setStyleSheet(` #root { background-color: grey; qproperty-qWidth: '100%'; qproperty-qHeight: '100%'; qproperty-alignItems: 'center'; qproperty-justifyContent: 'center'; qproperty-flex: 1; } #view1 { background-color: green; qproperty-flex: 1; qproperty-alignItems: 'center'; qproperty-justifyContent: 'center'; qproperty-qWidth: '100%'; } #view2 { background-color: orange; qproperty-flex: 1; qproperty-alignItems: 'center'; qproperty-justifyContent: 'center'; qproperty-qWidth: '100%'; } `); const rootView = new QWidget(); rootView.setObjectName("root"); const rootLayout = new FlexLayout(); rootLayout.setFlexNode(rootView.getFlexNode()); rootView.setLayout(rootLayout); //----------------------- const view1 = new QWidget(); view1.setObjectName(`view1`); const viewLayout = new FlexLayout(); viewLayout.setFlexNode(view1.getFlexNode()); view1.setLayout(viewLayout); const label = new QLabel(); label.setText("LABEL 1"); label.setObjectName("label1"); const label2 = new QLabel(); label2.setObjectName("label2"); label2.setText("LABEL 2"); viewLayout.addWidget(label); viewLayout.addWidget(label2); //---------------------------- const view2 = new QWidget(); view2.setObjectName("view2"); const view2Layout = new FlexLayout(); view2Layout.setFlexNode(view2.getFlexNode()); view2.setLayout(view2Layout); const button = new QPushButton(); button.setObjectName("button"); button.setText("BUTTON"); view2Layout.addWidget(button); //----------------------------- rootLayout.addWidget(view1); rootLayout.addWidget(view2); win.setCentralWidget(rootView); win.show(); return win; }; const example2 = ()=>{ const win = new QMainWindow(); win.setStyleSheet(` #root { background-color: grey; qproperty-qWidth: '100%'; qproperty-qHeight: '100%'; qproperty-alignItems: 'center'; qproperty-justifyContent: 'center'; qproperty-flexDirection: 'row'; qproperty-flex: 1; } #view1 { background-color: green; qproperty-flex: 1; qproperty-qHeight: '100%'; } #view2 { background-color: orange; qproperty-flex: 1; qproperty-qHeight: '100%'; } `); const rootView = new QWidget(); rootView.setObjectName("root"); const rootLayout = new FlexLayout(); rootLayout.setFlexNode(rootView.getFlexNode()); rootView.setLayout(rootLayout); //-------------------------------------- const view1 = new QWidget(); view1.setObjectName("view1"); //-------------------------------------- const view2 = new QWidget(); view2.setObjectName("view2"); //-------------------------------------- rootLayout.addWidget(view1); rootLayout.addWidget(view2); win.setCentralWidget(rootView); win.show(); return win; } // (global as any).win1 = testGridLayout(); //to keep gc from collecting // (global as any).ex1 = example1(); //to keep gc from collecting (global as any).ex2 = example2(); //to keep gc from collecting