Properly draw outputs in the right side. Replace egui deprecated methods.

egui_node_graph2/src/editor_ui.rs

@@ -617,12 +617,8 @@ where
         ui: &mut Ui,
         user_state: &mut UserState,
     ) -> Vec<NodeResponse<UserResponse, NodeData>> {
-        let mut child_ui = ui.child_ui_with_id_source(
-            Rect::from_min_size(*self.position + self.pan, Self::MAX_NODE_SIZE.into()),
-            Layout::default(),
-            self.node_id,
-            None,
-        );
+        let max_rect = Rect::from_min_size(*self.position + self.pan, Self::MAX_NODE_SIZE.into());
+        let mut child_ui = ui.new_child(UiBuilder::new().max_rect(max_rect).id_salt(self.node_id));
 
         Self::show_graph_node(self, pan_zoom, &mut child_ui, user_state)
     }
@@ -666,7 +662,7 @@ where
         inner_rect.max.x = inner_rect.max.x.max(inner_rect.min.x);
         inner_rect.max.y = inner_rect.max.y.max(inner_rect.min.y);
 
-        let mut child_ui = ui.child_ui(inner_rect, *ui.layout(), None);
+        let mut child_ui = ui.new_child(UiBuilder::new().max_rect(inner_rect).layout(*ui.layout()));
 
         // Get interaction rect from memory, it may expand after the window response on resize.
         let interaction_rect = ui
@@ -709,6 +705,40 @@ where
             title_height = ui.min_size().y;
 
             // First pass: Draw the inner fields. Compute port heights
+            let outputs = self.graph[self.node_id].outputs.clone();
+            for (param_name, param_id) in outputs {
+                let height_before = ui.min_rect().bottom();
+
+                ui.horizontal(|ui| {
+                    ui.allocate_space(ui.available_size());
+
+                    responses.extend(
+                        self.graph[self.node_id]
+                            .user_data
+                            .output_ui(ui, self.node_id, self.graph, user_state, &param_name)
+                            .into_iter(),
+                    );
+                });
+
+                self.graph[self.node_id].user_data.separator(
+                    ui,
+                    self.node_id,
+                    AnyParameterId::Output(param_id),
+                    self.graph,
+                    user_state,
+                );
+
+                let height_after = ui.min_rect().bottom();
+                output_port_heights.push((height_before + height_after) / 2.0);
+            }
+
+            responses.extend(self.graph[self.node_id].user_data.bottom_ui(
+                ui,
+                self.node_id,
+                self.graph,
+                user_state,
+            ));
+
             let inputs = self.graph[self.node_id].inputs.clone();
             for (param_name, param_id) in inputs {
                 if self.graph[param_id].shown_inline {
@@ -783,35 +813,6 @@ where
                     input_port_heights.push((height_before + height_after) / 2.0);
                 }
             }
-
-            let outputs = self.graph[self.node_id].outputs.clone();
-            for (param_name, param_id) in outputs {
-                let height_before = ui.min_rect().bottom();
-                responses.extend(
-                    self.graph[self.node_id]
-                        .user_data
-                        .output_ui(ui, self.node_id, self.graph, user_state, &param_name)
-                        .into_iter(),
-                );
-
-                self.graph[self.node_id].user_data.separator(
-                    ui,
-                    self.node_id,
-                    AnyParameterId::Output(param_id),
-                    self.graph,
-                    user_state,
-                );
-
-                let height_after = ui.min_rect().bottom();
-                output_port_heights.push((height_before + height_after) / 2.0);
-            }
-
-            responses.extend(self.graph[self.node_id].user_data.bottom_ui(
-                ui,
-                self.node_id,
-                self.graph,
-                user_state,
-            ));
         });
 
         // Second pass, iterate again to draw the ports. This happens outside

egui_node_graph2/src/graph_impls.rs

@@ -241,14 +241,14 @@ impl<NodeData> Node<NodeData> {
     pub fn inputs<'a, DataType, DataValue>(
         &'a self,
         graph: &'a Graph<NodeData, DataType, DataValue>,
-    ) -> impl Iterator<Item = &InputParam<DataType, DataValue>> + 'a {
+    ) -> impl Iterator<Item = &'a InputParam<DataType, DataValue>> {
         self.input_ids().map(|id| graph.get_input(id))
     }
 
     pub fn outputs<'a, DataType, DataValue>(
         &'a self,
         graph: &'a Graph<NodeData, DataType, DataValue>,
-    ) -> impl Iterator<Item = &OutputParam<DataType>> + 'a {
+    ) -> impl Iterator<Item = &'a OutputParam<DataType>> {
         self.output_ids().map(|id| graph.get_output(id))
     }
 

egui_node_graph2_example/src/app.rs

@@ -412,7 +412,7 @@ impl eframe::App for NodeGraphExample {
     fn update(&mut self, ctx: &egui::Context, _frame: &mut eframe::Frame) {
         egui::TopBottomPanel::top("top").show(ctx, |ui| {
             egui::menu::bar(ui, |ui| {
-                egui::widgets::global_dark_light_mode_switch(ui);
+                egui::widgets::global_theme_preference_switch(ui);
             });
         });
         let graph_response = egui::CentralPanel::default()