changes
This commit is contained in:
@@ -0,0 +1,40 @@
|
|||||||
|
---
|
||||||
|
title: Widget
|
||||||
|
slug: /widget
|
||||||
|
---
|
||||||
|
|
||||||
|
A `Widget` is a wrapper for `Element` that manages `Component`(s) and `DependencyHandler`(s).
|
||||||
|
|
||||||
|
## Trait `Element`
|
||||||
|
|
||||||
|
A `Element` is the core ui component for OSUI, this includes `Div`, `FlexRow`, etc.
|
||||||
|
|
||||||
|
### `render(&mut self, scope: &mut RenderScope)`
|
||||||
|
|
||||||
|
Called to get the UI output of the element.
|
||||||
|
|
||||||
|
### `after_render(&mut self, scope: &mut RenderScope)`
|
||||||
|
|
||||||
|
Called after the output of `render` is drawn to the screen.
|
||||||
|
|
||||||
|
### `draw_child(&self, element: &Arc<Widget>)`
|
||||||
|
|
||||||
|
Called when the element is provided with a child `Widget`.
|
||||||
|
|
||||||
|
### `as_any(&self) -> &dyn Any`
|
||||||
|
|
||||||
|
For safety and misc reasons.
|
||||||
|
|
||||||
|
### `as_any_mut(&mut self) -> &mut dyn Any`
|
||||||
|
|
||||||
|
For safety and misc reasons.
|
||||||
|
|
||||||
|
## Trait `Component`
|
||||||
|
|
||||||
|
### `as_any(&self) -> &dyn Any`
|
||||||
|
|
||||||
|
For safety and misc reasons.
|
||||||
|
|
||||||
|
### `as_any_mut(&mut self) -> &mut dyn Any`
|
||||||
|
|
||||||
|
For safety and misc reasons.
|
||||||
@@ -0,0 +1,6 @@
|
|||||||
|
---
|
||||||
|
title: String
|
||||||
|
slug: /elements/string
|
||||||
|
---
|
||||||
|
|
||||||
|
The default `String` type in rust implements `Element`, making it useful for paragraphs, etc.
|
||||||
@@ -0,0 +1,6 @@
|
|||||||
|
---
|
||||||
|
title: Div
|
||||||
|
slug: /elements/div
|
||||||
|
---
|
||||||
|
|
||||||
|
The `Div` element makes use of children and the children are absolute, meaning that other than the parent transform being different, they don't modify anything else in the children.
|
||||||
@@ -0,0 +1,6 @@
|
|||||||
|
---
|
||||||
|
title: Flex
|
||||||
|
slug: /elements/flex
|
||||||
|
---
|
||||||
|
|
||||||
|
The `FlexRow` and `FlexCol` element(s) are similar to `Div`, the major difference is that the children's `Transform` positions are in control of the flex, allowing for a organized layout.
|
||||||
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
title: Elements
|
||||||
|
slug: /elements
|
||||||
|
---
|
||||||
@@ -0,0 +1,36 @@
|
|||||||
|
---
|
||||||
|
title: ID Extension
|
||||||
|
slug: /extensions/id
|
||||||
|
---
|
||||||
|
|
||||||
|
The `IdExtension` is a utility struct that provides an interface to look up widgets by a numeric ID within a `Screen`. It is implemented as an `Extension` and is built on top of a thread-safe `Arc<Screen>`.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📦 Usage
|
||||||
|
|
||||||
|
```rust
|
||||||
|
use osui::prelude::*;
|
||||||
|
|
||||||
|
fn main() -> std::io::Result<()> {
|
||||||
|
let screen = Screen::new();
|
||||||
|
let elements = IdExtension::new(screen.clone());
|
||||||
|
screen.extension(elements.clone());
|
||||||
|
|
||||||
|
rsx! {
|
||||||
|
"Hello, World"
|
||||||
|
}
|
||||||
|
.draw(&screen);
|
||||||
|
|
||||||
|
std::thread::spawn({
|
||||||
|
let elements = elements.clone();
|
||||||
|
move || {
|
||||||
|
if let Some(widget) = elements.get_element(42) {
|
||||||
|
// use widget
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
screen.run()
|
||||||
|
}
|
||||||
|
```
|
||||||
+17
@@ -9,6 +9,23 @@ OSUI Extensions are a practical way to extend the possibilities with OSUI, Exten
|
|||||||
|
|
||||||
You likely noticed that we used this function in the [Hello World App With Velocity](/docs/next/#hello-world-app-with-velocity) example, this function simply allows for structures implementing [Extension](/docs/next/extensions#trait-extension) to be included in the program.
|
You likely noticed that we used this function in the [Hello World App With Velocity](/docs/next/#hello-world-app-with-velocity) example, this function simply allows for structures implementing [Extension](/docs/next/extensions#trait-extension) to be included in the program.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## `Handler<E: Event>`
|
||||||
|
|
||||||
|
A `Handler` is a `Component` that is called when a specific event is dispatched, typically through a `Extension`.
|
||||||
|
|
||||||
|
### 📦 Usage
|
||||||
|
|
||||||
|
```rust
|
||||||
|
rsx!{
|
||||||
|
@Handler::new(|widget, t: &TickEvent| {}
|
||||||
|
"Hello World"
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## Trait `Extension`
|
## Trait `Extension`
|
||||||
|
|
||||||
### `init(&mut self, _screen: Arc<Screen>)`
|
### `init(&mut self, _screen: Arc<Screen>)`
|
||||||
@@ -0,0 +1,32 @@
|
|||||||
|
---
|
||||||
|
title: Tick Extension
|
||||||
|
slug: /extensions/tick
|
||||||
|
---
|
||||||
|
|
||||||
|
The `TickExtension` is a utility struct that calls a TickEvent on every tick from the provided tick rate on a separate thread.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📦 Usage
|
||||||
|
|
||||||
|
```rust
|
||||||
|
use osui::prelude::*;
|
||||||
|
|
||||||
|
fn main() -> std::io::Result<()> {
|
||||||
|
let screen = Screen::new();
|
||||||
|
screen.extension(TickExtension(20)); // 20 tps
|
||||||
|
|
||||||
|
rsx! {
|
||||||
|
@Handler::new(|_, t: &TickEvent| {
|
||||||
|
// One second passed
|
||||||
|
if t.0 == 20 {
|
||||||
|
std::process:exit(0);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
"Hello, World"
|
||||||
|
}
|
||||||
|
.draw(&screen);
|
||||||
|
|
||||||
|
screen.run()
|
||||||
|
}
|
||||||
|
```
|
||||||
@@ -0,0 +1,39 @@
|
|||||||
|
---
|
||||||
|
title: Velocity Extension
|
||||||
|
slug: /extensions/velocity
|
||||||
|
---
|
||||||
|
|
||||||
|
The `VelocityExtension` is a utility struct that changes the `Transform` component of a div to make a velocity effect.
|
||||||
|
|
||||||
|
> :::info
|
||||||
|
> The `Velocity` component only works if the `Transform::new` component is in the element, otherwise it may have issues.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📦 Usage
|
||||||
|
|
||||||
|
```rust
|
||||||
|
use osui::prelude::*;
|
||||||
|
|
||||||
|
fn main() -> std::io::Result<()> {
|
||||||
|
let screen = Screen::new();
|
||||||
|
screen.extension(VelocityExtension);
|
||||||
|
|
||||||
|
rsx! {
|
||||||
|
@Velocity(100, 0);
|
||||||
|
@Transform::new();
|
||||||
|
"Hello, World"
|
||||||
|
}
|
||||||
|
.draw(&screen);
|
||||||
|
|
||||||
|
screen.run()
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Components
|
||||||
|
|
||||||
|
### `Velocity(x: i32, y: i32)`
|
||||||
|
|
||||||
|
Makes the `VelocityExtension` move the element according to the values, if the values are negative then the velocity is in the opposite direction.
|
||||||
Reference in New Issue
Block a user