Merge pull request nannou-org#854 from mitchmindtree/merge-nannou_egui

Merge `nannou_egui` into this repo

.github/workflows/nannou.yml

@@ -185,6 +185,9 @@ jobs:
     - name: Cargo publish nannou_conrod
       continue-on-error: true
       run: cargo publish --token $CRATESIO_TOKEN --manifest-path nannou_conrod/Cargo.toml
+    - name: Cargo publish nannou_egui
+      continue-on-error: true
+      run: cargo publish --token $CRATESIO_TOKEN --manifest-path nannou_egui/Cargo.toml
 
   guide-build-book:
     runs-on: ubuntu-latest

Cargo.toml

@@ -7,6 +7,8 @@ members = [
     "nannou_audio",
     "nannou_conrod",
     "nannou_core",
+    "nannou_egui",
+    "nannou_egui_demo_app",
     "nannou_isf",
     "nannou_laser",
     "nannou_mesh",

README.md

@@ -74,6 +74,7 @@ The following nannou **libraries** are included within this repository.
 | [**`nannou_audio`**](./nannou_audio) | [![Crates.io](https://img.shields.io/crates/v/nannou_audio.svg)](https://crates.io/crates/nannou_audio) [![docs.rs](https://docs.rs/nannou_audio/badge.svg)](https://docs.rs/nannou_audio/) | Audio hosts, devices and streams. |
 | [**`nannou_conrod`**](./nannou_conrod) | [![Crates.io](https://img.shields.io/crates/v/nannou_conrod.svg)](https://crates.io/crates/nannou_conrod) [![docs.rs](https://docs.rs/nannou_conrod/badge.svg)](https://docs.rs/nannou_conrod/) | For creating conrod UIs in nannou apps. |
 | [**`nannou_core`**](./nannou_core) | [![Crates.io](https://img.shields.io/crates/v/nannou_core.svg)](https://crates.io/crates/nannou_core) [![docs.rs](https://docs.rs/nannou_core/badge.svg)](https://docs.rs/nannou_core/) | Just-the-core for headless, embedded and libraries. |
+| [**`nannou_egui`**](./nannou_egui) | [![Crates.io](https://img.shields.io/crates/v/nannou_egui.svg)](https://crates.io/crates/nannou_egui) [![docs.rs](https://docs.rs/nannou_egui/badge.svg)](https://docs.rs/nannou_egui/) | For creating egui UIs in nannou apps. |
 | [**`nannou_isf`**](./nannou_isf) | [![Crates.io](https://img.shields.io/crates/v/nannou_isf.svg)](https://crates.io/crates/nannou_isf) [![docs.rs](https://docs.rs/nannou_isf/badge.svg)](https://docs.rs/nannou_isf/) | An Interactive Shader Format pipeline. |
 | [**`nannou_laser`**](./nannou_laser) | [![Crates.io](https://img.shields.io/crates/v/nannou_laser.svg)](https://crates.io/crates/nannou_laser) [![docs.rs](https://docs.rs/nannou_laser/badge.svg)](https://docs.rs/nannou_laser/) | LASER devices, streams and path optimisation. |
 | [**`nannou_mesh`**](./nannou_mesh) | [![Crates.io](https://img.shields.io/crates/v/nannou_mesh.svg)](https://crates.io/crates/nannou_mesh) [![docs.rs](https://docs.rs/nannou_mesh/badge.svg)](https://docs.rs/nannou_mesh/) | API for composing meshes from channels. |

examples/Cargo.toml

@@ -21,6 +21,7 @@ hrtf = "0.2"
 nannou = { version ="0.18.0", path = "../nannou" }
 nannou_audio = { version ="0.18.0", path = "../nannou_audio" }
 nannou_conrod = { version ="0.18.0", path = "../nannou_conrod" }
+nannou_egui = { version = "0.5.0", path = "../nannou_egui" }
 nannou_isf = { version = "0.1.0", path = "../nannou_isf" }
 nannou_laser = { version ="0.18.0", features = ["ffi", "ilda-idtf"], path = "../nannou_laser" }
 nannou_osc = { version ="0.18.0", path = "../nannou_osc" }
@@ -197,6 +198,12 @@ path = "ui/conrod/simple_ui.rs"
 [[example]]
 name = "timeline_demo"
 path = "ui/conrod/timeline_demo.rs"
+[[example]]
+name = "circle_packing"
+path = "ui/egui/circle_packing.rs"
+[[example]]
+name = "tune_color"
+path = "ui/egui/tune_color.rs"
 
 # WebGPU
 [[example]]

examples/communication/osc_receiver.rs

@@ -1,6 +1,4 @@
 use nannou::prelude::*;
-use nannou_conrod as ui;
-use nannou_conrod::prelude::*;
 use nannou_osc as osc;
 
 fn main() {
@@ -10,19 +8,16 @@ fn main() {
 struct Model {
     receiver: osc::Receiver,
     received_packets: Vec<(std::net::SocketAddr, osc::Packet)>,
-    ui: Ui,
-    text: widget::Id,
 }
 
 // Make sure this matches the `TARGET_PORT` in the `osc_sender.rs` example.
 const PORT: u16 = 34254;
 
 fn model(app: &App) -> Model {
-    let w_id = app
+    let _w_id = app
         .new_window()
         .title("OSC Receiver")
         .size(1400, 480)
-        .raw_event(raw_window_event)
         .view(view)
         .build()
         .unwrap();
@@ -33,22 +28,12 @@ fn model(app: &App) -> Model {
     // A vec for collecting packets and their source address.
     let received_packets = vec![];
 
-    // Create a simple UI to display received messages.
-    let mut ui = ui::builder(app).window(w_id).build().unwrap();
-    let text = ui.generate_widget_id();
-
     Model {
         receiver,
         received_packets,
-        ui,
-        text,
     }
 }
 
-fn raw_window_event(app: &App, model: &mut Model, event: &ui::RawWindowEvent) {
-    model.ui.handle_raw_event(app, event);
-}
-
 fn update(_app: &App, model: &mut Model, _update: Update) {
     // Receive any pending osc packets.
     for (packet, addr) in model.receiver.try_iter() {
@@ -60,24 +45,25 @@ fn update(_app: &App, model: &mut Model, _update: Update) {
     while model.received_packets.len() > max_packets {
         model.received_packets.remove(0);
     }
+}
+
+// Draw the state of your `Model` into the given `Frame` here.
+fn view(app: &App, model: &Model, frame: Frame) {
+    let draw = app.draw();
+    draw.background().color(DARKBLUE);
 
     // Create a string showing all the packets.
     let mut packets_text = format!("Listening on port {}\nReceived packets:\n", PORT);
     for &(addr, ref packet) in model.received_packets.iter().rev() {
         packets_text.push_str(&format!("{}: {:?}\n", addr, packet));
     }
-
-    // Use the UI to display the packet string.
-    model.ui.clear_with(color::DARK_BLUE);
-    let mut ui = model.ui.set_widgets();
-    widget::Text::new(&packets_text)
-        .top_left_with_margin_on(ui.window, 20.0)
-        .color(color::WHITE)
+    let rect = frame.rect().pad(10.0);
+    draw.text(&packets_text)
+        .font_size(16)
+        .align_text_top()
         .line_spacing(10.0)
-        .set(model.text, &mut ui);
-}
+        .left_justify()
+        .wh(rect.wh());
 
-// Draw the state of your `Model` into the given `Frame` here.
-fn view(app: &App, model: &Model, frame: Frame) {
-    model.ui.draw_to_frame(app, &frame).unwrap();
+    draw.to_frame(app, &frame).unwrap();
 }

examples/communication/osc_sender.rs

@@ -1,17 +1,13 @@
 use nannou::prelude::*;
-use nannou_conrod as ui;
-use nannou_conrod::prelude::*;
 use nannou_osc as osc;
 use nannou_osc::Type;
 
 fn main() {
-    nannou::app(model).update(update).run();
+    nannou::app(model).run();
 }
 
 struct Model {
     sender: osc::Sender<osc::Connected>,
-    ui: Ui,
-    text: widget::Id,
 }
 
 // Make sure this matches `PORT` in the `osc_receiver.rs` example.
@@ -22,12 +18,11 @@ fn target_address_string() -> String {
 }
 
 fn model(app: &App) -> Model {
-    let w_id = app
+    let _w_id = app
         .new_window()
         .title("OSC Sender")
         .size(680, 480)
         .event(event)
-        .raw_event(raw_window_event)
         .view(view)
         .build()
         .unwrap();
@@ -38,11 +33,7 @@ fn model(app: &App) -> Model {
     // Bind an `osc::Sender` and connect it to the target address.
     let sender = osc::sender().unwrap().connect(target_addr).unwrap();
 
-    // Create a simple UI to tell the user what to do.
-    let mut ui = ui::builder(app).window(w_id).build().unwrap();
-    let text = ui.generate_widget_id();
-
-    Model { sender, ui, text }
+    Model { sender }
 }
 
 fn event(_app: &App, model: &mut Model, event: WindowEvent) {
@@ -71,27 +62,20 @@ fn event(_app: &App, model: &mut Model, event: WindowEvent) {
     }
 }
 
-fn raw_window_event(app: &App, model: &mut Model, event: &ui::RawWindowEvent) {
-    model.ui.handle_raw_event(app, event);
-}
+fn view(app: &App, _model: &Model, frame: Frame) {
+    let draw = app.draw();
+    draw.background().color(DARKRED);
 
-fn update(_app: &App, model: &mut Model, _update: Update) {
-    // Use the UI to show the user where packets are being sent.
-    model.ui.clear_with(color::DARK_RED);
-    let mut ui = model.ui.set_widgets();
     let text = format!(
         "Move or click the mouse to send\nmessages to the \
          receiver example!\n\nSending OSC packets to {}",
         target_address_string()
     );
-    widget::Text::new(&text)
-        .middle_of(ui.window)
-        .center_justify()
-        .color(color::WHITE)
+    let rect = frame.rect();
+    draw.text(&text)
+        .font_size(16)
         .line_spacing(10.0)
-        .set(model.text, &mut ui);
-}
+        .wh(rect.wh());
 
-fn view(app: &App, model: &Model, frame: Frame) {
-    model.ui.draw_to_frame(app, &frame).unwrap();
+    draw.to_frame(app, &frame).unwrap();
 }