当前位置: 首页 > news >正文

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

如下图,增加一个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,类型为SinDemoopen_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::Sinsui.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…越来越懒~~~~~~~~~~ >_<

相关文章:

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

如下图&#xff0c;增加一个Sins也面&#xff0c;里面添加一个配置组为Sin Paraemters&#xff0c;里面包含一个nums的参数&#xff0c;范围是1-1024&#xff0c;根据nums的数量&#xff0c;在Panel中画sin函数的line。 demo见&#xff1a;https://crazyskady.github.io/index.…...

小组分享第二部分:Jsoup

1.Jsoup是什么&#xff1a; 是HTML的解析器,可以解析URL地址&#xff0c;HTML的文本内容&#xff0c;可以使用DOM,CSS以及类似Jquery的操作方法来操作数据 2.Jsoup的作用 1.通过URL或者文件或者字符串获取到HTML页面并解析 2.使用DOM或CSS等操作来对数据进行操作 3.可以操作HT…...

C#(winform) 调用MATLAB函数

测试环境 VisualStudio2022 / .NET Framework 4.7.2 Matlab2021b 参考&#xff1a;C# Matlab 相互调用 Matlab 1、编写Matlab函数 可以没有任何参数单纯定义matlab处理的函数&#xff0c;输出的数据都存在TXT中用以后期读取数据 function [result,m,n] TEST(list) % 计算…...

Kubernetes探索-Pod面试(补充)

针对上篇文章"kubernetes探索-Pod面试"做一点点补充... 1. 简述Pod的删除流程 1) kube-apiserver接收到用户的删除指令&#xff0c;默认等待30s(优雅退出时间)&#xff0c;随后认为pod已死亡&#xff0c;将其标记为Terminating状态&#xff1b; 2) kubelet监控到pod…...

深入了解JUnit 5:新一代Java单元测试框架

深入了解JUnit 5&#xff1a;新一代Java单元测试框架 近年来&#xff0c;Java领域的单元测试框架发展迅速&#xff0c;而JUnit 5作为JUnit系列的最新版本&#xff0c;为开发人员提供了更多的功能和灵活性。在本文中&#xff0c;我们将介绍JUnit 5&#xff0c;并探讨其与JUnit 4…...

2024年清明节安装matlab 2024a

下载安装离线支持包SupportSoftwareDownloader_R2024a_win64&#xff0c;地址https://ww2.mathworks.cn/support/install/support-software-downloader.html&#xff0c;运行软件&#xff08;自解压运行&#xff09;&#xff0c;登录账号&#xff08;需要提前在官网注册&#x…...

关于PostgreSQL JDBC中的log输出是怎么回事?

