use std::sync::Arc; #[cfg(target_arch = "wasm32")] use core::any::Any; use eframe::egui_glow; use egui::mutex::Mutex; use egui_glow::glow; pub struct Custom3d { /// Behind an `Arc>` so we can pass it to [`egui::PaintCallback`] and paint later. rotating_triangle: Arc>, angle: f32, } impl Custom3d { pub fn new<'a>(cc: &'a eframe::CreationContext<'a>) -> Option { let gl = cc.gl.as_ref()?; Some(Self { rotating_triangle: Arc::new(Mutex::new(RotatingTriangle::new(gl)?)), angle: 0.0, }) } } impl eframe::App for Custom3d { fn update(&mut self, ctx: &egui::Context, _frame: &mut eframe::Frame) { egui::CentralPanel::default().show(ctx, |ui| { egui::ScrollArea::both() .auto_shrink([false; 2]) .show(ui, |ui| { ui.horizontal(|ui| { ui.spacing_mut().item_spacing.x = 0.0; ui.label("The triangle is being painted using "); ui.hyperlink_to("glow", "https://github.com/grovesNL/glow"); ui.label(" (OpenGL)."); }); ui.label("It's not a very impressive demo, but it shows you can embed 3D inside of egui."); egui::Frame::canvas(ui.style()).show(ui, |ui| { self.custom_painting(ui); }); ui.label("Drag to rotate!"); ui.add(egui_demo_lib::egui_github_link_file!()); }); }); } fn on_exit(&mut self, gl: Option<&glow::Context>) { if let Some(gl) = gl { self.rotating_triangle.lock().destroy(gl); } } #[cfg(target_arch = "wasm32")] fn as_any_mut(&mut self) -> &mut dyn Any { &mut *self } } impl Custom3d { fn custom_painting(&mut self, ui: &mut egui::Ui) { let (rect, response) = ui.allocate_exact_size(egui::Vec2::splat(300.0), egui::Sense::drag()); self.angle += response.drag_delta().x * 0.01; // Clone locals so we can move them into the paint callback: let angle = self.angle; let rotating_triangle = self.rotating_triangle.clone(); let cb = egui_glow::CallbackFn::new(move |_info, painter| { rotating_triangle.lock().paint(painter.gl(), angle); }); let callback = egui::PaintCallback { rect, callback: Arc::new(cb), }; ui.painter().add(callback); } } struct RotatingTriangle { program: glow::Program, vertex_array: glow::VertexArray, } #[allow(unsafe_code)] // we need unsafe code to use glow impl RotatingTriangle { fn new(gl: &glow::Context) -> Option { use glow::HasContext as _; let shader_version = egui_glow::ShaderVersion::get(gl); unsafe { let program = gl.create_program().expect("Cannot create program"); if !shader_version.is_new_shader_interface() { tracing::warn!( "Custom 3D painting hasn't been ported to {:?}", shader_version ); return None; } let (vertex_shader_source, fragment_shader_source) = ( r#" const vec2 verts[3] = vec2[3]( vec2(0.0, 1.0), vec2(-1.0, -1.0), vec2(1.0, -1.0) ); const vec4 colors[3] = vec4[3]( vec4(1.0, 0.0, 0.0, 1.0), vec4(0.0, 1.0, 0.0, 1.0), vec4(0.0, 0.0, 1.0, 1.0) ); out vec4 v_color; uniform float u_angle; void main() { v_color = colors[gl_VertexID]; gl_Position = vec4(verts[gl_VertexID], 0.0, 1.0); gl_Position.x *= cos(u_angle); } "#, r#" precision mediump float; in vec4 v_color; out vec4 out_color; void main() { out_color = v_color; } "#, ); let shader_sources = [ (glow::VERTEX_SHADER, vertex_shader_source), (glow::FRAGMENT_SHADER, fragment_shader_source), ]; let shaders: Vec<_> = shader_sources .iter() .map(|(shader_type, shader_source)| { let shader = gl .create_shader(*shader_type) .expect("Cannot create shader"); gl.shader_source( shader, &format!( "{}\n{}", shader_version.version_declaration(), shader_source ), ); gl.compile_shader(shader); if !gl.get_shader_compile_status(shader) { panic!( "Failed to compile custom_3d_glow: {}", gl.get_shader_info_log(shader) ); } gl.attach_shader(program, shader); shader }) .collect(); gl.link_program(program); if !gl.get_program_link_status(program) { panic!("{}", gl.get_program_info_log(program)); } for shader in shaders { gl.detach_shader(program, shader); gl.delete_shader(shader); } let vertex_array = gl .create_vertex_array() .expect("Cannot create vertex array"); Some(Self { program, vertex_array, }) } } fn destroy(&self, gl: &glow::Context) { use glow::HasContext as _; unsafe { gl.delete_program(self.program); gl.delete_vertex_array(self.vertex_array); } } fn paint(&self, gl: &glow::Context, angle: f32) { use glow::HasContext as _; unsafe { gl.use_program(Some(self.program)); gl.uniform_1_f32( gl.get_uniform_location(self.program, "u_angle").as_ref(), angle, ); gl.bind_vertex_array(Some(self.vertex_array)); gl.draw_arrays(glow::TRIANGLES, 0, 3); } } }