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

fix: calculator example

Browse Source
This commit is contained in:
YuKun Liu committed 2022-01-07 02:08:14 +08:00
1 parent 4aadec1e30
commit 859be4a2f6
1 file changed
+68 -38
Download Patch File Download Diff File Expand all files Collapse all files
examples/calculator.rs
+68 -38
View File
@@ -18,12 +18,56 @@ fn main() {
}); });
} }
fn app(cx: Scope) -> Element { fn clac_val(val: String) -> f64 {
let cur_val = use_state(&cx, || 0.0_f64);
let operator = use_state(&cx, Option::default);
let display_value = use_state(&cx, String::new);
let input_digit = move |num: u8| display_value.modify().push_str(num.to_string().as_str()); let mut result = 0.0_f64;
let mut temp = String::new();
let mut operation = "+".to_string();
for c in val.chars() {
println!("{:?}: {:?} - {:?}", result, c, val);
if c == '+' || c == '-' || c == '*' || c == '/' {
match &operation as &str {
"+" => {result += temp.parse::<f64>().unwrap();},
"-" => {result -= temp.parse::<f64>().unwrap();},
"*" => {result *= temp.parse::<f64>().unwrap();},
"/" => {result /= temp.parse::<f64>().unwrap();},
_ => unreachable!(),
};
operation = c.to_string();
temp = String::new();
} else {
temp.push(c);
}
}
if temp != "" {
match &operation as &str {
"+" => {result += temp.parse::<f64>().unwrap();},
"-" => {result -= temp.parse::<f64>().unwrap();},
"*" => {result *= temp.parse::<f64>().unwrap();},
"/" => {result /= temp.parse::<f64>().unwrap();},
_ => unreachable!(),
};
}
result
}
fn app(cx: Scope) -> Element {
let cur_val = use_state(&cx, || 0.0_f64);
let display_value: UseState<String> = use_state(&cx,String::new);
let input_digit = move |num: u8| {
display_value.modify().push_str(num.to_string().as_str());
};
let input_operator = move |key: &str| {
display_value.modify().push_str(key);
};
cx.render(rsx!( cx.render(rsx!(
style { [include_str!("./assets/calculator.css")] } style { [include_str!("./assets/calculator.css")] }
@@ -31,10 +75,10 @@ fn app(cx: Scope) -> Element {
div { class: "app", div { class: "app",
div { class: "calculator", div { class: "calculator",
onkeydown: move |evt| match evt.key_code { onkeydown: move |evt| match evt.key_code {
KeyCode::Add => operator.set(Some("+")), KeyCode::Add => input_operator("+"),
KeyCode::Subtract => operator.set(Some("-")), KeyCode::Subtract => input_operator("-"),
KeyCode::Divide => operator.set(Some("/")), KeyCode::Divide => input_operator("/"),
KeyCode::Multiply => operator.set(Some("*")), KeyCode::Multiply => input_operator("*"),
KeyCode::Num0 => input_digit(0), KeyCode::Num0 => input_digit(0),
KeyCode::Num1 => input_digit(1), KeyCode::Num1 => input_digit(1),
KeyCode::Num2 => input_digit(2), KeyCode::Num2 => input_digit(2),
@@ -46,7 +90,7 @@ fn app(cx: Scope) -> Element {
KeyCode::Num8 => input_digit(8), KeyCode::Num8 => input_digit(8),
KeyCode::Num9 => input_digit(9), KeyCode::Num9 => input_digit(9),
KeyCode::Backspace => { KeyCode::Backspace => {
if !display_value.as_str().eq("0") { if !display_value.len() != 0 {
display_value.modify().pop(); display_value.modify().pop();
} }
} }
@@ -59,30 +103,28 @@ fn app(cx: Scope) -> Element {
button { button {
class: "calculator-key key-clear", class: "calculator-key key-clear",
onclick: move |_| { onclick: move |_| {
display_value.set("0".to_string()); display_value.set(String::new());
if display_value != "0" { if display_value != "" {
operator.set(None);
cur_val.set(0.0); cur_val.set(0.0);
} }
}, },
[if display_value == "0" { "C" } else { "AC" }] [if display_value == "" { "C" } else { "AC" }]
} }
button { button {
class: "calculator-key key-sign", class: "calculator-key key-sign",
onclick: move |_| { onclick: move |_| {
if display_value.starts_with("-") { // if display_value.starts_with("-") {
display_value.set(display_value.trim_start_matches("-").to_string()) // display_value.set(display_value.trim_start_matches("-").to_string())
} else { // } else {
display_value.set(format!("-{}", *display_value)) // display_value.set(format!("-{}", *display_value))
} // }
}, },
"±" "±"
} }
button { button {
class: "calculator-key key-percent", class: "calculator-key key-percent",
onclick: move |_| { onclick: move |_| {
let pct = (display_value.parse::<f64>().unwrap() / 100.0).to_string(); cur_val.set(clac_val(display_value.get().clone()) / 100.0);
display_value.set(pct);
}, },
"%" "%"
} }
@@ -106,36 +148,24 @@ fn app(cx: Scope) -> Element {
} }
div { class: "operator-keys", div { class: "operator-keys",
button { class: "calculator-key key-divide", button { class: "calculator-key key-divide",
onclick: move |_| operator.set(Some("/")), onclick: move |_| input_operator("/"),
"÷" "÷"
} }
button { class: "calculator-key key-multiply", button { class: "calculator-key key-multiply",
onclick: move |_| operator.set(Some("*")), onclick: move |_| input_operator("*"),
"×" "×"
} }
button { class: "calculator-key key-subtract", button { class: "calculator-key key-subtract",
onclick: move |_| operator.set(Some("-")), onclick: move |_| input_operator("-"),
"−" "−"
} }
button { class: "calculator-key key-add", button { class: "calculator-key key-add",
onclick: move |_| operator.set(Some("+")), onclick: move |_| input_operator("+"),
"+" "+"
} }
button { class: "calculator-key key-equals", button { class: "calculator-key key-equals",
onclick: move |_| { onclick: move |_| {
if let Some(op) = operator.as_ref() { cur_val.set(clac_val(display_value.get().clone()));
let rhs = display_value.parse::<f64>().unwrap();
let new_val = match *op {
"+" => *cur_val + rhs,
"-" => *cur_val - rhs,
"*" => *cur_val * rhs,
"/" => *cur_val / rhs,
_ => unreachable!(),
};
cur_val.set(new_val);
display_value.set(new_val.to_string());
operator.set(None);
}
}, },
"=" "="
} }