RustGUI学习(iced)之小部件(四):如何使用单选框radio部件?

前言
本专栏是学习Rust的GUI库iced的合集,将介绍iced涉及的各个小部件分别介绍,最后会汇总为一个总的程序。
iced是RustGUI中比较强大的一个,目前处于发展中(即版本可能会改变),本专栏基于版本0.12.1.

概述
这是本专栏的第四篇,主要讲述单选框按钮radio部件的使用,会结合实例来说明。
系列博客链接
1、RustGUI学习(iced)之小部件(一):如何使用按钮和文本标签部件
2、RustGUI学习(iced)之小部件(二):如何使用滑动条部件
3、RustGUI学习(iced)之小部件(三):如何使用下拉列表pick_list?

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

在这里插入图片描述
注:iced是一个受Elm启发而编写,适用于rust语言的跨平台的GUI库。

本篇内容:
1、radio

单选框部件

单选框部件radio在iced中的定义如下:

/// Creates a new [`Radio`].       
///
/// [`Radio`]: crate::Radio
pub fn radio<Message, Theme, Renderer, V>(
    label: impl Into<String>,
    value: V,
    selected: Option<V>,
    on_click: impl FnOnce(V) -> Message,
) -> Radio<Message, Theme, Renderer>
where
    Message: Clone,
    Theme: radio::StyleSheet,
    Renderer: core::text::Renderer,
    V: Copy + Eq,
{
    Radio::new(label, value, selected, on_click)
}

其由Radio来创建:

#[allow(missing_debug_implementations)]
pub struct Radio<Message, Theme = crate::Theme, Renderer = crate::Renderer>    
where
    Theme: StyleSheet,
    Renderer: text::Renderer,
{
    is_selected: bool,
    on_click: Message,
    label: String,
    width: Length,
    size: f32,
    spacing: f32,
    text_size: Option<Pixels>,
    text_line_height: text::LineHeight,
    text_shaping: text::Shaping,
    font: Option<Renderer::Font>,
    style: Theme::Style,
}

我们来看一下radio部件的参数和属性,其中项width、text_size之类的属性我们将不再赘述,主要看一下radio部件主要的参数:
1、label是字符类型,表示单选框的名称,
2、is_selected:布尔量,它是一个比较结果:

is_selected: Some(value) == selected,  

其中value是当前radio的预设值,将其与实时值比较,以判定当前radio是否被选中。
3、on_click:用于监听radio是否被选中,若选中,则触发消息。其反馈值包含当前选中的是哪个radio值。
简单的说一下外观样式的自定义:
和之前所说的部件类似,radio部件如果要自定义样式,需要先创建自定义结构体样式:

//自定义radio样式1
struct MyRadioStyle;

然后实现StyleSheet:

impl radio::StyleSheet for MyRadioStyle {    
    type Style =  Theme;
    fn active(&self, style: &Self::Style, is_selected: bool) -> radio::Appearance {
        radio::Appearance { 
            background: Background::Color(Color::from_rgb8(180, 184, 248)), 
            dot_color: Color::from_rgb8(252, 29, 29), 
            border_width:1.0, 
            border_color: Color::BLACK, 
            text_color:Some(Color::BLACK),
         }
    }
    fn hovered(&self, style: &Self::Style, is_selected: bool) -> radio::Appearance {
        radio::Appearance { 
            background: Background::Color(Color::from_rgb8(126, 241, 132)), 
            dot_color: Color::from_rgb8(252, 29, 29), 
            border_width: 1.0, 
            border_color: Color::BLACK, 
            text_color: Some(Color::BLACK),
        }
    }
}

其效果如下:
在这里插入图片描述

下面来看一下实际使用,一般来说,单选框至少是成对出现,否则单选框就失去了意义。本例中我们假设有4个单选框为1组,我们先创建一个枚举如下:

#[derive(Debug,Clone,Copy,PartialEq,Eq)]
pub enum Choise{  
    A,
    B,
    C,
    All,
}

这个Choise枚举包含A、B、C、All四个选项,将会分别对应四个单选框。
然后我们在Message枚举中添加一个项:

RadioChose(Choise),   

RadioChose消息的内部参数是Choise枚举。
因为radio的参数中还有一个selected值,其定义为:

selected: Option<V>,

所以,我们在结构体中新建变量:

select_choise:Option<Choise>,

新变量select_choise是一个枚举类型,参数是Choise枚举。

然后我们将创建4个radio部件:

radio("A", Choise::A, self.select_choise, Message::RadioChose).width(6).size(15).spacing(4),  
                radio("B",Choise::B, self.select_choise, Message::RadioChose).width(6).size(15).spacing(4),
                radio("C",Choise::C, self.select_choise, Message::RadioChose).width(6).size(15).spacing(4),
                radio("All",Choise::All, self.select_choise, Message::RadioChose).width(6).size(15).spacing(4),

