Flutter 轻量级的ToolTip控件
轻提示的效果在应用中是少不了的,其实Flutter已经准备好了轻提示控件,这就是toolTip。
轻量级操作提示
其实Flutter中有很多提示控件,比如Dialog、Snackbar和BottomSheet这些操作都是比较重量级的,存在屏幕上的时间较长或者会直接打断用户的操作。
当然并不是说这些控件不好,根据需求的不同,要有多种选择,所以才会给大家讲一下轻量级操作提示Tooltip。
Tooltip是继承于StatefulWidget的一个Widget,它并不需要调出方法,当用户长按被Tooltip包裹的Widget时,会自动弹出相应的操作提示。
child: Tooltip( //轻量级提示
message: "Don't touch",
child: Image.asset('images/lake.jpg'),
),

完整代码如下:
import 'package:flutter/material.dart';
void main()=> runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title:'Flutter Demo',
theme:ThemeData.light(),
home: ToolTipDemo(),
);
}
}
class ToolTipDemo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title:Text('tool tips demo')),
body:Center(
child: Tooltip(
message: "Don't touch 不要碰 ",
child: Image.asset('images/lake.jpg'),
),
)
);
}
}
Flutter 轻量级的ToolTip控件的更多相关文章
- onmouseover 执行 ToolTip 控件
Tooltip控件是一个简单,但非常有用的控件.它能够为我们的软件提供非常漂亮的提示信息,提高软件的可用性,给用户比较好的体验.假设现在有两个按钮,一个用来预览吊线世系图,一个用来预览行转.为了保持按 ...
- Flutter样式和布局控件简析(二)
开始 继续接着分析Flutter相关的样式和布局控件,但是这次内容难度感觉比较高,怕有分析不到位的地方,所以这次仅仅当做一个参考,大家最好可以自己阅读一下代码,应该会有更深的体会. Sliver布局 ...
- Flutter Form表单控件超全总结
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 Form.FormField.TextFormField是 ...
- Flutter 日期时间DatePicker控件及国际化
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 DatePicker Flutter并没有DatePick ...
- Flutter 强大的MediaQuery控件
注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 MediaQuery 通常情况下,不会直接将MediaQu ...
- Flutter 分页功能表格控件
老孟导读:前2天有读者问到是否有带分页功能的表格控件,今天分页功能的表格控件详细解析来来. PaginatedDataTable PaginatedDataTable是一个带分页功能的DataTabl ...
- Slider.js轻量级图片播放控件
Slider.js基于HTML5和CSS3实现的Slideshow 1.Slider.js 是一个图片播放Slideshow引擎,采用jQuery.CSS3和HTML5 canvas技术实现. 2.可 ...
- 轻量级的惰性控件——ViewStub
在开发过程中,有时候,需要这样一种控件,正常情况下不可见,不占用任何布局空间,只在某种特定情况下显示,这种情况下,我们使用一个普通的View,利用设置setVisibility(View.GONE)自 ...
- 使用bootstrap tooltip控件动态修改提示内容
初始化控件之后即使修改了元素的title内容也不会更改提示信息,比如下面 $(element).attr('title','XXXXXX') 这样只会增加一个原生的title提示,如果保持原样显示必须 ...
随机推荐
- [转]python3 跨目录模块调用,你真的懂了吗?
小伙伴们,你们有遇到过调用自己写的模块(跨目录模块调用),提示你ImportError:No module named ...的情况,如果有,而且到现在还没有搞明白的,我想说,你今天看对文章了. 这篇 ...
- js 同步 异步 宏任务 微任务 文章分享
分享一篇 写的很好的 宏任务 微任务 同步异步的文章 文章原地址: https://juejin.im/post/59e85eebf265da430d571f89 这一次,彻底弄懂 JavaScri ...
- Python3基础学习-while循环实例- 猜数字游戏
需求: 猜数字游戏, 要求如下: 给个数字, 比如是66. 让用户一直猜,直到猜对退出. 中间输入q或Q也能退出 如果猜大了,提示用户猜小一点; 如果猜小了,提示用户猜大一点; likely = 66 ...
- let和const的区别
es6语法中新增了 let和const 不再只是有var 1. let的用法 let是用来声明变量的,它和var的用法差不多,但是let所声明的变量只在它的代码块内有效,像for循环里用let会更好点 ...
- ACM-ICPC 2018 沈阳赛区现场赛 K. Let the Flames Begin (约瑟夫环问题)
题目链接: 题意:有 n 个人围成一个圈,从 1 开始报到第 k 个人出环,问第 m 个出环的人是谁,n.m.k <= 1e18 且 min(m,k)<= 2e6. 题解:容易得出O(m) ...
- 普通java类获取spring容器bean的方法
很多时候,我们在普通的java类中需要获取spring的bean来做操作,比如,在线程中,我们需要操作数据库,直接通过spring的bean中构建的service就可以完成.无需自己写链接..有时候有 ...
- Appium自动化测试教程-自学网-monkey事件
操作事件简介 Monkey所执行的随机事件流中包含11大事件,分别是触摸事件.手势事件.二指缩放事件.轨迹事件.屏幕旋转事件.基本导航事件.主要导航事件.系统按键事件.启动Activity事件.键盘事 ...
- 路由器配置——基于链路的OSPF的MD5口令认证
一.实验目的:掌握基于链路的OSPFMD5口令认证 二.拓扑图: 三.具体步骤配置: (1)R1路由器的配置 Router>enable Router#configure terminal En ...
- 2D动画如何做出3D体积感
https://cowlevel.net/article/1959026 <AngerForce>幕后故事 这篇文章是个老坑,最近有时间开始写,也是对之前项目的一个总结和记录吧. 本篇文章 ...
- 2019PKUWC游记
有的时候,不是你不会 而是你,认为你不会 ——*Miracle* 本篇游记就简单写了 Day-inf 犹豫许久,还是选择了北大 不是因为喜欢——甚至恰好相反 而是,听说清华高手较多,约型单一, 于是我 ...