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提示,如果保持原样显示必须 ...
随机推荐
- 用7天找到月薪9K的Linux运维工作,就靠这四点
作者:99527 来源:http://www.yunweipai.com/archives/20865.html 毕业后做了1年IDC运维,每天看看服务器状态,检查检查硬盘.内存什么的,工作没什么技术 ...
- Selenium(七)多窗口切换、等待方法、alert对话框处理
一.多窗口切换 1.打开百度首页 2.在百度中搜索博客园 3.从搜索结果中跳转到博客园 4.博客园首页和百度搜索页面切换 handle:句柄 二.等待方法 time.sleep(5) 先导入方法 参数 ...
- Hibernate初探之单表映射——创建持久化类
编写第一个Hibernate例子 第二步:创建持久化类(持久化类的设计原则要遵循javabeans的设计原则) javabeans的设计原则: 1.公有的类2.提供公有的不带参数的默认的构造方法3.属 ...
- linux实操_组管理
1.文件/目录的所有者 一般为文件的创建者,谁创建了该文件,就自然成为该文件的所有者. 查看文件的所有者: 指令:ls -ahl 修改文件所有者: 指令:chown 用户名 文件名 组的创建: 指令: ...
- contenteditable属性让div也可以当做输入框
你知道div也可以当做输入框么? H5的全局属性contenteditable,带有contenteditable属性的div而不是input或者textarea来作为输入框(div可以根据内容自动调 ...
- Collections(一)
方法注释 /** * Returns an immutable list containing only the specified object. * The returned list is se ...
- J-Link OB F103 固件提取及维修
焊接心得挺不错的,可以学习到了 事情起因 某日在调试stm32的时候,错将5v接入3.3v电源输入,开发板烧掉.而且因为jlink没拔掉,也一同阵亡了.光烧了个芯片把整个板换掉太亏,遂打算动手修复. ...
- The method setCharacterEncoding(String) is undefined for the type HttpServletResponse
今天将以前做的一个web项目从不笔记本上移到台式机上,import项目后出现“The method setCharacterEncoding(String) is undefined for the ...
- Spring Boot 如何部署到 Linux 中的服务
打包完成后的 Spring Boot 程序如何部署到 Linux 上的服务? 你可以参考官方的有关部署 Spring Boot 为 Linux 服务的文档. 文档链接如下: https://docs. ...
- 【概率论】4-4:距(Moments)
title: [概率论]4-4:距(Moments) categories: - Mathematic - Probability keywords: - Moments - Moments Gene ...