Add documentation on window and widgets
							
								
								
									
										48
									
								
								Widgets.md
									
									
									
									
									
								
							
							
								
								
								
								
								
									
									
										
											
											
										
										
									
								
							
						
						
									
										48
									
								
								Widgets.md
									
									
									
									
									
								
							@@ -1 +1,47 @@
 | 
			
		||||
Welcome to the Wiki.
 | 
			
		||||
# Widgets
 | 
			
		||||
 | 
			
		||||
Quip uses a widget-based system to show things on a screen. Each widget has it's own purpose and properties.
 | 
			
		||||
 | 
			
		||||
## Creating and Modifying Widgets
 | 
			
		||||
 | 
			
		||||
See the "Window" page for information on this.
 | 
			
		||||
 | 
			
		||||
## List of Avaliable Widgets
 | 
			
		||||
 | 
			
		||||
### `Quip::Widget::TextLabel(std::string text, int xpos, int ypos)`
 | 
			
		||||
 | 
			
		||||
#### Summary
 | 
			
		||||
 | 
			
		||||
The `TextLabel` widget allows you to render text on the screen. For now, text is rendered as Noto Sans 16pt. This will be customisable in the future.
 | 
			
		||||
 | 
			
		||||
#### Members
 | 
			
		||||
 | 
			
		||||
`std::string text`: The text to be displayed.
 | 
			
		||||
 | 
			
		||||
`int xpos, ypos`: The xpos and ypos of the text label.
 | 
			
		||||
 | 
			
		||||
#### Example
 | 
			
		||||
 | 
			
		||||
```c++
 | 
			
		||||
Quip::Widget::TextLabel("Hello!", 10, 10);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
### `Quip::Widget::Button(std::string text, std::function<void()> callback, int xpos, int ypos)`
 | 
			
		||||
 | 
			
		||||
#### Summary
 | 
			
		||||
 | 
			
		||||
The `Button` widget creates a clickable button which runs a provided function upon click. For now, button text is rendered as Noto Sans 16pt, the button background is slightly blue, and the clickable size is constant. This will be customisable in the future.
 | 
			
		||||
 | 
			
		||||
#### Members
 | 
			
		||||
 | 
			
		||||
`std::string text`: The text to be displayed.
 | 
			
		||||
 | 
			
		||||
`int xpos, ypos`: The xpos and ypos of the button.
 | 
			
		||||
 | 
			
		||||
#### Example
 | 
			
		||||
 | 
			
		||||
```c++
 | 
			
		||||
Quip::Widget::Button("Click me!", []() {
 | 
			
		||||
    std::cout << "Button has been clicked!" << std::endl;
 | 
			
		||||
}, 10, 10)
 | 
			
		||||
```
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										46
									
								
								Window.md
									
									
									
									
									
								
							
							
								
								
								
								
								
									
									
										
											
											
										
										
									
								
							
						
						
									
										46
									
								
								Window.md
									
									
									
									
									
								
							@@ -1 +1,45 @@
 | 
			
		||||
Coming soon
 | 
			
		||||
# Window
 | 
			
		||||
 | 
			
		||||
Quip uses the `Quip::Window` class to represent a window.
 | 
			
		||||
 | 
			
		||||
The constructor paramaters are as follows:
 | 
			
		||||
 | 
			
		||||
```c++
 | 
			
		||||
Quip::Window(std::string title, int width, int height)
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
## Creating and Modifying Widgets
 | 
			
		||||
 | 
			
		||||
Widgets are added to the `Quip::Window` class. If you would like to add a widget to the screen, you can use the `addChild(std::string id, Widget::Widget widget)` method to add a child widget.
 | 
			
		||||
 | 
			
		||||
As an example:
 | 
			
		||||
 | 
			
		||||
```c++
 | 
			
		||||
Quip::Window window("Quip Window", 800, 600);
 | 
			
		||||
window.addChild("hello", Quip::Widget::TextLabel("Hello, World!", 10, 10));
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
Widgets can be accessed through the `getChild(std::string id)` method. This returns a pointer to a std::variant which the widget is stored in.
 | 
			
		||||
 | 
			
		||||
As an example:
 | 
			
		||||
 | 
			
		||||
```c++
 | 
			
		||||
Quip::Window window("Quip Window", 800, 600);
 | 
			
		||||
window.addChild("hello", Quip::Widget::TextLabel("Hello, World", 10, 10));
 | 
			
		||||
 | 
			
		||||
auto* widget = window.getChild("hello");
 | 
			
		||||
if (widget && std::holds_alternative<Quip::Widget::TextLabel>(*widget)) {
 | 
			
		||||
    std::get<Quip::Widget::TextLabel>(*widget).text = "The text updated!";
 | 
			
		||||
}
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
## Running the Window
 | 
			
		||||
 | 
			
		||||
You can run a Quip window like this:
 | 
			
		||||
 | 
			
		||||
```c++
 | 
			
		||||
Quip::Window window("Quip Window", 800, 600);
 | 
			
		||||
window.run();
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
Ideally, `return window.run()` should be the last line in your main function.
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user