Flutter实战小案例

(实战)点不到的按钮

// 主要实现效果类
class _MyHomePageState extends State<MyHomePage> {// 1.定义要使用的变量double btnLeft = 0;double btnTop = 0;int timeDuration = 500;String textButton = "点我呀";// 2.获得当前设备屏幕尺⼨,需要import 'dart:ui'var s = window.physicalSize / window.devicePixelRatio;// 3.新建⼀个随机对象,import 'dart:math';var rng = new Random()// 4.初始化init变量的值  void initState() {randomPosition();super.initState();}// 5.随机变化left和top的值randomPosition() {setState(() {btnLeft = rng.nextDouble() * (s.width - 100);btnTop = rng.nextDouble() * (s.height - 40);});}// 6.widgets渲染Widget build(BuildContext context) {return Stack(children: [AnimatedPositioned(duration: Duration(milliseconds: timeDuration),left: btnLeft,top: btnTop,width: 100,height: 40,child: ElevatedButton(onPressed: randomPosition,child: Text(textButton),))],);}
}

(实战)点不到的按钮修改

  • 修改按钮的宽200和⾼80
  • 设置背景⾊ rgb 值为 136, 138, 226
  • 按钮文本颜⾊设置为黑⾊
  • 文本设置为:初次见面
class MyHomePage extends StatefulWidget {const MyHomePage({Key? key, required this.title}) : super(key: key);final String title;State<MyHomePage> createState() => _MyHomePageState();
}class _MyHomePageState extends State<MyHomePage> {double btnLeft = 0;double btnTop = 0;int timeDuration = 500;String textButton = "初次见面";var s = window.physicalSize / window.devicePixelRatio;var rng = Random();// 创建背景颜色对象var backColor = const BoxDecoration(color: Color.fromRGBO(136, 138, 226, 1));void initState() {randomPosition();super.initState();}randomPosition() {setState(() {btnLeft = Random().nextDouble() * (s.width - 100);btnTop = Random().nextDouble() * (s.height - 40);});}Widget build(BuildContext context) {return Container(decoration: backColor,child: Stack(children: [Positioned(left: btnLeft,top: btnTop,width: 200,height: 80,child: ElevatedButton(onPressed: randomPosition,child: Text(textButton,// 修改文本颜色style: const TextStyle(color: Colors.black,),),)),],),);}
}

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

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

相关文章

常用的设计模式有哪些

设计模式是软件工程中用来解决常见设计问题的一些通用解决方案。常见的设计模式可以分为三大类&#xff1a;创建型模式、结构型模式和行为型模式。以下是每类设计模式的具体介绍&#xff1a; 创建型模式 这些模式主要用于对象创建&#xff0c;避免程序中的硬编码&#xff0c;…

速部署 HBase 测试环境

快速部署 HBase 测试环境 第一步&#xff1a;下载软件&#xff0c;在HBase官网下载最新版&#xff0c; 找到 bin&#xff0c;点击下载&#xff0c;比如我这里下载的是 hbase-2.5.6-bin.tar.gz 第二步&#xff1a;解压软件 $ tar -zxvf hbase-2.5.6-bin.tar.gz $ cd hbase-2.…

Lora模型训练的参数-学习笔记

任何一个lora都会有三重属性&#xff0c;易调用性、泛化性和还原性&#xff0c;任何一个lora只能完美满足其中的两项&#xff1b; 易调用性&#xff1a;在已调用lora后&#xff0c;还需要多少提示词才能让该lora完全生效&#xff1b; 泛化性&#xff1a;能不能还原lora训练素…

杜甫很 忙

我 我希望大家别再乱搞了

Windows终端远程登陆Linux服务器(SSH+VScode)

W i n d o w s 终端远程登陆 L i n u x 服务器&#xff08; S S H V S c o d e &#xff09; \huge{Windows终端远程登陆Linux服务器&#xff08;SSHVScode&#xff09;} Windows终端远程登陆Linux服务器&#xff08;SSHVScode&#xff09; 文章目录 写在前面通过SSH远程连接L…

golang程序性能提升改进篇之文件的读写---第一篇

背景&#xff1a;接手的项目是golang开发的&#xff08;本人初次接触golang&#xff09;经常出现oom。这个程序是计算和io密集型&#xff0c;调用流量属于明显有波峰波谷&#xff0c;但是因为各种原因&#xff0c;当前无法快速通过serverless或者动态在高峰时段调整资源&#x…

JS之数组中的reduce方法

文章目录 基本语法&#xff1a;callbackFn 的参数:例子1. 数组求和2. 数组求积3. 扁平化数组4. 数组元素计数5. 使用对象解构和展开运算符合并数组中的对象6. 求最大值和最小值 函数组合异步操作中的 reduce总结 reduce 是 JavaScript 中 Array 对象的一个方法&#xff0c;非常…

MySQL InnoDB【事务模型】之【事务隔离级别】 全攻略

