diff --git a/docs/README.md b/docs/README.md index a47cdd0b3..3eaf75b02 100644 --- a/docs/README.md +++ b/docs/README.md @@ -36,6 +36,12 @@ - [QMainWindow (Window)](api/QMainWindow.md) - [QWidget (View)](api/QWidget.md) +- [QLabel (Text)](api/QLabel.md) +- [QPushButton (Button)](api/QPushButton.md) +- [QRadioButton (RadioButton)](api/QRadioButton.md) +- [QCheckBox (CheckBox)](api/QCheckBox.md) +- [QLineEdit (LineEdit)](api/QLineEdit.md) +- [QProgressBar (ProgressBar)](api/QProgressBar.md) - [FlexLayout](api/FlexLayout.md) ### Internal Modules @@ -46,6 +52,11 @@ - [Component](api/Component.md) - [YogaWidget](api/YogaWidget.md) +## Usage + +- [Events usage](todo) +- [Yoga properties using stylesheet usage](todo) + ## Development See [development/README.md](development/README.md) diff --git a/docs/api/EventWidget.md b/docs/api/EventWidget.md index fb8adc50a..55df137f6 100644 --- a/docs/api/EventWidget.md +++ b/docs/api/EventWidget.md @@ -43,7 +43,7 @@ EventWidget can access all the instance methods defined in [YogaWidget](api/Yoga Additionally it also has the following instance methods: -#### `widget.addEventListener()` +#### `widget.addEventListener(eventType, callback)` Adds an event listener to the widget to listen to events that occur on a widget. @@ -51,7 +51,7 @@ Adds an event listener to the widget to listen to events that occur on a widget. - `callback` (payload?: NativeEvent | any) => void - A callback function to invoke when an event occurs. Usually you receive a nativeEvent or a string as argument. -#### `widget.removeEventListener()` +#### `widget.removeEventListener(eventType, callback?)` Removes the specified event listener from the widget. diff --git a/docs/api/FlexLayout.md b/docs/api/FlexLayout.md index 96736bea8..7f8346338 100644 --- a/docs/api/FlexLayout.md +++ b/docs/api/FlexLayout.md @@ -40,14 +40,14 @@ FlexLayout can access all the instance methods defined in [NodeLayout](api/NodeL Additionally it also has the following instance methods: -#### `layout.addWidget()` +#### `layout.addWidget(childWidget, childFlexNode?)` Adds the childWidget to the layout. It calls the native method of custom FlexLayout. - `childWidget` NodeWidget - child widget that needs to be added to the layout. - `childFlexNode` flexNode ref (_Optional_) - flexNode reference of the child widget. You can get this by calling `childWidget.getFlexNode()`. -#### `layout.insertChildBefore()` +#### `layout.insertChildBefore(childWidget, beforeChildWidget, childFlexNode?, beforeChildFlexNode?)` Adds the childWidget before another already set childWidget in the layout. It calls the native method of custom FlexLayout. @@ -56,14 +56,14 @@ Adds the childWidget before another already set childWidget in the layout. It ca - `childFlexNode` flexNode ref (_Optional_) - flexNode reference of the child widget. You can get this by calling `childWidget.getFlexNode()`. - `beforeChildFlexNode` flexNode ref (_Optional_) - flexNode reference of the before child widget. You can get this by calling `beforeChildWidget.getFlexNode()`. -#### `layout.removeWidget()` +#### `layout.removeWidget(childWidget, childFlexNode?)` Removes the childWidget from the layout. It calls the native method of custom FlexLayout. - `childWidget` NodeWidget - child widget that needs to be added to the layout. - `childFlexNode` flexNode ref (_Optional_) - flexNode reference of the child widget. You can get this by calling `childWidget.getFlexNode()`. -#### `layout.setFlexNode()` +#### `layout.setFlexNode(flexNode)` A layout doesnt have its own flexNode. This method sets the flex Node to use for calculating position of the child widgets. Hence this should be always equal to the flex node of widget for which this layout is set. This is called internally by `widget.setLayout`. diff --git a/docs/api/NodeLayout.md b/docs/api/NodeLayout.md index 660ea26f1..a6c51c35e 100644 --- a/docs/api/NodeLayout.md +++ b/docs/api/NodeLayout.md @@ -51,7 +51,7 @@ NodeLayout can access all the instance methods defined in [Component](api/Compon Additionally it also has the following instance methods: -#### `layout.addWidget()` +#### `layout.addWidget(childWidget, ...args)` This is an abstract method in NodeLayout class. All Layouts inheriting from NodeLayout should implement this method. diff --git a/docs/api/NodeWidget.md b/docs/api/NodeWidget.md index 3abf4206e..bc3167622 100644 --- a/docs/api/NodeWidget.md +++ b/docs/api/NodeWidget.md @@ -58,7 +58,7 @@ Additionally it also has the following instance methods: Shows the widget and its children. It calls the native method [QWidget: show](https://doc.qt.io/qt-5/qwidget.html#show). -#### `widget.resize()` +#### `widget.resize(width, height)` Resizes the widget. It calls the native method [QWidget: resize](https://doc.qt.io/qt-5/qwidget.html#resize-1). @@ -70,13 +70,13 @@ Resizes the widget. It calls the native method [QWidget: resize](https://doc.qt. Closes this widget. It calls the native method [QWidget: close](https://doc.qt.io/qt-5/qwidget.html#close). Returns true if the widget was closed; otherwise returns false. -#### `widget.setLayout()` +#### `widget.setLayout(layout)` -Sets the layout manager for this widget to parentLayout. It calls the native method [QWidget: setLayout](https://doc.qt.io/qt-5/qwidget.html#setLayout). +Sets the layout manager for this widget to layout. It calls the native method [QWidget: setLayout](https://doc.qt.io/qt-5/qwidget.html#setLayout). -- `parentLayout` NodeLayout - Any layout that inherits from NodeLayout class. +- `layout` NodeLayout - Any layout that inherits from NodeLayout class. -#### `widget.setStyleSheet()` +#### `widget.setStyleSheet(styleSheet)` Sets the property that holds the widget's style sheet. It calls the native method [QWidget: styleSheet](https://doc.qt.io/qt-5/qwidget.html#styleSheet-prop). @@ -86,39 +86,39 @@ Sets the property that holds the widget's style sheet. It calls the native metho Hides the widget and its children. It calls the native method [QWidget: hide](https://doc.qt.io/qt-5/qwidget.html#hide). -#### `widget.setObjectName()` +#### `widget.setObjectName(objectName)` Sets the object name of the widget in Qt. It calls the native method [QObject: setObjectName](https://doc.qt.io/qt-5/qobject.html#objectName-prop). Object name can be analogous to `id` of an element in the web world. Using the objectName of the widget one can reference it in the Qt's stylesheet much like what we do with id in the web world. - `objectName` string - String which holds the widget's object name. -#### `widget.setMouseTracking()` +#### `widget.setMouseTracking(isMouseTracked)` Sets the property that tells whether mouseTracking is enabled for the widget. It calls the native method [QWidget: mouseTracking](https://doc.qt.io/qt-5/qwidget.html#mouseTracking-prop). - `isMouseTracked` boolean - Set it to true to enable mouse tracking. -#### `widget.setEnabled()` +#### `widget.setEnabled(enabled)` Sets the property that tells whether the widget is enabled. It calls the native method [QWidget: enabled](https://doc.qt.io/qt-5/qwidget.html#enabled-prop). In general an enabled widget handles keyboard and mouse events; a disabled widget does not. - `enabled` boolean - Set it to true to enable the widget. -#### `widget.setFixedSize()` +#### `widget.setFixedSize(width, height)` Sets both the minimum and maximum sizes of the widget. It calls the native method [QWidget: setFixedSize](https://doc.qt.io/qt-5/qwidget.html#setFixedSize). - `width` number - Pixels. - `height` number - Pixels. -#### `widget.setMaximumSize()` +#### `widget.setMaximumSize(width, height)` Sets the maximum size of the widget. It calls the native method [QWidget: setMaximumSize](https://doc.qt.io/qt-5/qwidget.html#setMaximumSize-1). - `width` number - Pixels. - `height` number - Pixels. -#### `widget.setMinimumSize()` +#### `widget.setMinimumSize(width, height)` Sets the minimum size of the widget. It calls the native method [QWidget: setMinimumSize](https://doc.qt.io/qt-5/qwidget.html#setMinimumSize-1). diff --git a/docs/api/QCheckBox.md b/docs/api/QCheckBox.md new file mode 100644 index 000000000..ddc4e6431 --- /dev/null +++ b/docs/api/QCheckBox.md @@ -0,0 +1,42 @@ +## Class: QCheckBox + +> Create and control checkbox. + +**This class is a JS wrapper around Qt's [QCheckBox class](https://doc.qt.io/qt-5/qcheckbox.html)** + +A `QCheckBox` provides ability to add and manipulate native checkbox widgets. + +**QCheckBox inherits from [NodeWidget](api/NodeWidget.md)** + +### Example + +```javascript +const { QCheckBox } = require("@nodegui/nodegui"); + +const checkbox = new QCheckBox(); +checkbox.setText("Hello"); +``` + +### `new QCheckBox(parent?)` + +- `parent` NodeWidget (_optional_). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget. + +### Static Methods + +QCheckBox can access all the static methods defined in [NodeWidget](api/NodeWidget.md) + +### Instance Properties + +QCheckBox can access all the instance properties defined in [NodeWidget](api/NodeWidget.md) + +### Instance Methods + +QCheckBox can access all the instance methods defined in [NodeWidget](api/NodeWidget.md) + +Additionally it also has the following instance methods: + +#### `checkbox.setText(text)` + +Sets the given text to the checkbox. + +- `text` string diff --git a/docs/api/QLabel.md b/docs/api/QLabel.md new file mode 100644 index 000000000..fa1ebdd17 --- /dev/null +++ b/docs/api/QLabel.md @@ -0,0 +1,50 @@ +## Class: QLabel + +> Create and control text. + +**This class is a JS wrapper around Qt's [QLabel class](https://doc.qt.io/qt-5/qlabel.html)** + +A `QLabel` provides ability to add and manipulate text. + +**QLabel inherits from [NodeWidget](api/NodeWidget.md)** + +### Example + +```javascript +const { QLabel } = require("@nodegui/nodegui"); + +const label = new QLabel(); +label.setText("Hello"); +``` + +### `new QLabel(parent?)` + +- `parent` NodeWidget (_optional_). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget. + +### Static Methods + +QLabel can access all the static methods defined in [NodeWidget](api/NodeWidget.md) + +### Instance Properties + +QLabel can access all the instance properties defined in [NodeWidget](api/NodeWidget.md) + +### Instance Methods + +QLabel can access all the instance methods defined in [NodeWidget](api/NodeWidget.md) + +Additionally it also has the following instance methods: + +#### `label.setText(text)` + +Sets the given text to the label. + +- `text` string + +#### `label.text()` + +returns the current text from the label. + +#### `label.setWordWrap(on)` + +- `on` boolean - If true it sets wordwrap on the label diff --git a/docs/api/QLineEdit.md b/docs/api/QLineEdit.md new file mode 100644 index 000000000..3f818728e --- /dev/null +++ b/docs/api/QLineEdit.md @@ -0,0 +1,33 @@ +## Class: QLineEdit + +> Create and control editable text field. + +**This class is a JS wrapper around Qt's [QLineEdit class](https://doc.qt.io/qt-5/qlineedit.html)** + +A `QLineEdit` provides ability to add and manipulate native editable text field widgets. + +**QLineEdit inherits from [NodeWidget](api/NodeWidget.md)** + +### Example + +```javascript +const { QLineEdit } = require("@nodegui/nodegui"); + +const lineEdit = new QLineEdit(); +``` + +### `new QLineEdit(parent?)` + +- `parent` NodeWidget (_optional_). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget. + +### Static Methods + +QLineEdit can access all the static methods defined in [NodeWidget](api/NodeWidget.md) + +### Instance Properties + +QLineEdit can access all the instance properties defined in [NodeWidget](api/NodeWidget.md) + +### Instance Methods + +QLineEdit can access all the instance methods defined in [NodeWidget](api/NodeWidget.md) diff --git a/docs/api/QProgressBar.md b/docs/api/QProgressBar.md new file mode 100644 index 000000000..5acb21597 --- /dev/null +++ b/docs/api/QProgressBar.md @@ -0,0 +1,33 @@ +## Class: QProgressBar + +> Create and control progress bar widgets. + +**This class is a JS wrapper around Qt's [QProgressBar class](https://doc.qt.io/qt-5/qprogressbar.html)** + +A `QProgressBar` provides ability to add and manipulate native progress bar widgets. + +**QProgressBar inherits from [NodeWidget](api/NodeWidget.md)** + +### Example + +```javascript +const { QProgressBar } = require("@nodegui/nodegui"); + +const progressBar = new QProgressBar(); +``` + +### `new QProgressBar(parent?)` + +- `parent` NodeWidget (_optional_). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget. + +### Static Methods + +QProgressBar can access all the static methods defined in [NodeWidget](api/NodeWidget.md) + +### Instance Properties + +QProgressBar can access all the instance properties defined in [NodeWidget](api/NodeWidget.md) + +### Instance Methods + +QProgressBar can access all the instance methods defined in [NodeWidget](api/NodeWidget.md) diff --git a/docs/api/QPushButton.md b/docs/api/QPushButton.md new file mode 100644 index 000000000..2769bacae --- /dev/null +++ b/docs/api/QPushButton.md @@ -0,0 +1,42 @@ +## Class: QPushButton + +> Create and control buttons. + +**This class is a JS wrapper around Qt's [QPushButton class](https://doc.qt.io/qt-5/qpushbutton.html)** + +A `QPushButton` provides ability to add and manipulate native button widgets. + +**QPushButton inherits from [NodeWidget](api/NodeWidget.md)** + +### Example + +```javascript +const { QPushButton } = require("@nodegui/nodegui"); + +const button = new QPushButton(); +button.setText("Hello"); +``` + +### `new QPushButton(parent?)` + +- `parent` NodeWidget (_optional_). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget. + +### Static Methods + +QPushButton can access all the static methods defined in [NodeWidget](api/NodeWidget.md) + +### Instance Properties + +QPushButton can access all the instance properties defined in [NodeWidget](api/NodeWidget.md) + +### Instance Methods + +QPushButton can access all the instance methods defined in [NodeWidget](api/NodeWidget.md) + +Additionally it also has the following instance methods: + +#### `button.setText(text)` + +Sets the given text to the button. + +- `text` string diff --git a/docs/api/QRadioButton.md b/docs/api/QRadioButton.md new file mode 100644 index 000000000..b2bcd31f3 --- /dev/null +++ b/docs/api/QRadioButton.md @@ -0,0 +1,42 @@ +## Class: QRadioButton + +> Create and control radio button. + +**This class is a JS wrapper around Qt's [QRadioButton class](https://doc.qt.io/qt-5/qradiobutton.html)** + +A `QRadioButton` provides ability to add and manipulate native radio button widgets. + +**QRadioButton inherits from [NodeWidget](api/NodeWidget.md)** + +### Example + +```javascript +const { QRadioButton } = require("@nodegui/nodegui"); + +const radioButton = new QRadioButton(); +radioButton.setText("Hello"); +``` + +### `new QRadioButton(parent?)` + +- `parent` NodeWidget (_optional_). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget. + +### Static Methods + +QRadioButton can access all the static methods defined in [NodeWidget](api/NodeWidget.md) + +### Instance Properties + +QRadioButton can access all the instance properties defined in [NodeWidget](api/NodeWidget.md) + +### Instance Methods + +QRadioButton can access all the instance methods defined in [NodeWidget](api/NodeWidget.md) + +Additionally it also has the following instance methods: + +#### `radioButton.setText(text)` + +Sets the given text to the radioButton. + +- `text` string diff --git a/docs/api/QWidget.md b/docs/api/QWidget.md index c3284846a..99455b8f5 100644 --- a/docs/api/QWidget.md +++ b/docs/api/QWidget.md @@ -18,9 +18,9 @@ view.setObjectName("container"); //Similar to setting `id` on the web view.setLayout(new FlexLayout()); ``` -### `new QWidget([parent])` +### `new QWidget(parent?)` -- `parent` NodeWidget (optional). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget. +- `parent` NodeWidget (_optional_). Any widget inheriting from NodeWidget can be passed as a parent. This will make this widget, the child of the parent widget. ### Static Methods