首页 > 其他分享 >[rustGUI][iced]基于rust的GUI库iced(0.13)的部件学习(02):滑动条部件实现部件(文本或其他)缩放(slider)

[rustGUI][iced]基于rust的GUI库iced(0.13)的部件学习(02):滑动条部件实现部件(文本或其他)缩放(slider)

时间:2025-01-08 13:47:56浏览次数:8  
标签:slidervalue 缩放 iced 部件 value slider 滑动

前言
本文是关于iced库的部件介绍,iced库是基于rust的GUI库,作者自述是受Elm启发。
iced目前的版本是0.13.1,相较于此前的0.12版本,有较大改动。
本合集是基于新版本的关于分部件(widget)的使用介绍,包括源代码介绍、实例使用等。

环境配置
系统:window10
平台:visual studio code
语言:rust
库:iced 0.13

slider部件简介

iced的官方定义,slider的功能是:

Sliders let users set a value by moving an indicator.

1、slider的定义与参数

官方源码
pub struct Slider<'a, T, Message, Theme = crate::Theme>
where
    Theme: Catalog,
{
    range: RangeInclusive<T>,
    step: T,
    shift_step: Option<T>,
    value: T,
    default: Option<T>,
    on_change: Box<dyn Fn(T) -> Message + 'a>,
    on_release: Option<Message>,
    width: Length,
    height: f32,
    class: Theme::Class<'a>,
}

看一下slider创建实例的典型调用:

slider(0.0..=100.0, state.value, Message::ValueChanged)

结合Slider的结构体,我们主要关注以下参数:

range: RangeInclusive<T>,
step: T,
value: T,
on_change: Box<dyn Fn(T) -> Message + 'a>,

range,顾名思义,指的是slider的滑动范围,它的类型是:RangeInclusive<T>,这里的T是泛型,而RanInclusive的实现形式如下:
1..=3
表示slider的滑动范围的起始值为1,结束值为3。也可以理解为最小值和最大值。
step表示slider的步长,即滑动时每移动一个单元的长度,默认为为1.0。
value表示slider的当前值,即滑动过程的过程值。
on_change是slider的滑动事件处理函数,即滑动时会触发此函数,函数的返回消息中包含有实时值。
image

2、实例使用

我们添加一个slider以及一个text部件,当我们滑动slider时,text实时显示slider的值,并且text的文本尺寸会随着slider的值的变化而变化。
先来修改代码:
为结构体Counter创建一个变量,用于传递slider的值。

#[derive(Clone,Default)]
struct Counter {
    slidervalue:f32,
}

然后新建一个Message,用于监控slider的滑动事件:

#[derive(Debug,Clone, Copy)]
enum Message {
    SliderChange(f32),
}

然后就是update和view中的更新与渲染:
update:

 match message {
            
            Message::SliderChange(value) =>{

                self.slidervalue = value;

            }
        }

view:

let sl1=slider(
            1.0..=100.0, 
            self.slidervalue, 
            Message::SliderChange)
                                .height(40).width(200)
                                .step(1.0);
        let sv;
        if self.slidervalue < 10.0 {
            sv = 10.0;
        } else {
            sv=self.slidervalue;
        }
        let tt1=text(format!("value:{}",self.slidervalue)).size(sv);
        column![
            sl1,
            tt1,
        ].align_x(iced::Center)
        .padding(20)
        .into()

此例中,我们将slider的range设置为1.0到100.0,并且将变量slidervalue绑定到了text的size参数。
我们看一下动态演示:
image
当然,上面演示的是很简单的应用,事实上,slider可以用于调整应用程序中的某些输入参数值,也可以调整布局的大小,比如调整图像显示区域等。这些在后续的博文中都会应用到,本文不做赘述。

3、综述

slider部件与button、text等部件,都属于比较常用的部件,无论是用于窗口界面的输入,还是用于布局的调整,都可以很好的使用。本文以slider为例,介绍一下单个部件的使用,后续博文中,将不再单独介绍某个部件,而是以功能应用为导向,附带部件的使用介绍。

标签:slidervalue,缩放,iced,部件,value,slider,滑动
From: https://www.cnblogs.com/rongjv/p/18659437

