Rust egui(4) 增加自己的tab页面

news2025/1/18 21:05:29

如下图,增加一个Sins也面,里面添加一个配置组为Sin Paraemters,里面包含一个nums的参数,范围是1-1024,根据nums的数量,在Panel中画sin函数的line。
demo见:https://crazyskady.github.io/index.html
代码见:https://github.com/crazyskady/egui_study/
在这里插入图片描述
怎么说呢,越来越懒,还是直接上增加注释的diff吧:

---
 eframe_test/src/app.rs | 139 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 139 insertions(+)

diff --git a/eframe_test/src/app.rs b/eframe_test/src/app.rs
index 57d8107..669ef7f 100644
--- a/eframe_test/src/app.rs
+++ b/eframe_test/src/app.rs
@@ -11,6 +11,7 @@ use egui_plot::{
 enum Panel {
     Lines,
     Markers,
+    Sins,    // 添加一个自定义的Panel类型,命名为Sins
 }
 
 impl Default for Panel {
@@ -23,6 +24,7 @@ impl Default for Panel {
 pub struct PlotDemo {
     line_demo: LineDemo,
     marker_demo: MarkerDemo,
+    sin_demo: SinDemo,    // 实例化一个demo,类型为SinDemo
     open_panel: Panel,
 }
 
@@ -48,6 +50,7 @@ impl PlotDemo {
         ui.horizontal(|ui| {
             ui.selectable_value(&mut self.open_panel, Panel::Lines, "Lines");
             ui.selectable_value(&mut self.open_panel, Panel::Markers, "Markers");
+            ui.selectable_value(&mut self.open_panel, Panel::Sins, "Sins");
         });  // 当选中Sins的Panel的时候,open_panel被赋值为Panel::Sins
         ui.separator();
 
@@ -58,6 +61,9 @@ impl PlotDemo {
             Panel::Markers => {
                 self.marker_demo.ui(ui);
             }
+            Panel::Sins => {
+                self.sin_demo.ui(ui);  //如果选中的是Sins,那么调用实例的ui函数来画ui
+            }
         }
     }
 }
@@ -425,3 +431,136 @@ impl MarkerDemo {
             .response
     }
 }
+
+
+#[derive(Copy, Clone, PartialEq)]
+struct SinDemo {
+    animate: bool,
+    time: f64,
+    sin_nums: u32,  // 抄的原来的linedemo,主要增加了一个sin_nums用于描述当前要画几条sin
+    square: bool,
+    proportional: bool,
+    coordinates: bool,
+    show_axes: bool,
+    show_grid: bool,
+    line_style: LineStyle,
+}
+
+impl Default for SinDemo {
+    fn default() -> Self {
+        Self {
+            animate: !cfg!(debug_assertions),
+            time: 0.0,
+            sin_nums: 1, // 默认为1条
+            square: false,
+            proportional: true,
+            coordinates: true,
+            show_axes: true,
+            show_grid: true,
+            line_style: LineStyle::Solid,
+        }
+    }
+}
+
+impl SinDemo {
+    fn options_ui(&mut self, ui: &mut Ui) {
+        let Self {
+            animate,
+            time: _,
+            sin_nums,
+            square,
+            proportional,
+            coordinates,
+            show_axes,
+            show_grid,
+            line_style,
+        } = self;
+
+        ui.horizontal(|ui| {
+            ui.group(|ui| {
+                ui.vertical(|ui| {
+                    ui.label("Sin Parameters:");
+                    ui.add(
+                        egui::DragValue::new(sin_nums)
+                            .speed(0.1)
+                            .clamp_range(1..=1024) //限定为1-1024条
+                            .prefix("nums: "),
+                    );
+                });
+            });
+
+            ui.vertical(|ui| {
+                ui.checkbox(show_axes, "Show axes");
+                ui.checkbox(show_grid, "Show grid");
+                ui.checkbox(coordinates, "Show coordinates on hover")
+                    .on_hover_text("Can take a custom formatting function.");
+            });
+
+            ui.vertical(|ui| {
+                ui.style_mut().wrap = Some(false);
+                ui.checkbox(animate, "Animate");
+                ui.checkbox(square, "Square view")
+                    .on_hover_text("Always keep the viewport square.");
+                ui.checkbox(proportional, "Proportional data axes")
+                    .on_hover_text("Tick are the same size on both axes.");
+
+                ComboBox::from_label("Line style")
+                    .selected_text(line_style.to_string())
+                    .show_ui(ui, |ui| {
+                        for style in &[
+                            LineStyle::Solid,
+                            LineStyle::dashed_dense(),
+                            LineStyle::dashed_loose(),
+                            LineStyle::dotted_dense(),
+                            LineStyle::dotted_loose(),
+                        ] {
+                            ui.selectable_value(line_style, *style, style.to_string());
+                        }
+                    });
+            });
+        });
+    }
+    // 增加了一个idx入参,当idx不同的时候,sin的y值不同
+    fn sin(&self, idx: u32) -> Line {
+        let time = self.time;
+        Line::new(PlotPoints::from_explicit_callback(
+            // 这里用idx加上原来的sin值,将每条sin根据其idx进行y轴平移
+            move |x| 0.5 * (2.0 * x).sin() * time.sin() + idx as f64,
+            ..,
+            512,
+        ))
+        .color(Color32::from_rgb(200, 100, 100))
+        .style(self.line_style)
+        .name("wave")
+    }
+}
+
+impl SinDemo {
+    fn ui(&mut self, ui: &mut Ui) -> Response {
+        self.options_ui(ui);
+
+        if self.animate {
+            ui.ctx().request_repaint();
+            self.time += ui.input(|i| i.unstable_dt).at_most(1.0 / 30.0) as f64;
+        };
+        let mut plot = Plot::new("lines_demo")
+            .legend(Legend::default())
+            .y_axis_width(4)
+            .show_axes(self.show_axes)
+            .show_grid(self.show_grid);
+        if self.square {
+            plot = plot.view_aspect(1.0);
+        }
+        if self.proportional {
+            plot = plot.data_aspect(1.0);
+        }
+        if self.coordinates {
+            plot = plot.coordinates_formatter(Corner::LeftBottom, CoordinatesFormatter::default());
+        }
+        plot.show(ui, |plot_ui| {
+            // 根据sin_nums,画出不同条数的sin
+            for i in 0..self.sin_nums {
+                plot_ui.line(self.sin(i));
+            }
+        })
+        .response
+    }
+}
\ No newline at end of file
-- 
2.42.0

Hmmm…越来越懒~~~~~~~~~~ >_<

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1568974.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

b站评论词频统计绘制词云图

一、评论爬取 在笔者之前的文章中&#xff0c;已经专门介绍了b站评论的爬取&#xff08;传送门&#xff09;&#xff0c;这里只对b站评论的文本数据做展示。如下图所示&#xff1a; 二、分词、去停用词、词频统计 Python中的Jieba分词作为应用广泛的分词工具之一&#xff0c;其…

51单片机实验01-点亮LED小灯

目录 一&#xff0c;软件下载 二&#xff0c;单片机概述 1&#xff0c;单片机内部资源 1&#xff09;flash 2&#xff09;ram 3&#xff09;sfr 2&#xff0c;51单片机 3&#xff0c;单片机最小系统 三&#xff0c;点亮最右边的小灯 1&#xff0c;指出满足小灯点亮的有…

关节驱动器 CANFD 通信协议

前言 睿尔曼关节采用了问答方式进行通信&#xff0c;控制器发出指令包&#xff0c;模块返回应答包。一个CAN 总线网络中允许有多个模块&#xff0c;所以每个模块都分配有一个 ID 号。控制器发出的控制指令中包含 ID 信息&#xff0c;只有匹配上 ID 号的模块才能完整接收这条指令…

数学知识--(质数,约数)

本文用于个人算法竞赛学习&#xff0c;仅供参考 目录 一.质数的判定 二.分解质因数 三.质数筛 1.朴素筛法 2.埃氏筛法 3.线性筛法 四.约数 1.求一个数的所有约数 2.约数个数和约数之和 3.欧几里得算法&#xff08;辗转相除法&#xff09;-- 求最大公约数 一.质数的判定 …

MVCC详细总结

简介 MVCC&#xff08;Multi-Version Concurrency Control&#xff09;是一种多版本并发控制机制&#xff0c;主要用于数据库管理系统中&#xff0c;实现对数据库的并发访问。在编程语言中&#xff0c;MVCC可以实现事务内存。 MVCC的特点是读不加锁&#xff0c;读写不冲突。MVC…

Python 一步一步教你用pyglet制作“彩色方块连连看”游戏(续)

“彩色方块连连看”游戏(续) 上期讲到相同的色块连接&#xff0c;链接见&#xff1a; Python 一步一步教你用pyglet制作“彩色方块连连看”游戏-CSDN博客 第八步 续上期&#xff0c;接下来要实现相邻方块的连线&#xff1a; 首先来进一步扩展 行列的类&#xff1a; class R…

STM32 can通信部分函数注释

-----CAN1_Mode_Init CAN模式初始化函数:u8 CAN1_Mode_Init(u8 tsjw,u8 tbs2,u8 tbs1,u16 brp,u8 mode) //CAN初始化 //tsjw:重新同步跳跃时间单元.范围:CAN_SJW_1tq~ CAN_SJW_4tq //tbs2:时间段2的时间单元. 范围:CAN_BS2_1tq~CAN_BS2_8tq; //tbs1:时间段1的时间单元. 范…

day63 单调栈part02

503. 下一个更大元素 II 中等 给定一个循环数组 nums &#xff08; nums[nums.length - 1] 的下一个元素是 nums[0] &#xff09;&#xff0c;返回 nums 中每个元素的 下一个更大元素 。 数字 x 的 下一个更大的元素 是按数组遍历顺序&#xff0c;这个数字之后的第一个比它更…

vue快速入门(六)v-else和v-else-if

注释很详细&#xff0c;直接上代码 上一篇 新增内容 v-else-if用法v-else用法 源码 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-s…

docker部署nacos,单例模式(standalone),使用内置的derby数据库,简易安装

文章目录 前言安装创建文件夹docker指令安装docker指令安装-瘦身版 制作docker-compose.yaml文件查看页面 前言 nacos作为主流的服务发现中心和配置中心&#xff0c;广泛应用于springcloud框架中&#xff0c;现在就让我们一起简易的部署一个单例模式的nacos&#xff0c;版本可…

算法学习系列(四十六):迭代加深、双向DFS

目录 引言概念一、加成序列二、送礼物 引言 本文主要讲了&#xff0c; D F S DFS DFS 的另外两种优化&#xff0c;分别是迭代加深和双向 D F S DFS DFS &#xff0c;思路还是非常清晰明了的&#xff0c;只要会写 D F S DFS DFS 那么这些剪枝和优化其实还是非常的容易的&…

Vue监听器watch的基本用法

文章目录 1. 作用2. 格式3. 示例3.1 value 值为字符串3.2 value 值为函数3.3 value 值为对象 4. 与计算属性对比 1. 作用 监视数据变化&#xff0c;执行一些业务逻辑或异步操作。 2. 格式 监听器 watch 内部以 key &#xff1a;value 的形式定义&#xff0c;key 是 data 中的…

用html写一个爱心

<!DOCTYPE html> <html lang"zh-CN"><head><meta http-equiv"Content-Type" content"text/html; charsetUTF-8" /><title>爱您</title><style>* {padding: 0;margin: 0;}body {background-color: pin…

C语言笔试题之求解X的平方根

求解X的平方根 一、实例要求 1、给定一个非负整数 x &#xff0c;计算并返回 x 的算术平方根 &#xff1b;2、由于返回类型是整数&#xff0c;结果只保留整数部分 &#xff0c;小数部分将被舍去&#xff1b;3、不允许使用任何内置指数函数、运算符&#xff1b; 二、实例分析…

图DP

目录 有向无环图DP 力扣 329. 矩阵中的最长递增路径 力扣 2192. 有向无环图中一个节点的所有祖先 有向有环图DP 力扣 1306. 跳跃游戏 III 有向无环图DP 力扣 329. 矩阵中的最长递增路径 给定一个 m x n 整数矩阵 matrix &#xff0c;找出其中 最长递增路径 的长度。 对…

C语言:文件操作(二)

目录 前言 4、文件的顺序读写 4.1fputc 4.2 fgetc 4.3 fputs 4.4 fgets 4.5 fprintf 4.6 fscanf 4.7 fread和fwrite 结&#xff08;二&#xff09; 前言 接者“C语言&#xff1a;文件操作&#xff08;一&#xff09;”往下讲。 本篇文章将介绍C语言的文件操作&#xf…

【数字图像处理matlab系列】空间域处理之亮度变换(imadjust函数使用)

【数字图像处理matlab系列】空间域处理之亮度变换(imadjust函数使用) 在空间域中&#xff0c;图像处理就是直接对图像的像素进行操作 imadjust 是 MATLAB 中用于调整图像强度值或颜色图的函数。它可以改变图像的对比度&#xff0c;使得图像更清晰或更易于分析。以下是 imadju…

【MATLAB源码-第178期】基于matlab的8PSK调制解调系统频偏估计及补偿算法仿真,对比补偿前后的星座图误码率。

操作环境&#xff1a; MATLAB 2022a 1、算法描述 在通信系统中&#xff0c;频率偏移是一种常见的问题&#xff0c;它会导致接收到的信号频率与发送信号的频率不完全匹配&#xff0c;进而影响通信质量。在调制技术中&#xff0c;QPSK&#xff08;Quadrature Phase Shift Keyi…

4.2总结

了解了部分Api的使用并学习了接口的API API API包含了较多种类&#xff08;System,Runtime等&#xff09; System其实就是一个工具类&#xff0c;提供了一些与系统相关的方法 下面有一些常间的System方法 方法名说明public static void exit (int status)终止当前运行的ja…

Android JNI 调用第三方SO

最近一个项目使用了Go 编译了一个so库&#xff0c;但是这个so里面还需要使用第三方so库pdfium, 首先在Android工程把2个so库都放好 在jni中只能使用dlopen方式&#xff0c;其他的使用函数指针的方式来调用&#xff0c;和windows dll类似&#xff0c;不然虽然编译过了但是会崩溃…