Skip to content

Commit

Permalink
Merge branch 'feat/updated-dioxus' into release/0.2
Browse files Browse the repository at this point in the history
  • Loading branch information
marc2332 authored Feb 6, 2024
2 parents da76624 + 5be3e9c commit 931a133
Show file tree
Hide file tree
Showing 12 changed files with 143 additions and 142 deletions.
18 changes: 9 additions & 9 deletions book/src/guides/animating.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,16 +18,16 @@ fn main() {
launch(app);
}
fn app() -> Element {
let mut animation = use_animation(|| 0.0);
fn app(cx: Scope) -> Element {
let animation = use_animation(cx, || 0.0);
let progress = animation.value();
use_hook(move || {
use_memo(cx, (), move |_| {
animation.start(Animation::new_linear(0.0..=100.0, 50));
})
});
rsx!(rect {
render!(rect {
width: "{progress}",
})
}
Expand All @@ -53,8 +53,8 @@ fn main() {
const TARGET: f64 = 500.0;
fn app() -> Element {
let mut animation = use_animation_transition(TransitionAnimation::new_sine_in_out(200), (), || {
fn app(cx: Scope) -> Element {
let animation = use_animation_transition(cx, TransitionAnimation::new_sine_in_out(200), (), || {
vec![
Animate::new_size(0.0, TARGET),
Animate::new_color("rgb(33, 158, 188)", "white"),
Expand All @@ -72,7 +72,7 @@ fn app() -> Element {
}
};
rsx!(
render!(
rect {
overflow: "clip",
background: "black",
Expand All @@ -83,7 +83,7 @@ fn app() -> Element {
height: "100%",
width: "200",
background: "{background}",
onclick,
onclick: onclick,
}
}
)
Expand Down
4 changes: 2 additions & 2 deletions book/src/guides/effects.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@ The `rotate` attribute let's you rotate an element.
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
rotate: "180deg",
"Hello, World!"
Expand Down
24 changes: 12 additions & 12 deletions book/src/guides/elements.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,8 @@ You can specify things like [`width`](/guides/layout.html#width), [`paddings`](/
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
rect {
direction: "vertical",
label { "Hi!" }
Expand All @@ -34,8 +34,8 @@ The `label` element simply shows some text.
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
"Hello World"
}
Expand All @@ -53,9 +53,9 @@ Example:
static FERRIS: &[u8] = include_bytes!("./ferris.svg");
fn app() -> Element {
let ferris = bytes_to_data(FERRIS);
rsx!(
fn app(cx: Scope) -> Element {
let ferris = bytes_to_data(cx, FERRIS);
render!(
svg {
svg_data: ferris,
}
Expand All @@ -70,9 +70,9 @@ The `image` element, just like `svg` element, require you to pass the image byte
```rust, no_run
static RUST_LOGO: &[u8] = include_bytes!("./rust_logo.png");
fn app() -> Element {
let image_data = bytes_to_data(RUST_LOGO);
rsx!(
fn app(cx: Scope) -> Element {
let image_data = bytes_to_data(cx, RUST_LOGO);
render!(
image {
image_data: image_data,
width: "{size}",
Expand All @@ -87,8 +87,8 @@ fn app() -> Element {
Both `paragraph` and `text` elements are used together. They will let you build texts with different styles.

``` rust
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
paragraph {
text {
font_size: "15",
Expand Down
68 changes: 34 additions & 34 deletions book/src/guides/font_style.md
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,8 @@ You can learn about the syntax of this attribute in [`Color Syntax`](/guides/sty
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
color: "green",
"Hello, World!"
Expand All @@ -42,8 +42,8 @@ fn app() -> Element {
Another example showing [inheritance](#inheritance):

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
rect {
color: "blue",
label {
Expand All @@ -66,8 +66,8 @@ Limitation: Only fonts installed in the system are supported for now.
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
font_family: "Inter",
"Hello, World!"
Expand All @@ -85,8 +85,8 @@ You can specify the size of the text using `font_size`.
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
font_size: "50",
"Hellooooo!"
Expand All @@ -106,8 +106,8 @@ Accepted values: `center`, `end`, `justify`, `left`, `right`, `start`
Example

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
align: "right",
"Hello, World!"
Expand All @@ -127,8 +127,8 @@ Accepted values: `upright` (default), `italic` and `oblique`.
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
font_style: "italic",
"Hello, World!"
Expand Down Expand Up @@ -170,8 +170,8 @@ Accepted values:
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
font_weight: "bold",
"Hello, World!"
Expand Down Expand Up @@ -199,8 +199,8 @@ Accepted values:
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
font_weight: "bold",
"Hello, World!"
Expand All @@ -220,8 +220,8 @@ Specify the height of the lines of the text.
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
lines_height: "3",
"Hello, World! \n Hello, again!"
Expand All @@ -237,8 +237,8 @@ Determines the amount of lines that the text can have. It has unlimited lines by
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
"Hello, World! \n Hello, World! \n Hello, world!" // Will show all three lines
}
Expand All @@ -259,8 +259,8 @@ Specify the spacing between characters of the text.
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
letter_spacing: "10",
"Hello, World!"
Expand All @@ -278,8 +278,8 @@ Specify the spacing between words of the text.
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
word_spacing: "10",
"Hello, World!"
Expand All @@ -302,8 +302,8 @@ Accpted values:
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
decoration: "line-through",
"Hello, World!"
Expand All @@ -328,8 +328,8 @@ Accpted values:
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
decoration: "line-through",
decoration_style: "dotted",
Expand All @@ -350,8 +350,8 @@ You can learn about the syntax of this attribute in [`Color Syntax`](/guides/sty
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
decoration: "line-through",
decoration_color: "orange",
Expand All @@ -372,8 +372,8 @@ Syntax: `<x> <y> <size> <color>`
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
text_shadow: "0 18 12 rgb(0, 0, 0)",
"Hello, World!"
Expand All @@ -395,8 +395,8 @@ Accepted values:
Example:

```rust, no_run
fn app() -> Element {
rsx!(
fn app(cx: Scope) -> Element {
render!(
label {
max_lines: "3",
text_overflow: "ellipsis",
Expand Down
12 changes: 5 additions & 7 deletions book/src/guides/getting_started.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,19 +43,17 @@ fn main() {
launch(app);
}
fn app() -> Element {
let mut count = use_signal(|| 0);
fn app(cx: Scope) -> Element {
let mut count = use_state(cx, || 0);
rsx!(
render!(
rect {
height: "100%",
width: "100%",
background: "rgb(0, 119, 182)",
background: "rgb(35, 35, 35)",
color: "white",
main_align: "center",
cross_align: "center",
padding: "12",
onclick: move |_| count += 1,
font_size: "35",
label { "Click to increase -> {count}" }
}
)
Expand Down
Loading

0 comments on commit 931a133

Please sign in to comment.