文章目录Infinite scrolling -- 无限滚动Viewport-aware layout -- 视口感知(Viewport-aware) layoutBuilding widgets on demand --按需build widget 译者额外添加flutter的渲染流程图,有助于理解本文: 图一、 图二、Infinite scrolling – 无限滚动Infinite scr
Route所谓路由管理,就是管理页面之间如何跳转,也被称为导航管理。这和原生开发类似,无论是Android还是iOS,导航管理都是通过维护一个路由栈来实现的,路由入栈(push)操作对应打开一个新页面,路由出栈(pop)操作对应页面关闭操作。在Flutter开发中,实现页面跳转需要同时使用Route 和 Navigator。 - Route是一个应用程序抽象的屏幕或页面; - Nav
ScrollController构造方法ScrollController({ double initialScrollOffset = 0.0, //初始化滑动距离 this.keepScrollOffset = true,//是否保存滑动距离 this.debugLabel, }) : assert(initialScrollOffset != null),
有以下几种效果1、tabBar透明度随偏移0-1渐变过度2、app上下滚动触发tabBar同步滚动3、tabBar切换触发app上下同步滚动 1、计算每个区块的高度用keyList保存声明的key,用heightList保存每个key对应的组件高度// key列表 List<GlobalKey> keyList = [ GlobalKey(), GlobalKey(), G
转载 2024-04-11 11:55:14
316阅读
在开发flutter悬停头部中,发现一个问题。我们通常使用SliverAppBar(),去实现悬停的功能,在使用appbar的时候满足不了我们的需求,就需要自定义,如下:在title中写了一个搜索框的功能,但是我发现在上滑隐藏的时候,icon有渐变效果,包括普通的text都有渐变的效果,像我写的TextField则没有这种效果。也就是浅入浅出的效果。如图:return NestedScrollVi
转载 2024-07-26 00:25:30
0阅读
列表是移动端经常使用的一种视图展示方式,在Flutter中提供了ListView和GridView。为了可能展示出更好的效果,我这里提供了一段Json数据,所以我们可以先学习一下Json解析。一. JSON读取和解析在开发中,我们经常会使用本地JSON或者从服务器请求数据后回去到JSON,拿到JSON后通常会将JSON转成Model对象来进行后续的操作,因为这样操作更加的方便,也更加的安全。所以学
1.ScrollControllerScrollController({ double initialScrollOffset = 0.0, //初始滚动位置 this.keepScrollOffset = true,//是否保存滚动位置 // 如果ScrollController.keepScrollOffset为false,则滚动位置将不会被存储,Scrollable Wid
导读:随着技术的发展,很多网页开发技术都带有动画效果,比如淡入淡出、渐变、变大变小,等等。Flutter中的动画效果可以用酷炫来形容,这也是Flutter的一大特色。现代的应用程序不仅仅需要程序稳定、好用,还需要好看,体验好。那么动画效果是必不可少的。 01 动画概念 动画顾名思义,就是动起来的画面。如果一直持续的动再加上音频那就是我们平时看的电影了。那么画面为什么会动起来了呢?在回答这个问题之前
Flutter 请求网络的三种方式flutter 请求网络的方式有三种,分别是 Dart 原生的网络请求 HttpClient、第三方网络请求 http以及 Flutter 中的 Dio。我们可以比较一下这三种网络请求方式,然后封装为我们方便请求网络的工具类。Dart 原生的网络请求 HttpClient实现 Dart 获取网络数据的请求,一般我们需要以下几个步骤:導入import 'dart:c
转载 7月前
30阅读
ListView创建方式:直接使用默认构造函数创建:适合数据量较小的列表,一次性创建所有子控件。Widget build(BuildContext context) {  return ListView(     children: List.generate(100, (index) {      return ListTile(         leading: Icon(Icons.peop
转载 2021-01-20 15:15:41
1384阅读
2评论
文章目录监听App的生命周期监听页面的生命周期 监听App的生命周期flutter是通过WidgetsBindingObserver实现监听的,同时还可以监测应用的其他状态。 要注意的是,极端情况下可能收不到监听。比如:如果用户从设备中取出电池,在应用程序和操作系统的其他部分突然终止之前,不会发送任何通知具体用法,上代码:class _MyAppState extends State with
转载 2024-06-28 06:53:35
91阅读
滚动组件简介当组件内容超过当前显示视口(ViewPort)时,如果没有特殊处理,Flutter则会提示Overflow错误。为此,Flutter提供了多种可滚动组件(Scrollable Widget)用于显示列表和长布局。我们先介绍一下常用的可滚动组件(如ListView、GridView等),然后介绍一下ScrollController。可滚动组件都直接或间接包含一个Scrollable组件
转载 2024-04-11 20:02:54
324阅读
移动端数据量比较大时,我们都是通过列表来进行展示的,比如商品数据、聊天列表、通信录、朋友圈等。 在Android中,我们可以使用ListView或RecyclerView来实现,在iOS中,我们可以通过UITableView来实现。 在Flutter中,我们也有对应的列表Widget,就是ListView。一、ListView1.1、ListView的基本使用ListView可以沿一个方向(垂直或
转载 2024-02-29 09:50:46
1218阅读
Flutter监听路由返回前言我们通常有这样一个需求:点击修改用户信息需要跳转页面,修改完成以后返回之前的页面我们需要重新获取新的数据刷新修改后的数据。于是就找方法去实现,目前我用过的就是以下三种方法。Navigator.of(context).pushNamed().then()优点可以在返回页面的时候在pop中传入参数Navigator.pop(context, '数据传参'),.then(v
转载 2024-04-24 18:01:45
227阅读
准备工作1、下载flutter sdk 2、安装xcode、安装Android Studio3、安装 Homebrew ,安装fvm,    安装adb配置1、环境变量配置打开终端查看 ls -a1 打开. open .bash_profile 插入环境变量 保存 source .bash_profile如果文件不存在,需要vim .bash_profile
转载 2023-10-24 13:48:02
342阅读
SingleChildScrollViewSingleChildScrollView类似于Android中的ScrollView,它只能接收一个子组件。定义如下:const SingleChildScrollView({ Key key, this.scrollDirection = Axis.vertical, // 是否按照阅读方向相反的方向滑动,如:scrollDir
转载 2024-07-04 17:45:10
221阅读
注:以下所有例子均 只 在 iOS 的微信中测试过,但对于饿了么APP的内置浏览器同样适用(两者使用相同内核)引题工作中常常有需要显示大量信息的情况,列表超出一屏就涉及到滚动的问题。例如- var n = 1 ul while n <= 100 li= n++在 iOS 中用微信打开,滚动非常顺滑,so far so good!但某天产品需求有变,要求加一
scrollable 是一个 widget,提供滚动的功能。虽然很少会直接使用 scrollable,但是掌握 scrollable, 对掌握使用它的 ListView 等组件会有极大的帮助。
原创 2023-04-07 10:16:01
1093阅读
夫君子之行,静以修身,俭以养德,非淡泊无以明志,非宁静无以致远。——诸葛亮安卓个大市场和苹果商店里面的应用,很多功能效果都有相似之处.应用没有创新可言了,都是在借鉴.例如:欢迎页倒计时、广告、首页顶部导航或者顶部导航、首页滚动banner等等.貌似这些功能的出现已经是理所当然了.最近产品经理需要我们实现一个顶部自动滚动的banner,每张banner内容都是圆角.如果用原生来做还是比较容易...
原创 2022-01-05 15:37:03
459阅读
# Flutter 开发 iOS 应用的入门指南 Flutter 是一个由 Google 开发的开源 UI 软件开发工具包,它使得开发者能够以单一的代码库为 Android 和 iOS 创建高性能的应用程序。在这篇文章中,我们将深入探讨如何使用 Flutter 创建 iOS 应用,并提供一些代码示例来帮助你入门。 ## 1.环境准备 首先,我们需要确保本地的开发环境是正确配置的。请遵循以下步
原创 8月前
30阅读
  • 1
  • 2
  • 3
  • 4
  • 5