前言
本文是关于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的滑动事件处理函数,即滑动时会触发此函数,函数的返回消息中包含有实时值。
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参数。
我们看一下动态演示:
当然,上面演示的是很简单的应用,事实上,slider可以用于调整应用程序中的某些输入参数值,也可以调整布局的大小,比如调整图像显示区域等。这些在后续的博文中都会应用到,本文不做赘述。
3、综述
slider部件与button、text等部件,都属于比较常用的部件,无论是用于窗口界面的输入,还是用于布局的调整,都可以很好的使用。本文以slider为例,介绍一下单个部件的使用,后续博文中,将不再单独介绍某个部件,而是以功能应用为导向,附带部件的使用介绍。
标签:slidervalue,缩放,iced,部件,value,slider,滑动 From: https://www.cnblogs.com/rongjv/p/18659437