快速导航 事务隔离级别可重复读&#xff08;REPEATABLE READ&#xff09;读提交内容&#xff08;READ COMMITTED&#xff09;读未提交内容&#xff08;READ UNCOMMITTED&#xff09;可串行化&#xff08;SERIALIZABLE&#xff09; 事务隔离级别 事务隔离是数据库处理的基础之一…

「邀您参会」首个中国可观测日即将盛大开幕

在云计算领域不断探索与创新的背景下&#xff0c;亚马逊云科技与观测云今日宣布&#xff0c;将联合举办中国可观测日&#xff08;Observability Day&#xff09;活动&#xff0c;旨在深化双方合作&#xff0c;共同推动中国可观测性的发展。 中国站首站&#xff0c;选址上海&am…

软件测试——非功能测试

工作职责&#xff1a; 1.负责产品系统测试&#xff0c;包括功能测试、性能测试、稳定性测试、用户场景测试、可靠性测试等。 2.负责测试相关文档的编写&#xff0c;包括测试计划、测试用例、测试报告等。 3.负责自动化测试框架、用例的维护。 岗位要求&#xff1a; 1.熟练…

使用html2canvas实现图片或者dom元素的样式展示

html或者.vue.tsx模板 <div class"tan1" id"tan1"><div class"jiang" id"jiangImg1" style"margin: 1rem auto 0;width: 75%;height: 10rem;position: relative;background-color: transparent;"><img id&q…

Laravel数据库的魔法棒:深入探索数据库迁移(Migrations)

Laravel数据库的魔法棒&#xff1a;深入探索数据库迁移&#xff08;Migrations&#xff09; 在Laravel的世界中&#xff0c;数据库迁移&#xff08;Migrations&#xff09;是一种强大的工具&#xff0c;它允许开发者以版本控制的方式管理数据库结构的变化。通过迁移&#xff0…

中级java每日一道面试题-2024年7月17日

面试官: 操作字符串都有哪些类?它们之间有什么区别? 我回答: String 描述&#xff1a;String是最基本的字符串类&#xff0c;用于表示不可变的字符序列。一旦创建了一个String对象&#xff0c;其内容就不能被改变。特性&#xff1a; 不可变性&#xff08;Immutability&#…

【启明智显方案分享】工业级HMI芯片MODEL3\MODEL4应用于电梯系统多媒体

一、方案概述 本方案采用工业级HMI芯片MODEL3或MODEL4作为核心处理器&#xff0c;结合7寸以上高清显示屏&#xff0c;为电梯系统提供多媒体解决方案。该方案不仅能够显示日期、时间、楼层信息等基础信息&#xff0c;还能播放广告、通知、视频等多媒体内容&#xff0c;增强电梯…

HTTPS请求头缺少HttpOnly和Secure属性解决方案

问题描述&#xff1a; 建立Filter拦截器类 package com.ruoyi.framework.security.filter;import com.ruoyi.common.core.domain.model.LoginUser; import com.ruoyi.common.utils.SecurityUtils; import com.ruoyi.common.utils.StringUtils; import com.ruoyi.framework.…

友讯随身WiFi和格行随身WiFi真实测评!彩屏款随身WiFi谁更胜一筹?随身WiFi哪个最好用?随身WiFi哪个口碑最好?哪个性价比更高?

在众多随身WiFi品牌中&#xff0c;友讯&#xff08;D-Link&#xff09;与格行&#xff08;Gexing&#xff09;都是彩屏款随身WiFi因其相似的设计和各自独特的品牌背景&#xff0c;常常让消费者难以抉择。今天&#xff0c;我们就来一场真实测评&#xff0c;深入剖析这两款彩屏随…

求解答word图标变白

把WPS卸载了之后就变成白色了&#xff0c;然后在注册表中把word的地址改成office word的地址之后图标变成这样了&#xff0c;怎么办

Talk|清华大学袁天远:PreSight - 利用NeRF先验帮助自动驾驶场景在线感知

本期为TechBeat人工智能社区第605期线上Talk。 北京时间7月3日(周三)20:00&#xff0c;清华大学博士生—袁天远的Talk已经准时在TechBeat人工智能社区开播&#xff01; 他与大家分享的主题是: “PreSight - 利用NeRF先验帮助自动驾驶场景在线感知”&#xff0c;他向大家介绍了新…

【XSS】

文章目录 0x01 简介0x02 XSS Payload用法XSS攻击平台及调试JavaScript 0x03 XSS构造技巧XSS漏洞防御策略 跨站脚本攻击&#xff0c;Cross Site Script。&#xff08;重点在于脚本script&#xff09; 分类 反射型、存储型DOM型 漏洞原理&#xff1a;通过插入script篡改“HTML”…

Kotlin Flow:掌握基本,征服应用,避开开发陷阱!

文章目录 1. 前言2. Kotlin Flow基本概念2.1 什么是数据流&#xff1f;2.2 Kotlin Flow是什么&#xff1f;2.3 有了LiveData和协程&#xff0c;为啥还需要Kotlin Flow&#xff1f;2.4 相比RxJava&#xff0c;Kotlin Flow有什么优势? 3. 基本使用3.1 Flow的创建和消费3.2 操作符…