相关文章

  • 【 lvgl专题】LVGL核心部件——弧(arc)控件的介绍
    概述本文介绍LVGL核心部件——弧(arc),它由背景和前景弧组成。前景(指示器)可以进行触摸调整。 LVGL核心部件——弧(arc)控件一、部件和样式 LV_PART_MAIN 使用典型的背景样式属性绘制背景,使用圆弧样式属性绘制圆弧。圆弧的大小和位置将遵循 padding 样式属性。LV_PART_I......
  • 8k分辨率下html2canvas不支持文本缩放的解决方案
    文章目录背景常规方案安装依赖引入依赖使用出现问题html2canvas原理解析局限性解决方案dom-to-image库安装依赖引入dom-to-image使用dom-to-image原理创建虚拟DOM副本渲染虚拟DOM为SVG或其他格式导出为图片数据`dom-to-image`的相关方法背景前端同......
  • 基于开放模型的推理时计算缩放
    过去几年,大语言模型(LLM)的进程主要由训练时计算缩放主导。尽管这种范式已被证明非常有效,但预训练更大模型所需的资源变得异常昂贵,数十亿美元的集群已经出现。这一趋势引发了人们对其互补方法的浓厚兴趣,即推理时计算缩放。推理时计算缩放无需日趋庞大的预训练预算,而是采用动态......
  • C# WebBrowser 网页缩放的方法
    C#WebBrowser网页缩放的方法|Id|Title|DateAdded|SourceUrl|PostType|Body|BlogId|Description|DateUpdated|IsMarkdown|EntryName|CreatedTime|IsActive|AutoDesc|AccessPermission||-------------|-------------|-------------|----------......
  • [rustGUI][iced]基于rust的GUI库iced(0.13)的部件学习(00):iced简单窗口的实现以及在窗口显
    前言本文是关于iced库的部件介绍,iced库是基于rust的GUI库,作者自述是受Elm启发。iced目前的版本是0.13.1,相较于此前的0.12版本,有较大改动。本合集是基于新版本的关于分部件(widget)的使用介绍,包括源代码介绍、实例使用等。环境配置系统:window10平台:visualstudiocode语言:rust......
  • Flurl.Http集成Microsoft.Extensions.ServiceDiscovery
    .Net8.0及以上版本,微软官方提供了服务发现Nuget包Microsoft.Extensions.ServiceDiscovery,能够对HttpClient请求服务进行服务发现和解析,对于轻量级Flurl.Http来说,也可以进行集成,主要思路是通过HttpClientFactory构建HttpClient实例,调用newFlurlClient(httpClientFactory.Crea......
  • 我的AI工具箱Tauri版-ZoomImageSUPIR图像超细节缩放
    本教程基于自研的AI工具箱Tauri版进行ZoomImageSUPIR图像超细节缩放。ZoomImageSUPIR图像超细节缩放是一款专为图像处理优化的工具,支持图像的高精度放大与缩小操作,满足多场景需求。通过集成SUPIR(Super-resolutionImageProcessingwithIntelligentRefinement)技术,能够......
  • 【Python GUI 编程】tkinter :Ttk 小部件
    在本文中,将介绍Tkinter.ttk主题小部件,是常规Tkinter小部件的升级版本。Tkinter有两种小部件:经典小部件、主题小部件。Tkinter于1991年推出了经典小部件,2007年在Tk8.5中添加新式的主题小部件。主题小部件更新了部分经典小部件,并增加了部分新的小部件。要使用tkinter.tt......
  • C# winform自定义图片空间 缩放、拖拽、绘画
    首先简单介绍一下图片自定义的功能1、滑动鼠标滚轮缩放图片;2、按住鼠标左键拖拽图片;3、可选绘画矩形、圆、直线、画笔;4、可选连续绘画、单次绘画;5、每次绘画通过事件返回起点坐标、终点坐标;6、右击可重置图片大小(适应窗口)、原始尺寸(100%)、另存当前图片、清除绘画;7、For......
  • 深度学习笔记——dVAE(DALL·E的核心部件)
    详细介绍DALL·E的核心部件之一——dVAE,在VQ-VAE的基础上使用Gumbel-Softmax实现采样,用于图像生成。文章目录前情提要VAEVQ-VAEVAEvs.VQ-VAE区别不可导问题及解决方法dVAEVQ-VAE和dVAE的对比背景:VQ-VAE的停止梯度策略局限性dVAE的结构dVAE引入Gumbel-Sof......