Parcourir la source

feat: add `borderless` example

mrxiaozhuox il y a 3 ans
Parent
commit
a0ffe66a37
3 fichiers modifiés avec 42 ajouts et 11 suppressions
  1. 1 0
      .gitignore
  2. 37 10
      examples/borderless.rs
  3. 4 1
      packages/desktop/src/desktop_context.rs

+ 1 - 0
.gitignore

@@ -1,4 +1,5 @@
 /target
+/dist
 Cargo.lock
 .DS_Store
 

+ 37 - 10
examples/borderless.rs

@@ -1,21 +1,48 @@
-use dioxus::prelude::*;
+use dioxus::{events::onmousedown, prelude::*};
 use dioxus_desktop::desktop_context::DesktopContext;
 
 fn main() {
     dioxus::desktop::launch_cfg(app, |cfg| {
-        cfg.with_window(|w| {
-            w.with_title("BorderLess Demo")
-            .with_decorations(false)
-        })
+        cfg.with_window(|w| w.with_title("BorderLess Demo").with_decorations(false))
     });
 }
 
-fn app (cx: Scope) -> Element {
+fn app(cx: Scope) -> Element {
     let desktop = cx.consume_context::<DesktopContext>().unwrap();
+
+    let drag = desktop.clone();
+    let close = desktop.clone();
+    let min = desktop.clone();
+
     cx.render(rsx!(
-        div {
-            style: "background-color: black; height: 20px; width: 100%",
-            onmousedown: move |_| desktop.drag_window(),
+        link { href:"https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css", rel:"stylesheet" }
+        header { 
+            class: "text-gray-400 bg-gray-900 body-font",
+            onmousedown: move |_| drag.drag_window(),
+            div {
+                class: "container mx-auto flex flex-wrap p-5 flex-col md:flex-row items-center",
+                a { class: "flex title-font font-medium items-center text-white mb-4 md:mb-0",
+                    span { class: "ml-3 text-xl", "Dioxus"}
+                }
+                nav { class: "md:ml-auto flex flex-wrap items-center text-base justify-center",
+                //     a { class: "mr-5 hover:text-white", "First Link"}
+                //     a { class: "mr-5 hover:text-white", "Second Link"}
+                //     a { class: "mr-5 hover:text-white", "Third Link"}
+                //     a { class: "mr-5 hover:text-white", "Fourth Link"}
+                }
+                button {
+                    class: "inline-flex items-center bg-gray-800 border-0 py-1 px-3 focus:outline-none hover:bg-gray-700 rounded text-base mt-4 md:mt-0",
+                    onmousedown: |evt| evt.cancel_bubble(),
+                    onclick: move |_| min.minimize(true),
+                    "Minimize"
+                }
+                button {
+                    class: "inline-flex items-center bg-gray-800 border-0 py-1 px-3 focus:outline-none hover:bg-gray-700 rounded text-base mt-4 md:mt-0",
+                    onmousedown: |evt| evt.cancel_bubble(),
+                    onclick: move |_| close.close(),
+                    "Close"
+                }
+            }
         }
     ))
-}
+}

+ 4 - 1
packages/desktop/src/desktop_context.rs

@@ -20,7 +20,7 @@ pub struct DesktopContext {
 
 impl DesktopContext {
 
-    pub fn new(proxy: ProxyType) -> Self {
+    pub(crate) fn new(proxy: ProxyType) -> Self {
         Self { proxy }
     }
 
@@ -36,14 +36,17 @@ impl DesktopContext {
         let _ = self.proxy.send_event(UserWindowEvent::DragWindow);
     }
 
+    /// set window minimize state
     pub fn minimize(&self, minimized: bool) {
         let _ = self.proxy.send_event(UserWindowEvent::Minimize(minimized));
     }
 
+    /// set window maximize state
     pub fn maximize(&self, maximized: bool) {
         let _ = self.proxy.send_event(UserWindowEvent::Maximize(maximized));
     }
 
+    /// close window
     pub fn close(&self) {
         let _ = self.proxy.send_event(UserWindowEvent::CloseWindow);
     }