可以看到其格式都是相同的,我们选取其中一个来做说明。

radio("A", Choise::A, self.select_choise, Message::RadioChose).width(6).size(15).spacing(4), 

如上代码,其中字符串“A”表示radio的名称,即label属性。
而Choise::A对应的是value属性,即当前radio的值。
而select_choise则表示实时值,它会根据所选择的不同radio来改变,其改变逻辑在update函数中实现。
最后,Message::RadioChose表示消息触发。
当我们选择4个单选框中的任何一个时,都会触发消息Message,Message会反馈当前选择的radio值,我们在update中处理这个值:

Message::RadioChose(choise)=>{
    
                self.select_choise=Some(choise);
            }

即将触发产生的radio实时值传递给select_choise,这样UI就会更新当前radio选中项。
在这里插入图片描述
以上就是单选框部件radio的使用介绍,相对来说,radio的使用比较简单,我们来看一下动态演示:
在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

颠倒二进制位

优质博文IT-BLOG-CN 一、题目 颠倒给定的32位无符号整数的二进制位。 请注意&#xff0c;在某些语言&#xff08;如 Java&#xff09;中&#xff0c;没有无符号整数类型。在这种情况下&#xff0c;输入和输出都将被指定为有符号整数类型&#xff0c;并且不应影响您的实现&…

NI CRIO 9045 LABVIEW2020

1.labview工程如果要访问CRIO&#xff0c;需要设置以下&#xff0c;否则在项目中连接失败。 2.项目中如果要传文件&#xff0c;需要安装WebDEV 3.使用WebDAV将文件传输到实时(RT)目标 https://knowledge.ni.com/KnowledgeArticleDetails?idkA03q000000YGytCAG&lzh-CN

[python数据处理系列] 深入理解与实践基于聚类的过采样与欠采样技术:以K-Means为例

目录 一、过采样介绍 (一)什么是过采样 (二)过采样的优点 (三)过采样的缺点 二、欠采样介绍 (一)什么是欠采样 (二)欠采样的优点 (三)欠采样的缺点 三、基于聚类的欠抽样方法(K-Means欠采样/KMeans-Undersampling) (一)KMeans欠采样原理及其步骤介绍 (二)为什么不采…

UE4 Widget制作搜索框

效果&#xff1a; 一、控件层级结构 1.父控件层级结构 2.子控件层级结构 二、蓝图 1.先清除掉创建子项&#xff08;注意&#xff1a;这里使用的是reverse循环&#xff01;&#xff09; 2.判断是否含有关键字&#xff0c;创建子控件

盲人手机导航:科技之光引领无障碍出行新纪元

在这个日新月异的数字时代&#xff0c;科技不仅改变了我们获取信息的方式&#xff0c;更在无声中拓宽了视障人士的生活半径。盲人手机导航这一创新技术&#xff0c;正逐步成为他们探索世界、实现独立出行的重要伙伴。 对于大多数人而言&#xff0c;日常出行或许只是一次…

Vue3+Nuxt3 从0到1搭建官网项目(SEO搜索、中英文切换、图片懒加载)

Vue2Nuxt2 从 0 到1 搭建官网~ 想开发一个官网&#xff0c;并且支持SEO搜索&#xff0c;当然离不开我们的 Nuxt &#xff0c;Nuxt2 我们刚刚可以熟练运用&#xff0c;现在有出现了Nuxt3&#xff0c;那通过本篇文章让我们一起了解一下。 安装 Nuxt3 // npx nuxilatest init &…

解析Redis Key Prefix配置之谜:双冒号“::”的由来与作用

前言 在使用Spring Boot集成Redis进行应用开发时&#xff0c;为了增强缓存键的可读性和管理性&#xff0c;我们常常会在配置文件中设定一个全局的key-prefix。如果你发现存储至Redis的键自动附加了“::”&#xff0c;本文将深入探讨这一现象背后的原因&#xff0c;解析Spring …

Redis线程模型及性能优化概述

redis线程模型&#xff1a; 网络模块命令处理 redis的性能&#xff1a; 一个取决于物理内存&#xff0c;另一个是对于socket请求的处理速度。 4.0以前 单线程模式 请求流程&#xff1a;对于一个请求&#xff0c;线程会根据操作产生相应的事件&#xff08;读&#xff0c;写事…

张大哥笔记:服务器有挖矿木马程序,该如何处理?

