switch组件的功能与用法

news2025/1/26 17:20:12

文章目录

  • 1 概念介绍
  • 2 使用方法
  • 3 示例代码

我们在上一章回中介绍了PageView这个Widget,本章回中将介绍Switch Widget.闲话休提,让我们一起Talk Flutter吧。

在这里插入图片描述

1 概念介绍

我们在这里介绍的Switch是指左右滑动的开关,常用来表示某项设置是打开还是关闭。Flutter中使用Switch类表示该Widget。本章回中将详细介绍它的用法。

2 使用方法

和其它和Widget一样,Switch提供了一些属性来控制自己,接下来我们将介绍这些常用的属性:

  • value属性,该属性表示开关的状态,它有两个值true和false,分别表示Switch打开和关闭;
  • onChanged属性,该属性是一个方法,当开关的状态发生变化时回调它,从方法的参数中可以得到开关的状态;
  • activeColor属性,该属性表示开关打开时的颜色,如果不设置默认为绿色;
  • inactiveThumbColor属性,该属性表示开关关闭时图片的颜色,如果不指定默认为灰色;
  • inactiveTrackColor属性,该属性表示开关关闭时轨道的颜色,如果不指定默认为灰色;
    注意:开关打开时的颜色通过一个属性可以控制,关闭时的颜色通过两个属性来控制。我们在这里说的图片是指开关上的小圆形,该图片可以通过相关的属性来修改。轨道
    是指开关滑动时的轨迹。上面介绍的属性中前两个是必选属性,其它属性是可选属性;

3 示例代码

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      backgroundColor: Colors.purpleAccent,
      title: const Text("Example of Switch Widget"),
    ),
    body: Container(
      color: Colors.lightBlue,
      alignment: Alignment.center,
      width: 92,
      height: 92,
      child: Switch(
        //开关打开时的颜色
        activeColor: Colors.purpleAccent,
        //开关没有打开时的颜色
        inactiveThumbColor: Colors.yellow,
        inactiveTrackColor: Colors.yellow,
        value: setValue,
        onChanged: (v) {
          print("value is ${v}");
          setState(() {
            setValue = v;
          });
        },
      ),
    ),
  );
}

上面的代码中,我们把Switch放到了容器中,并且使用不同的颜色来突出开关的效果。此外,我们在onChanged属性对应的方法中通过setState()方法修改了value
属性的值,这样可以让开关与滑动保持联动,如果不这样做,滑动开关时它的状态会变化,松开开关后它会自动恢复成初始状态.在上面的代码中我本来想通过Switch外
面的容器来修改它的大小,但是发现没有效果,目前还没有找到合适的方法来修改它的大小,以后找到后再和大家分享。
看官们,关于Switch Widget相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

mac 电脑上安装adb命令

在Mac下配置android adb命令环境,配置方式如下: 1、下载并安装IDE (android studio) Android Studio官网下载链接 详细的安装连接请参考 Mac 安装Android studio 2、配置环境 在安装完成之后,将android的adb工具所在…

Couchbase UI: Dashboard

