第四百四十七回

文章目录

  • 1. 概念介绍
  • 2. 思路与方法
    • 2.1 实现思路
    • 2.2 使用方法
  • 3. 内容总结

我们在上一章回中介绍了"如何在页面上显示蒙板层"相关的内容,本章回中将介绍overlay_tooltip这个三方包.闲话休提,让我们一起Talk Flutter吧。

在这里插入图片描述

1. 概念介绍

我们在本章回中介绍的overlay_tooltip包是一个三方包,它是尼日利亚的一个开发者开发的,主要用来实现实现首次使用App时的功能引导。这个功能引导就是在某
个功能上显示功能的介绍(包中叫OverlayTooltip),同时把功能区域高亮显示,其它区域(包中叫 Overlay)模糊显示,然后点击下一步时继续以相同的方式介绍
其它功能区域。我估计大家都用过该功能,通常在首次安装和使用App时会出现。本章回中将介绍如何使用overlay_tooltip包实现此功能。

2. 思路与方法

2.1 实现思路

包中提供了OverlayTooltip和OverlayTooltipScaffold两个组件,前者用来解释页面中某个功能的用法,后者用来管理页面中的OverlayTooltip。整体的实现
思路就是在页面中某个功能所在的位置插入一个OverlayTooltip,用来解释该功能的使用方法。因为我们会介绍多个功能的使用方法,所以在整个页面上使用包中的组
件(OverlayTooltipScaffold)来管理所有的OverlayTooltip。

2.2 使用方法

在上一小节中我们提到了包中的OverlayTooltip和OverlayTooltipScaffold这两个组件,接下来我们介绍一下它们的用法。
OverlayTooltip是组件的泛称,它对应包中的OverlayTooltipItem组件,该组件提供了相关的属性来控制自己,详细如下:

  • displayIndex属性:用来控制该组件的顺序,表示所有功能中的第n个功能;
  • tooltipVerticalPosition属性:用来控制组件的位置,比如位于功能的下方;
  • tooltip属性:用来显示功能的用法,它类似常用的Builder组件;
  • child属性:这个主要用来存放页面中的功能;
    总之,OverlayTooltip组件类似容器类组件,它会把页面中的某个功能当作容器中的内容,它会在内容上下左右四个方向上显示一个组件,这个组件可以自定义,它主
    要用来解释容器中功能的使用方法。
    OverlayTooltipScaffold组件,主要用来管理OverlayTooltipItem,该组件提供了相关的属性来控制自己,详细如下:
  • startWhen属性:用来启动功能演示,它是方法类型;
  • overlayColor属性:用来控制模糊显示时的颜色;
  • tooltipAnimationDuration属性:从当前toolTip跳转到下一个ToolTip的时间;
  • preferredOverlay属性:用来控制模糊层(Overlay),它是Widget类型;

用来响应点击事件,可以在点击事件中切换不同的ToolTip;

  • builder属性:主要用来存放页面组件,它的用法和Builde组件中同名属性用法相同;
    总之,OverlayTooltipScaffold组件类似容器类组件,它会把整个页面当作容器中的内容,这点从它的名字中也可以看出来,它主要用来管理页面中所有的
    OverlayTooltip,比如切换OverlayTooltip。

3. 内容总结

最后,我们对本章回的内容做一个全面的总结:

  • overlay_tooltip这个包主要用来实现首次使用引导功能;
  • 包中提供了OverlayTooltip组件用来对某个功能进行介绍;
  • 包中提供了OverlayTooltipScaffold组件用来管理包中所有的toolTip;
    看官们,与"overlay_tooltip简介"相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

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

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

相关文章

代码审计sql注入部分函数绕过方法

