【rust/egui】(七)看看template的app.rs:Slider

说在前面

  • rust新手,egui没啥找到啥教程,这里自己记录下学习过程
  • 环境:windows11 22H2
  • rust版本:rustc 1.71.1
  • egui版本:0.22.0
  • eframe版本:0.22.0
  • 上一篇:这里

Slider

  • 滑块,如下图
    在这里插入图片描述

  • 定义:

    pub struct Slider<'a> {get_set_value: GetSetValue<'a>, // 滑块对应的值 闭包 设置并返回值range: RangeInclusive<f64>, // 值的范围spec: SliderSpec, // 指数型滑块 某一段值得变化非常小clamp_to_range: bool, // 是否对值进行裁剪smart_aim: bool, // 找到范围内的最'简约'的数值 例如小数位最小的值show_value: bool, // 是否显示值orientation: SliderOrientation, // 滑块的方向 横向或者竖向prefix: String, // 滑块显示值的前缀 例如 "x=suffix: String, // 滑块显示值的后缀 例如  m"text: WidgetText, // 滑块文本 可用于解释滑块控制的值的含义之类的/// Sets the minimal step of the widget valuestep: Option<f64>, // 拖动滑块时变动的最小值drag_value_speed: Option<f64>, min_decimals: usize, // 显示的最小小数位数max_decimals: Option<usize>, // 显示的最大小数位数custom_formatter: Option<NumFormatter<'a>>, // 对显示的值进行自定义格式化custom_parser: Option<NumParser<'a>>,trailing_fill: Option<bool>, // 是否对滑块下的滑动条填充颜色
    }
    
  • 我们可以通过ui.add()的方式进行添加:

    ui.add(egui::Slider::new(value, 0.0..=10.0).text("value"));
    

    new方法的定义为:

    pub fn new<Num: Numeric>(value: &'a mut Num, range: RangeInclusive<Num>) -> Self
    

    参数value为可变借用类型,且使用Numeric特性进行约束
    该方法生成的滑块为横向滑块

  • 同样可以自定义一些样式,或者改变一些属性

  • orientation

    // 可以使用vertical方法生成竖向滑块
    ui.add(egui::Slider::new(value, 0.0..=10.0).text("value").vertical());
    

    在这里插入图片描述

  • spec

    ui.add(egui::Slider::new(value, 0.0..=1000.0).text("value").logarithmic(true));
    

    在这里插入图片描述

  • smart_aim,默认值为true

    ui.add(egui::Slider::new(value, 0.0..=10.0).text("value").min_decimals(2).smart_aim(false));
    

    在这里插入图片描述

  • prefix/suffix

    ui.add(egui::Slider::new(value, 0.0..=10.0).text("value").prefix("x=").suffix("m"));
    

    在这里插入图片描述

  • trailing_fill

    ui.add(egui::Slider::new(value, 0.0..=10.0).text("value").trailing_fill(true));
    

    在这里插入图片描述

  • custom_formatter/custom_parser

    ui.add(egui::Slider::new(value, 0.0..=((60.0 * 60.0 * 24.0) - 1.0)).custom_formatter(|n, _| {let n = n as i32;let hours = n / (60 * 60);let mins = (n / 60) % 60;let secs = n % 60;format!("{hours:02}:{mins:02}:{secs:02}")}).custom_parser(|s| {let parts: Vec<&str> = s.split(':').collect();if parts.len() == 3 {parts[0].parse::<i32>().and_then(|h| {parts[1].parse::<i32>().and_then(|m| {parts[2].parse::<i32>().map(|s| ((h * 60 * 60) + (m * 60) + s) as f64)})}).ok()} else {None}}),
    );
    

    在这里插入图片描述

其他

  • app.rs中还有一些其他元素,例如labelhyperlink_to等,这些相对来说比较简单,这里就不再详细展开
  • 接下来我们将把实现从template挪开,开始接触egui中的其他内容

参考

  • slider

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

单片机-控制按键点亮LED灯

1、按键电路图 定义四个按键引脚 1、按键按下 为 输入为低电平 2、按键不按下 IO有上拉电阻&#xff0c;为高电平 // 定义 按键的 管教 sbit KEY1 P3^1; sbit KEY2 P3^0; sbit KEY3 P3^2; sbit KEY4 P3^3; 2、LED灯电路图 LED 输出高电平为亮 // 定义LED灯 管教 sbit LED1…

Web服务器部署上线踩坑流程回顾

5月份时曾部署上线了C的Web服务器&#xff0c;温故而知新&#xff0c;本篇文章梳理总结一下部署流程知识&#xff1b; 最初的解决方案&#xff1a;https://blog.csdn.net/BinBinCome/article/details/129750951?spm1001.2014.3001.5501后来的解决方案&#xff1a;https://blog…

海格里斯HEGERLS高密度料箱式四向穿梭车存储系统有哪些显著优势?

近些年仓储货架向着自动化、智能化发展&#xff0c;因此市面上出现很多不同类型的智能自动化仓储货架。其中&#xff0c;最受企业青睐的便是四向穿梭车货架。四向穿梭车货架根据其载重不同可分为托盘式和料箱式两大类。这两种不同类型的四向穿梭车货架在结构形式和控制方式上基…

微服务-gateway鉴权

文章目录 一、前言二、gateway鉴权1、依赖配置2、编写代码3、GlobalFilter详解3.1、GlobalFilter简介3.2、GlobalFilter自定义执行顺序3.2.1、实现Order接口实现自定义执行顺序 一、前言 网关是介于客户端和服务器端之间的中间层&#xff0c;所有的外部请求都会先经过 网关这一…

深入了解Docker镜像操作

Docker是一种流行的容器化平台&#xff0c;它允许开发者将应用程序及其依赖项打包成容器&#xff0c;以便在不同环境中轻松部署和运行。在Docker中&#xff0c;镜像是构建容器的基础&#xff0c;有些家人们可能在服务器上对docker镜像的操作命令不是很熟悉&#xff0c;本文将深…

【LeetCode-中等题】200. 岛屿数量

文章目录 题目方法一&#xff1a;深度优先搜索 dfs方法二&#xff1a;广度优先搜索 bfs方法三&#xff1a;&#xff08;重点掌握&#xff09;并查集 题目 方法一&#xff1a;深度优先搜索 dfs 思路&#xff1a;让一个扫描指针扫描每一个格子&#xff0c;然后每扫到一个为1的格…

Spring Boot日志基础使用 设置日志级别

然后 我们来说日志 日志在实际开发中还是非常重要的 即可记录项目状态和一些特殊情况发生 因为 我们这里不是将项目 所以 讲的也不会特别深 基本还是将Spring Boot的日志设置或控制这一类的东西 相对业务的领域我们就不涉及了 日志 log 初期最明显的作用在于 开发中 你可以用…

element+vue table表格全部数据和已选数据联动

1.组件TableChoose <template><div class"tableChooseBox"><div class"tableRow"><div class"tableCard"><div class"tableHeadTip">全部{{ labelTitle }}</div><slot name"body" …

OpenCV(十三):图像中绘制直线、圆形、椭圆形、矩形、多边形和文字

目录 1.绘制直线line() 2.绘制圆形circle() 3.绘制椭圆形ellipse() 4.绘制矩形rectangle() 5.绘制多边形 fillPoly() 6.绘制文字putText() 7.例子 1.绘制直线line() CV_EXPORTS_W void line(InputOutputArray img,Point pt1, Point pt2,const Scalar& color,int t…

无涯教程-Android Studio函数

第1步-系统要求 您将很高兴知道您可以在以下两种操作系统之一上开始Android应用程序的开发- MicrosoftWindows10/8/7/Vista/2003(32或64位)MacOSX10.8.5或更高版本,最高10.9(小牛) GNOME或KDE桌面 第二点是,开发Android应用程序所需的所有工具都是开源的,可以从Web上下载。以…

vue的第2篇 第一个vue程序

一 环境的搭建 1.1常见前端开发ide 1.2 安装vs.code 1.下载地址&#xff1a;Visual Studio Code - Code Editing. Redefined 2.进行安装 1.2.1 vscode的中文插件安装 1.在搜索框输入“chinese” 2.安装完成重启&#xff0c;如下变成中文 1.2.2 修改工作区的颜色 选中[浅色]…

编译KArchive在windows10下

使用QT6和VS2019编译KArchive的简要步骤&#xff1a; 安装 Qt &#xff0c;我是用源码自己编译的 "F:\qtbuild"安装CMakefile并配置环境变量安装Git下载ECM源码 https://github.com/KDE/extra-cmake-modules.git-------------------------------------------------…