微信公众号:数据库杂记 个人微信: _iihero 我是iihero. 也可以叫我Sean. iihero@CSDN(https://blog.csdn.net/iihero) Sean@墨天轮 (https://www.modb.pro/u/16258) 数据库领域的资深爱好者一枚。SAP数据库技术专家与架构师,PostgreSQL ACE. 水木早期数据库论坛发起人db2@…...

【科研笔记】知识星球不可选择内容爬虫

知识星球不可选择内容爬虫 1 背景2 实现3 拓展遗留问题1 背景 针对与知识星球中,电脑打开网页不可选择复制粘贴的问题,进行爬虫处理,获取网页的内容,并保存在本地 2 实现 需要下载python,和爬虫的第三方库selenium,可以查看博客中有关selenium的内容进行回顾。当前使用…...

[技术闲聊]我对电路设计的理解(二)

第一篇文章 [技术闲聊]我对电路设计的理解(一)&#xff0c;看着是述说着应届生如何对待一份工作&#xff0c;其实也是我在过往以及以目前视野看过往的事情&#xff0c;自己的一种态度。谦虚&#xff0c;是一个不可多得的词汇&#xff0c;因为刚起步&#xff0c;学习的东西很多&…...

【Android、 kotlin】kotlin学习笔记

基本语法 fun main(){val a2var b "Hello"println("$ (a - 1} $b Kotlin!")} Variables 只赋值一次用val read-only variables with val 赋值多次用var mutable variables with var Standard output printin() and print() functions String templ…...

Debian 配置国内软件源

为什么需要&#xff1f; Debian安装好之后默认是没有软件源的&#xff0c;只能通过本身的光盘上的软件进行安装&#xff0c;这样明显是不能够满足我们的需要的&#xff0c;考虑到国内的上网速度以及环境&#xff0c;配置一个国内的阿里镜像源是最好的选择。 使用 sudo vim /…...

选数(dfs,isprime)

题目&#xff1a;P1036 [NOIP2002 普及组] 选数 - 洛谷 | 计算机科学教育新生态 (luogu.com​​​​​​.cn) #include<bits/stdc.h> using namespace std; int n,k; int a[22]; long long ans; bool isprime(int n){for(int i2;i<sqrt(n);i){if(n%i0) return false;…...

RocketMQ(版本4.9.4)+RocketMQ_Dashbord环境搭建(生产者、消费者的前置环境搭建)

一、官方网站下载 RocketMQ源码包 https://rocketmq.apache.org/zh/docs/4.x/introduction/02quickstart 二、把rocketMQ上传到Linux环境下解压&#xff0c;编译&#xff0c;执行以下命令&#xff08;需要提前装jdk和maven并配置好环境变量&#xff09; unzip rocketmq-all-4…...

css隐藏溢出隐藏的滚动条

msOverflowStyle: none: 这个属性用于在 Internet Explorer 浏览器中定义滚动条的样式。将其设置为 none 可以隐藏滚动条。 scrollbarWidth: none: 这个属性用于定义滚动条的宽度。将其设置为 none 可以隐藏滚动条。这个属性在一些新的浏览器中被支持&#xff0c;如 Firefox。…...

scss常用混入(mixin)、@inclue

mixin和inclue的基本使用 mixin混入可以用于定义重复使用的样式&#xff0c;比如下面CSS代码 .header {display: flex;justify-content: center;align-items: center;width: 500px;height: 100px; }.footer {display: flex;justify-content: center;align-items: center;width…...

补代码随想录算法训练营第44天 | 完全背包、518. 零钱兑换 II 、377. 组合总和 Ⅳ

完全背包 视频讲解&#xff1a;带你学透完全背包问题&#xff01; 和 01背包有什么差别&#xff1f;遍历顺序上有什么讲究&#xff1f;_哔哩哔哩_bilibili https://programmercarl.com/%E8%83%8C%E5%8C%85%E9%97%AE%E9%A2%98%E7%90%86%E8%AE%BA%E5%9F%BA%E7%A1%80%E5%AE%8C%E5…...

【Linux】网络基础常识{OSI七层模型/ TCP/IP / 端口号 /各种协议}

文章目录 1.网络常识1.0DHCP协议1. 1IP地址/MAC地址/ARP协议是什么&#xff1f;IP/MACARP&#xff1a;IP ⇒ MAC 1.2手机连接wifi的原理 SSID与BSSID手机连接wifiSSID与BSSID 1.3手机如何通过“数据/流量”上网&#xff1f;1.4电脑连接wifi的原理&#xff1f;电脑通过热点上网…...

python--面向对象编程和类的定义,对象的创建

一、面向对象简介 1、什么是面向对象 面向对象是一种编程思想&#xff0c;把数据和对数据的多个操作方法封装在一起组成类&#xff0c;这样通过这个类创建出来的对象,就可以直接调用这些方法了。 2、面向对象相关的术语 类&#xff1a;用来描述具有相同的属性和方法的对象的…...

nssm 工具把asp.net core mvc变成 windows服务,使用nginx反向代理访问

nssm工具的作用&#xff1a;把项目部署成Windows服务&#xff0c;可以在系统后台运行 1.创建一个asp.net core mvc的项目weblication1 asp.net core mvc项目要成为windows服务需要安装下面的nuget包 <ItemGroup><PackageReference Include"Microsoft.Extension…...

String Encryptor custom Bean not found with name ‘jasyptStringEncryptor‘...

项目采用 spring boot 2.6.13 jasypt-spring-boot-starter 3.0.5 apollo-client 1.6.0 自定义jasyptStringEncryptor&#xff0c;服务器上启动死活报找不到bean jasyptStringEncryptor&#xff0c;采用默认的&#xff0c;密文配置项自然解密失败导致服务无法启动。 经过一…...

React 第五十五节 Router 中 useAsyncError的使用详解

前言 useAsyncError 是 React Router v6.4 引入的一个钩子&#xff0c;用于处理异步操作&#xff08;如数据加载&#xff09;中的错误。下面我将详细解释其用途并提供代码示例。 一、useAsyncError 用途 处理异步错误&#xff1a;捕获在 loader 或 action 中发生的异步错误替…...

云计算——弹性云计算器(ECS)

弹性云服务器&#xff1a;ECS 概述 云计算重构了ICT系统&#xff0c;云计算平台厂商推出使得厂家能够主要关注应用管理而非平台管理的云平台&#xff0c;包含如下主要概念。 ECS&#xff08;Elastic Cloud Server&#xff09;&#xff1a;即弹性云服务器&#xff0c;是云计算…...

以下是对华为 HarmonyOS NETX 5属性动画(ArkTS)文档的结构化整理,通过层级标题、表格和代码块提升可读性:

一、属性动画概述NETX 作用&#xff1a;实现组件通用属性的渐变过渡效果&#xff0c;提升用户体验。支持属性&#xff1a;width、height、backgroundColor、opacity、scale、rotate、translate等。注意事项&#xff1a; 布局类属性&#xff08;如宽高&#xff09;变化时&#…...

ssc377d修改flash分区大小

1、flash的分区默认分配16M、 / # df -h Filesystem Size Used Available Use% Mounted on /dev/root 1.9M 1.9M 0 100% / /dev/mtdblock4 3.0M...

解锁数据库简洁之道:FastAPI与SQLModel实战指南

在构建现代Web应用程序时&#xff0c;与数据库的交互无疑是核心环节。虽然传统的数据库操作方式&#xff08;如直接编写SQL语句与psycopg2交互&#xff09;赋予了我们精细的控制权&#xff0c;但在面对日益复杂的业务逻辑和快速迭代的需求时&#xff0c;这种方式的开发效率和可…...

第25节 Node.js 断言测试

Node.js的assert模块主要用于编写程序的单元测试时使用&#xff0c;通过断言可以提早发现和排查出错误。 稳定性: 5 - 锁定 这个模块可用于应用的单元测试&#xff0c;通过 require(assert) 可以使用这个模块。 assert.fail(actual, expected, message, operator) 使用参数…...

css的定位(position)详解:相对定位 绝对定位 固定定位

在 CSS 中&#xff0c;元素的定位通过 position 属性控制&#xff0c;共有 5 种定位模式&#xff1a;static&#xff08;静态定位&#xff09;、relative&#xff08;相对定位&#xff09;、absolute&#xff08;绝对定位&#xff09;、fixed&#xff08;固定定位&#xff09;和…...

SpringCloudGateway 自定义局部过滤器

场景&#xff1a; 将所有请求转化为同一路径请求&#xff08;方便穿网配置&#xff09;在请求头内标识原来路径&#xff0c;然后在将请求分发给不同服务 AllToOneGatewayFilterFactory import lombok.Getter; import lombok.Setter; import lombok.extern.slf4j.Slf4j; impor…...

tree 树组件大数据卡顿问题优化

问题背景 项目中有用到树组件用来做文件目录&#xff0c;但是由于这个树组件的节点越来越多&#xff0c;导致页面在滚动这个树组件的时候浏览器就很容易卡死。这种问题基本上都是因为dom节点太多&#xff0c;导致的浏览器卡顿&#xff0c;这里很明显就需要用到虚拟列表的技术&…...

Java + Spring Boot + Mybatis 实现批量插入

在 Java 中使用 Spring Boot 和 MyBatis 实现批量插入可以通过以下步骤完成。这里提供两种常用方法&#xff1a;使用 MyBatis 的 <foreach> 标签和批处理模式&#xff08;ExecutorType.BATCH&#xff09;。 方法一&#xff1a;使用 XML 的 <foreach> 标签&#xff…...