swaits/dioxus
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make cargo check --all --examples work!

Browse Source
This commit is contained in:
Jonathan Kelley committed 2024-01-19 14:19:49 -08:00
1 parent 08475af221
commit 83bce6ce97
40 files changed
+295 -399
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/dioxus-tui/examples/all_terminal_events.rs
+3 -4
View File
@@ -27,10 +27,11 @@ enum Event {
const MAX_EVENTS: usize = 8;
fn app() -> Element {
let events = use_signal(Vec::new);
let mut events = use_signal(Vec::new);
let events_lock = events.read();
let first_index = events_lock.len().saturating_sub(MAX_EVENTS);
let events_rendered = events_lock[first_index..].iter().map(|event| {
// TUI panics if text overflows (https://github.com/DioxusLabs/dioxus/issues/371)
// temporary hack: just trim the strings (and make sure viewport is big enough)
@@ -40,9 +41,7 @@ fn app() -> Element {
rsx!( p { "{trimmed}" } )
});
let log_event = move |event: Event| {
events.write().push(event);
};
let mut log_event = move |event: Event| events.write().push(event);
rsx! {
div { width: "100%", height: "100%", flex_direction: "column",
packages/dioxus-tui/examples/border.rs
+2 -2
View File
@@ -5,7 +5,7 @@ fn main() {
}
fn app() -> Element {
let radius = use_signal(|| 0);
let mut radius = use_signal(|| 0);
rsx! {
div {
@@ -14,7 +14,7 @@ fn app() -> Element {
justify_content: "center",
align_items: "center",
background_color: "hsl(248, 53%, 58%)",
onwheel: move |w| radius.modify(|r| (r + w.delta().strip_units().y as i8).abs()),
onwheel: move |w| radius.with_mut(|r| *r = (*r + w.delta().strip_units().y as i8).abs()),
border_style: "solid none solid double",
border_width: "thick",
packages/dioxus-tui/examples/buttons.rs
+12 -24
View File
@@ -5,19 +5,13 @@ fn main() {
dioxus_tui::launch(app);
}
#[derive(PartialEq, Props)]
struct ButtonProps {
color_offset: u32,
layer: u16,
}
#[component]
fn Button(color_offset: u32, layer: u16) -> Element {
let mut toggle = use_signal(|| false);
let mut hovered = use_signal(|| false);
#[allow(non_snake_case)]
fn Button(cx: Scope<ButtonProps>) -> Element {
let toggle = use_signal(|| false);
let hovered = use_signal(|| false);
let hue = cx.props.color_offset % 255;
let saturation = if *toggle.get() { 50 } else { 25 } + if *hovered.get() { 50 } else { 25 };
let hue = color_offset % 255;
let saturation = if toggle() { 50 } else { 25 } + if hovered() { 50 } else { 25 };
let brightness = saturation / 2;
let color = format!("hsl({hue}, {saturation}, {brightness})");
@@ -26,26 +20,20 @@ fn Button(cx: Scope<ButtonProps>) -> Element {
width: "100%",
height: "100%",
background_color: "{color}",
tabindex: "{cx.props.layer}",
tabindex: "{layer}",
onkeydown: move |e| {
if let Code::Space = e.inner().code() {
toggle.modify(|f| !f);
toggle.toggle();
}
},
onclick: move |_| {
toggle.modify(|f| !f);
},
onmouseenter: move |_| {
hovered.set(true);
},
onmouseleave: move |_|{
hovered.set(false);
},
onclick: move |_| toggle.toggle(),
onmouseenter: move |_| hovered.set(true),
onmouseleave: move |_| hovered.set(false),
justify_content: "center",
align_items: "center",
display: "flex",
flex_direction: "column",
p{ "tabindex: {cx.props.layer}" }
p { "tabindex: {layer}" }
}
}
}
packages/dioxus-tui/examples/colorpicker.rs
+15 -13
View File
@@ -9,25 +9,27 @@ fn main() {
}
fn app() -> Element {
let hue = use_signal(|| 0.0);
let brightness = use_signal(|| 0.0);
let tui_query: Query = cx.consume_context().unwrap();
let mapping: DioxusElementToNodeId = cx.consume_context().unwrap();
let mut hue = use_signal(|| 0.0);
let mut brightness = use_signal(|| 0.0);
let tui_query: Query = consume_context();
let mapping: DioxusElementToNodeId = consume_context();
// disable templates so that every node has an id and can be queried
rsx! {
div {
width: "100%",
background_color: "hsl({hue}, 70%, {brightness}%)",
onmousemove: move |evt| {
if let RenderReturn::Ready(node) = cx.root_node() {
if let Some(id) = node.root_ids.borrow().first().cloned() {
let node = tui_query.get(mapping.get_node_id(id).unwrap());
let Size { width, height } = node.size().unwrap();
let pos = evt.inner().element_coordinates();
hue.set((pos.x as f32 / width as f32) * 255.0);
brightness.set((pos.y as f32 / height as f32) * 100.0);
}
}
todo!()
// if let RenderReturn::Ready(node) = root_node() {
// if let Some(id) = node.root_ids.borrow().first().cloned() {
// let node = tui_query.get(mapping.get_node_id(id).unwrap());
// let Size { width, height } = node.size().unwrap();
// let pos = evt.inner().element_coordinates();
// hue.set((pos.x as f32 / width as f32) * 255.0);
// brightness.set((pos.y as f32 / height as f32) * 100.0);
// }
// }
},
"hsl({hue}, 70%, {brightness}%)"
}
packages/dioxus-tui/examples/hover.rs
+21 -29
View File
@@ -23,32 +23,24 @@ fn app() -> Element {
127 * b
}
let q1_color = use_signal(|| [200; 3]);
let q2_color = use_signal(|| [200; 3]);
let q3_color = use_signal(|| [200; 3]);
let q4_color = use_signal(|| [200; 3]);
let mut q1_color = use_signal(|| [200; 3]);
let mut q2_color = use_signal(|| [200; 3]);
let mut q3_color = use_signal(|| [200; 3]);
let mut q4_color = use_signal(|| [200; 3]);
let q1_color_str = to_str(q1_color);
let q2_color_str = to_str(q2_color);
let q3_color_str = to_str(q3_color);
let q4_color_str = to_str(q4_color);
let mut page_coordinates = use_signal(|| "".to_string());
let mut element_coordinates = use_signal(|| "".to_string());
let mut buttons = use_signal(|| "".to_string());
let mut modifiers = use_signal(|| "".to_string());
let page_coordinates = use_signal(|| "".to_string());
let element_coordinates = use_signal(|| "".to_string());
let buttons = use_signal(|| "".to_string());
let modifiers = use_signal(|| "".to_string());
let update_data = move |event: Event<MouseData>| {
let mouse_data = event.inner();
page_coordinates.set(format!("{:?}", mouse_data.page_coordinates()));
element_coordinates.set(format!("{:?}", mouse_data.element_coordinates()));
let mut update_data = move |event: Event<MouseData>| {
page_coordinates.set(format!("{:?}", event.page_coordinates()));
element_coordinates.set(format!("{:?}", event.element_coordinates()));
// Note: client coordinates are also available, but they would be the same as the page coordinates in this example, because there is no scrolling.
// There are also screen coordinates, but they are currently the same as client coordinates due to technical limitations
buttons.set(format!("{:?}", mouse_data.held_buttons()));
modifiers.set(format!("{:?}", mouse_data.modifiers()));
buttons.set(format!("{:?}", event.held_buttons()));
modifiers.set(format!("{:?}", event.modifiers()));
};
rsx! {
@@ -66,11 +58,11 @@ fn app() -> Element {
height: "100%",
justify_content: "center",
align_items: "center",
background_color: "{q1_color_str}",
background_color: to_str(&q1_color()),
onmouseenter: move |m| q1_color.set([get_brightness(m.inner()), 0, 0]),
onmousedown: move |m| q1_color.set([get_brightness(m.inner()), 0, 0]),
onmouseup: move |m| q1_color.set([get_brightness(m.inner()), 0, 0]),
onwheel: move |w| q1_color.set([q1_color[0] + (10.0 * w.delta().strip_units().y) as i32, 0, 0]),
onwheel: move |w| q1_color.set([q1_color()[0] + (10.0 * w.delta().strip_units().y) as i32, 0, 0]),
onmouseleave: move |_| q1_color.set([200; 3]),
onmousemove: update_data,
"click me"
@@ -80,11 +72,11 @@ fn app() -> Element {
height: "100%",
justify_content: "center",
align_items: "center",
background_color: "{q2_color_str}",
background_color: to_str(&q2_color()),
onmouseenter: move |m| q2_color.set([get_brightness(m.inner()); 3]),
onmousedown: move |m| q2_color.set([get_brightness(m.inner()); 3]),
onmouseup: move |m| q2_color.set([get_brightness(m.inner()); 3]),
onwheel: move |w| q2_color.set([q2_color[0] + (10.0 * w.delta().strip_units().y) as i32; 3]),
onwheel: move |w| q2_color.set([q2_color()[0] + (10.0 * w.delta().strip_units().y) as i32; 3]),
onmouseleave: move |_| q2_color.set([200; 3]),
onmousemove: update_data,
"click me"
@@ -100,11 +92,11 @@ fn app() -> Element {
height: "100%",
justify_content: "center",
align_items: "center",
background_color: "{q3_color_str}",
background_color: to_str(&q3_color()),
onmouseenter: move |m| q3_color.set([0, get_brightness(m.inner()), 0]),
onmousedown: move |m| q3_color.set([0, get_brightness(m.inner()), 0]),
onmouseup: move |m| q3_color.set([0, get_brightness(m.inner()), 0]),
onwheel: move |w| q3_color.set([0, q3_color[1] + (10.0 * w.delta().strip_units().y) as i32, 0]),
onwheel: move |w| q3_color.set([0, q3_color()[1] + (10.0 * w.delta().strip_units().y) as i32, 0]),
onmouseleave: move |_| q3_color.set([200; 3]),
onmousemove: update_data,
"click me"
@@ -114,11 +106,11 @@ fn app() -> Element {
height: "100%",
justify_content: "center",
align_items: "center",
background_color: "{q4_color_str}",
background_color: to_str(&q4_color()),
onmouseenter: move |m| q4_color.set([0, 0, get_brightness(m.inner())]),
onmousedown: move |m| q4_color.set([0, 0, get_brightness(m.inner())]),
onmouseup: move |m| q4_color.set([0, 0, get_brightness(m.inner())]),
onwheel: move |w| q4_color.set([0, 0, q4_color[2] + (10.0 * w.delta().strip_units().y) as i32]),
onwheel: move |w| q4_color.set([0, 0, q4_color()[2] + (10.0 * w.delta().strip_units().y) as i32]),
onmouseleave: move |_| q4_color.set([200; 3]),
onmousemove: update_data,
"click me"
packages/dioxus-tui/examples/many_small_edit_stress.rs
+21 -32
View File
@@ -5,28 +5,22 @@ use dioxus_tui::{Config, TuiContext};
fn main() {
for size in 1..=20usize {
for _ in 0..10 {
dioxus_tui::launch_cfg_with_props(app, size, Config::default().with_headless())
todo!()
// dioxus_tui::launch_cfg(app, vec![size], Config::default().with_headless())
}
}
}
#[derive(Props, PartialEq)]
struct BoxProps {
x: usize,
y: usize,
hue: f32,
alpha: f32,
}
#[allow(non_snake_case)]
fn Box(cx: Scope<BoxProps>) -> Element {
#[component]
fn Box(x: usize, y: usize, hue: f32, alpha: f32) -> Element {
let count = use_signal(|| 0);
let x = cx.props.x * 2;
let y = cx.props.y * 2;
let hue = cx.props.hue;
let display_hue = cx.props.hue as u32 / 10;
let count = count.get();
let alpha = cx.props.alpha + (count % 100) as f32;
let x = x * 2;
let y = y * 2;
let hue = hue;
let display_hue = hue as u32 / 10;
let alpha = alpha + (count() % 100) as f32;
rsx! {
div {
@@ -41,22 +35,19 @@ fn Box(cx: Scope<BoxProps>) -> Element {
}
}
#[derive(Props, PartialEq)]
struct GridProps {
size: usize,
}
#[allow(non_snake_case)]
fn Grid(cx: Scope<GridProps>) -> Element {
let size = cx.props.size;
let count = use_signal(|| 0);
let counts = use_signal(|| vec![0; size * size]);
#[component]
fn Grid(size: usize) -> Element {
let size = size;
let mut count = use_signal(|| 0);
let mut counts = use_signal(|| vec![0; size * size]);
let ctx: TuiContext = cx.consume_context().unwrap();
if *count.get() + 1 >= (size * size) {
let ctx: TuiContext = consume_context();
if count() + 1 >= (size * size) {
ctx.quit();
} else {
counts.with_mut(|c| {
let i = *count.current();
let i = count();
c[i] += 1;
c[i] %= 360;
});
@@ -97,14 +88,12 @@ fn Grid(cx: Scope<GridProps>) -> Element {
}
}
fn app(cx: Scope<usize>) -> Element {
fn app(props: usize) -> Element {
rsx! {
div{
width: "100%",
height: "100%",
Grid{
size: *cx.props,
}
Grid{ size: props }
}
}
}
packages/dioxus-tui/examples/quadrants.rs
+9 -18
View File
@@ -1,29 +1,22 @@
#![allow(non_snake_case)]
use dioxus::prelude::*;
use dioxus_tui::Config;
fn main() {
dioxus_tui::launch_cfg(app, Config::default());
dioxus_tui::launch_cfg(app, Default::default());
}
#[derive(Props, PartialEq)]
struct QuadrentProps {
color: String,
text: String,
}
fn Quadrant(cx: Scope<QuadrentProps>) -> Element {
#[component]
fn Quadrant(color: String, text: String) -> Element {
rsx! {
div {
border_width: "1px",
width: "50%",
height: "100%",
background_color: "{cx.props.color}",
justify_content: "center",
align_items: "center",
"{cx.props.text}"
background_color: "{color}",
"{text}"
}
}
}
@@ -34,30 +27,28 @@ fn app() -> Element {
width: "100%",
height: "100%",
flex_direction: "column",
div {
width: "100%",
height: "50%",
flex_direction: "row",
Quadrant{
Quadrant {
color: "red".to_string(),
text: "[A]".to_string()
},
Quadrant{
Quadrant {
color: "black".to_string(),
text: "[B]".to_string()
}
}
div {
width: "100%",
height: "50%",
flex_direction: "row",
Quadrant{
Quadrant {
color: "green".to_string(),
text: "[C]".to_string()
},
Quadrant{
Quadrant {
color: "blue".to_string(),
text: "[D]".to_string()
}
packages/dioxus-tui/examples/task.rs
+6 -10
View File
@@ -5,17 +5,13 @@ fn main() {
}
fn app() -> Element {
let count = use_signal(|| 0);
let mut count = use_signal(|| 0);
use_future(move |_| {
let count = count.to_owned();
let update = cx.schedule_update();
async move {
loop {
count.with_mut(|f| *f += 1);
tokio::time::sleep(std::time::Duration::from_millis(1000)).await;
update();
}
use_future(move || async move {
loop {
count += 1;
tokio::time::sleep(std::time::Duration::from_millis(1000)).await;
schedule_update();
}
});
packages/dioxus-tui/examples/text.rs
+2 -2
View File
@@ -5,14 +5,14 @@ fn main() {
}
fn app() -> Element {
let alpha = use_signal(|| 100);
let mut alpha = use_signal(|| 100);
rsx! {
div {
width: "100%",
height: "100%",
flex_direction: "column",
onwheel: move |evt| alpha.set((**alpha + evt.inner().delta().strip_units().y as i64).clamp(0, 100)),
onwheel: move |evt| alpha.set((alpha() + evt.inner().delta().strip_units().y as i64).clamp(0, 100)),
p {
background_color: "black",
packages/dioxus-tui/examples/widgets.rs
+13 -16
View File
@@ -6,19 +6,18 @@ fn main() {
}
fn app() -> Element {
let bg_green = use_signal(|| false);
let mut bg_green = use_signal(|| false);
let color = if bg_green() { "green" } else { "red" };
let color = if *bg_green.get() { "green" } else { "red" };
rsx! {
div{
div {
width: "100%",
background_color: "{color}",
flex_direction: "column",
align_items: "center",
justify_content: "center",
input {
oninput: |data| if &data.value()== "good"{
oninput: move |data| if data.value() == "good" {
bg_green.set(true);
} else{
bg_green.set(false);
@@ -30,9 +29,9 @@ fn app() -> Element {
checked: "true",
}
input {
oninput: |data| if &data.value()== "hello world"{
oninput: move |data| if &data.value() == "hello world"{
bg_green.set(true);
} else{
} else {
bg_green.set(false);
},
width: "50%",
@@ -40,7 +39,7 @@ fn app() -> Element {
maxlength: "11",
}
input {
oninput: |data| {
oninput: move |data| {
if (data.value().parse::<f32>().unwrap() - 40.0).abs() < 5.0 {
bg_green.set(true);
} else{
@@ -54,10 +53,10 @@ fn app() -> Element {
max: "80",
}
input {
oninput: |data| {
if data.value()== "10"{
oninput: move |data| {
if data.value() == "10"{
bg_green.set(true);
} else{
} else {
bg_green.set(false);
}
},
@@ -67,8 +66,8 @@ fn app() -> Element {
maxlength: "4",
}
input {
oninput: |data| {
if data.value()== "hello world"{
oninput: move |data| {
if data.value() == "hello world"{
bg_green.set(true);
} else{
bg_green.set(false);
@@ -80,9 +79,7 @@ fn app() -> Element {
maxlength: "11",
}
input {
oninput: |_| {
bg_green.set(true)
},
oninput: move |_| { bg_green.set(true) },
r#type: "button",
value: "green",
width: "50%",