以下是 Couchbase UI Dashboard 页面详细介绍,包括页面布局和功能说明,帮助你更好地理解和使用。 1. 首页(Overview) 功能:提供集群的整体健康状态和性能摘要 集群状态 节点健康状况:绿色(正…

[极客大挑战 2019]Knife1

题目 蚁剑直接连接密码是Syc 拿下flag flag{1d373584-fc74-4a2c-a6d4-3691314be4ab}

【Maui】提示消息的扩展

文章目录 前言一、问题描述二、解决方案三、软件开发(源码)3.1 消息扩展库3.2 消息提示框使用3.3 错误消息提示使用3.4 问题选择框使用 四、项目展示 前言 .NET 多平台应用 UI (.NET MAUI) 是一个跨平台框架,用于使用 C# 和 XAML 创建本机移…

【2025最新计算机毕业设计】基于SSM房屋租赁平台【提供源码+答辩PPT+文档+项目部署】(高质量源码,可定制,提供文档,免费部署到本地)

作者简介:✌CSDN新星计划导师、Java领域优质创作者、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交流。✌ 主要内容:🌟Java项目、Python项目、前端项目、PHP、ASP.NET、人工智能…

(开源)基于Django+Yolov8+Tensorflow的智能鸟类识别平台

1 项目简介(开源地址在文章结尾) 系统旨在为了帮助鸟类爱好者、学者、动物保护协会等群体更好的了解和保护鸟类动物。用户群体可以通过平台采集野外鸟类的保护动物照片和视频,甄别分类、实况分析鸟类保护动物,与全世界各地的用户&…

【转帖】eclipse-24-09版本后,怎么还原原来版本的搜索功能

【1】原贴地址:eclipse - 怎么还原原来版本的搜索功能_eclipse打开类型搜索类功能失效-CSDN博客 https://blog.csdn.net/sinat_32238399/article/details/145113105 【2】原文如下: 更新eclipse-24-09版本后之后,新的搜索功能(CT…

git基础指令大全

版本控制 git管理文件夹 进入要管理的文件夹 — 进入 初始化(提名) git init 管理文件夹 生成版本 .git ---- git在管理文件夹时,版本控制的信息 生成版本 git status 检测当前文件夹下的文件状态 (检测,检测之后就要管理了…

Android实训九 数据存储和访问

实训9 数据存储和访问 一、【实训目的】 1、 SharedPreferences存储数据; 2、 借助Java的I/O体系实现文件的存储, 3、使用Android内置的轻量级数据库SQLite存储数据; 二、【实训内容】 1、实现下图所示的界面,实现以下功能: 1&#xff…

[STM32 标准库]定时器输出PWM配置流程 PWM模式解析

前言: 本文内容基本来自江协,整理起来方便日后开发使用。MCU:STM32F103C8T6。 一、配置流程 1、开启GPIO,TIM的时钟 /*开启时钟*/RCC_APB1PeriphClockCmd(RCC_APB1Periph_TIM2, ENABLE); //开启TIM2的时钟RCC_APB2PeriphClockC…

如何跨互联网adb连接到远程手机-蓝牙电话集中维护

如何跨互联网adb连接到远程手机-蓝牙电话集中维护 --ADB连接专题 一、前言 随便找一个手机,安装一个App并简单设置一下,就可以跨互联网的ADB连接到这个手机,从而远程操控这个手机做各种操作。你敢相信吗?而这正是本篇想要描述的…

将 OneLake 数据索引到 Elasticsearch - 第二部分

作者:来自 Elastic Gustavo Llermaly 及 Jeffrey Rengifo 本文分为两部分,第二部分介绍如何使用自定义连接器将 OneLake 数据索引并搜索到 Elastic 中。 在本文中,我们将利用第 1 部分中学到的知识来创建 OneLake 自定义 Elasticsearch 连接器…

Android Studio:视图绑定的岁月变迁(2/100)

一、博文导读 本文是基于Android Studio真实项目,通过解析源码了解真实应用场景,写文的视角和读者是同步的,想到看到写到,没有上帝视角。 前期回顾,本文是第二期。 private Unbinder mUnbinder; 只是声明了一个 接口…

私有包上传maven私有仓库nexus-2.9.2

一、上传 二、获取相应文件 三、最后修改自己的pom文件

Qt监控系统辅屏预览/可以同时打开4个屏幕预览/支持5x64通道预览/onvif和rtsp接入/性能好

一、前言说明 在监控系统中,一般主界面肯定带了多个通道比如16/64通道的画面预览,随着电脑性能的增强和多屏幕的发展,再加上现在监控摄像头数量的增加,越来越多的用户希望在不同的屏幕预览不同的实时画面,一个办法是打…

LabVIEW心音心电同步采集与实时播放

开发了一个基于LabVIEW开发的心音心电同步采集与实时播放系统。该系统可以同时采集心音和心电信号,并通过LabVIEW的高级功能实现这些信号的实时显示和播放。系统提升心脏疾病诊断的准确性和效率,使医生能够在观察心音图的同时进行听诊。 ​ 项目背景 心…

深入解析ncnn::Net类——高效部署神经网络的核心组件

最近在学习ncnn推理框架,下面整理了ncnn::Net 的使用方法。 在移动端和嵌入式设备上进行高效的神经网络推理,要求框架具备轻量化、高性能以及灵活的扩展能力。作为腾讯开源的高性能神经网络推理框架,ncnn在这些方面表现出色。而在ncnn的核心…

前端【8】HTML+CSS+javascript实战项目----实现一个简单的待办事项列表 (To-Do List)

目录 一、功能需求 二、 HTML 三、CSS 四、js 1、绑定事件与初始设置 2.、绑定事项 (1)添加操作: (2)完成操作 (3)删除操作 (4)修改操作 3、完整js代码 总结…

程序诗篇里的灵动笔触:指针绘就数据的梦幻蓝图<1>

大家好啊,我是小象٩(๑ω๑)۶ 我的博客:Xiao Xiangζั͡ޓއއ 很高兴见到大家,希望能够和大家一起交流学习,共同进步。 这一节我们来学习指针的相关知识,学习内存和地址,指针变量和地址,包…

積分方程與簡單的泛函分析6.有連續對稱核的弗雷德霍姆積分算子的特徵值

1)def弗雷德霍姆算子的核函數定義 定义: 设 是定义在矩形区域 上的函数。 若满足以下条件,则称 为弗雷德霍姆算子的核函数: 实值性: 是实值函数,即对于任意的 ,。 这是因为在许多实际的物理和数学问题中,所涉及的量往往是实数值,例如在积分方程描述的物理模型中,…