这篇文章发表于2021年&#xff0c;今天借这个平台再发布一下&#xff0c;希望对大家有所帮助&#xff01; 今天收到一个粉丝求助&#xff0c;说收到了阿里云官方短信通知提示有挖矿程序&#xff0c;要求立即整改&#xff0c;否则会关停服务器&#xff0c;以下是我和他的对话内…

机器学习:深入解析SVM的核心概念(问题与解答篇)【二、对偶问题】

对偶问题 **问题一&#xff1a;什么叫做凸二次优化问题&#xff1f;而且为什么符合凸二次优化问题&#xff1f;**为什么约束条件也是凸的半空间&#xff08;Half-Space&#xff09;凸集&#xff08;Convex Set&#xff09;半空间是凸集的例子SVM 约束定义的半空间总结 **问题二…

CTFHub-Web-SSRF

CTFHub-Web-SSRF-WP 一、内网访问 1.题目提示说访问127.0.0.1的flag.php&#xff0c;在URL后面添加路径没想到直接访问成功 二、伪协议读取文件 1.题目提示说访问Web目录下的flag.php&#xff0c;联想到Web目录一般存放于/var/www/html/里&#xff0c;去修改URL尝试进行访问…

【多级缓存】多级缓存OpenResty,Canal,nginx本地缓存

多级缓存 安装OpenRestyOpenResty入门OpenResty获取请求参数OpenResty向tomcat服务器发送请求 在nginx与tomcat端之间添加redis缓存Redis本地缓存缓存同步缓存同步策略基于Canal的异步通知安装Canal Canal客户端 安装OpenResty OpenResty是一个基于 Nginx的高性能 Web 平台&am…

初探 JUC 并发编程:Java 并发包中并发 List 源码剖析

最近在阅读 《Java 并发编程之美》这本书&#xff0c;感觉学到了很多东西&#xff1b;所以我决定将从事书中学到的思想和一些经典的案例整理成博客的形式与大家分享和交流&#xff0c;如果对大家有帮助别忘了留下点赞和关注捏。 第五部分&#xff1a;Java 并发包中并发 List 源…

STM32CubeMX+MDK通过I2S接口进行音频输入输出(全双工读写一个DMA回调)续-音质问题解决总结

一、前言 之前进行了STM32CubeMXMDK通过I2S接口进行音频输入输出&#xff08;全双工读写一个DMA回调&#xff09;的研究总结&#xff1a; https://juejin.cn/post/7339016190612881408#heading-34 后续音质问题解决了&#xff0c;目前测试下来48khz的双声道使用效果很好&…

基于uniapp+微信小程序的智能停车场管理小程序,附源码

博主介绍&#xff1a;✌程序员徐师兄、7年大厂程序员经历。全网粉丝12w、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; 精彩专栏推荐订阅&#x1f447;…

护航智慧交通安全 | 聚铭精彩亮相2024交通科技创新及信创产品推广交流会

4月26日&#xff0c;石家庄希尔顿酒店内&#xff0c;河北省智能交通协会盛大举办2024年度交通科技创新及信创产品推广交流会。聚铭网络受邀参与&#xff0c;携旗下安全产品及解决方案精彩亮相&#xff0c;为智慧交通安全保驾护航。 为深化高速公路创新驱动发展战略&#xff0…

Java网址url工具类

功能描述 无需引入三方依赖文本匹配网址&#xff08;支持多个&#xff09;网址解析&#xff08;包括协议、主机、路径、参数等&#xff09; package com.qiangesoft.image.utils;import org.springframework.util.Assert; import org.springframework.util.CollectionUtils;i…

深度学习基础之《TensorFlow框架(16)—神经网络案例》

一、mnist手写数字识别 1、数据集介绍 mnist数据集是一个经典的数据集&#xff0c;其中包括70000个样本&#xff0c;包括60000个训练样本和10000个测试样本 2、下载地址&#xff1a;http://yann.lecun.com/exdb/mnist/ 3、文件说明 train-images-idx3-ubyte.gz: training s…

C#编程模式之装饰模式

创作背景&#xff1a;朋友们&#xff0c;我们继续C#编程模式的学习&#xff0c;本文我们将一起探讨装饰模式。装饰模式也是一种结构型设计模式&#xff0c;它允许你通过在运行时向对象添加额外的功能&#xff0c;从而动态的修改对象的行为。装饰模式本质上还是继承的一种替换方…

分享三款可以给pdf做批注的软件

PDF文件不像Word一样可以直接编辑更改&#xff0c;想要在PDF文件上进行编辑批注需要用到一些专业的软件&#xff0c;我自己常用的有三款&#xff0c;全都是官方专业正版的软件&#xff0c;功能丰富强大&#xff0c;使用起来非常方便&#xff01; 1.edge浏览器 这个浏览器不仅可…
最新文章