目录 1.宽字节注入 2.预编译模式下的sql注入 3无法预编译的 1.3.1. like关键字 1.3.2.不能加单引号 4.相关实战实战 4.1.某个业务网站具有sql注入 4.2.梦想cms代码审计 5.相关参考资料 1.宽字节注入 <?php $dbinit_db(); $db->query("set SET NAMESgbk);…

手机基带电路设计20问(1)

原文来自微信公众号&#xff1a;工程师看海&#xff0c;与我联系&#xff1a;chunhou0820 看海原创视频教程&#xff1a;《运放秘籍》 大家好&#xff0c;我是工程师看海&#xff0c;原创文章欢迎点赞分享&#xff01; 1 小电压和小电流供电是不是可以减小大部分功耗&#xff1…

【电路笔记】-逻辑与非门

逻辑与非门 文章目录 逻辑与非门1、概述2、晶体管与非门3、数字逻辑与非门4、通用与非门逻辑与非门是数字逻辑与门和非门串联的组合。 1、概述 NAND(非与)门的输出通常处于逻辑电平“1”,并且仅当其所有输入都处于逻辑电平“1”时才变为“低”至逻辑电平“0”。 逻辑与非门…

入门Arduino与Esp8266:一步步教你点亮LED灯

文章目录 一、前言二、下载与安装Arduino1. 通过输入网址&#xff1a;Arduino.cc进行下载2. 点击上面的SOFTWARE软件选项3. 选择右边的Windows版本进行下载4. Just Download 立即下载4. 正在下载&#xff0c;请稍等5. 下载完成6. 双击开始安装&#xff0c;单击我同意许可证协议…

二分查找 -- 力扣(LeetCode)第704题

题目 https://leetcode.cn/problems/binary-search/description/ 给定一个 n 个元素有序的&#xff08;升序&#xff09;整型数组 nums 和一个目标值 target &#xff0c;写一个函数搜索 nums 中的 target&#xff0c;如果目标值存在返回下标&#xff0c;否则返回 -1。 示例…

Ubuntu 20.04.06 PCL C++学习记录(十六)

[TOC]PCL中点云分割模块的学习 学习背景 参考书籍&#xff1a;《点云库PCL从入门到精通》以及官方代码PCL官方代码链接,&#xff0c;PCL版本为1.10.0&#xff0c;CMake版本为3.16 学习内容 用一组点云数据做简单的平面的分割 源代码及所用函数 源代码 #include<iostr…

IDEA中修改git的作者、邮箱名称

目录 一、查看当前git信息 1、查看git作者名称 如下图&#xff1a; 2、查看git邮箱信息 二、修改git信息 1、修改git作者名称 如下图&#xff1a; 2、修改git邮箱名称 一、查看当前git信息 1、查看git作者名称 在git控制台 或者 Terminal 输入 git config user.name …

如何高效学习Python编程语言

理解Python的应用场景 不同的编程语言有不同的发展历史和应用场景,了解Python主要应用在哪些领域对于学习它会有很大帮助。Python最初是一种通用脚本语言,主要用于系统级任务自动化。随着时间的推移,它逐步成为数据处理、科学计算、Web开发、自动化运维等众多领域的主要编程语…

【多线程】多线程下使用集合类

一.Java中线程安全的集合类 Java中提供了多种线程安全的集合类&#xff0c;它们可以在多线程环境下安全地被多个线程同时访问而无需外部同步。以下是一些常见的线程安全集合类&#xff1a; Vector: 类似于 ArrayList 的动态数组&#xff0c;但是所有方法都是同步的&#xff0…

lottery-攻防世界

题目 flag在这里要用钱买&#xff0c;这是个赌博网站。注册个账号&#xff0c;然后输入七位数字&#xff0c;中奖会得到相应奖励。 githacker获取网站源码 &#xff0c;但是找到了flag文件但是没用。 bp 抓包发现api.php&#xff0c;并且出现我们的输入数字。 根据题目给的附…

跨越网络边界:借助C++编写的下载器程序,轻松获取Amazon商品信息

背景介绍 在数字化时代&#xff0c;数据是新的石油。企业和开发者都在寻找高效的方法来收集和分析网络上的信息。亚马逊&#xff0c;作为全球最大的电子商务平台之一&#xff0c;拥有丰富的商品信息&#xff0c;这对于市场分析和竞争情报来说是一个宝贵的资源。 问题陈述 然…

Vue - 你知道Vue中computed和watch的区别吗

难度级别:中高级及以上 提问概率:70% 二者都是用来监听数据变化的,而且在日常工作中大部分时候都只是局限于简单实用,所以到了面试中很难全面说出二者的区别。接下来我们看一下,二者究竟有哪些区别呢? 先说computed,它的主要用途是监听…