Lemo_wd - 博客园

flutter 效果实现 —— 全局点击空白处隐藏键盘

摘要：为什么要实现点击空白处隐藏键盘？因为这是 iOS 平台的默认行为，Android 平台由于其弹出的键盘右上角默认带有关闭键盘的按钮，所以点击空白处不会隐藏键盘。单个页面，可以这样做： class DismissKeyboardPage extends StatelessWidget { final 阅读全文

posted @ 2022-08-21 14:10 Lemo_wd 阅读(673) 评论(0) 推荐(0)

flutter 效果实现 —— sliver 固定

摘要：效果：说明：绿色块在向上滑动，距离顶部 103 的高度（即 AppBar 下面）时固定注：示例4 有官方组件 PinnedHeaderSliver（ flutter 3.4）示例 1：解决问题的关键是修正 paintOffset，以使最终的 offset 在 pinned 位置固定不变。缺点阅读全文

posted @ 2022-08-19 18:08 Lemo_wd 阅读(1399) 评论(0) 推荐(0)

flutter 杂项 —— Stateful 与 Stateless 的更新

摘要：一、使用 StatefulBuilder 单独更新某个组件的状态示例： await showDialog<void>( context: context, builder: (BuildContext context) { int? selectedRadio = 0; return AlertD 阅读全文

posted @ 2022-08-17 21:54 Lemo_wd 阅读(395) 评论(0) 推荐(0)

flutter —— 布局原理与约束（Sliver 布局）

摘要：布局模型 RenderBox 布局，移步 flutter —— 布局原理与约束 Sliver 的布局流程如下： Viewport 将当前布局和配置信息通过 SliverConstraints 传递给 Sliver。 Sliver 确定自身的位置、绘制等信息，保存在 geometry 中（一个 Sli 阅读全文

posted @ 2022-08-16 21:38 Lemo_wd 阅读(1491) 评论(0) 推荐(1)

flutter 技术选型 —— 视频播放器插件

摘要： chewie 依赖：video_player + chewie 缺点：ui 简陋 class VideoPlayerScreen extends StatefulWidget { const VideoPlayerScreen({Key? key}) : super(key: key); @over 阅读全文

posted @ 2022-08-16 21:17 Lemo_wd 阅读(1595) 评论(0) 推荐(0)

flutter 基础 —— 缓存页面与滚动位置等信息

摘要：一、缓存页面比如 Tab 切换，旧的 Tab 可能被销毁，我们需要做缓存。解决方法：如果是 PageView 可以更改 allowImplicitScrolling 值为 true，会缓存前后各一页。其它组件，可以实现 AutomaticKeepAliveClientMixin 接口。注：T 阅读全文

posted @ 2022-08-16 14:55 Lemo_wd 阅读(816) 评论(0) 推荐(0)

flutter 效果实现 —— NestedScrollView 嵌套滚动（多固定头）

摘要：效果有点类似 flexibleSpace，但是 flexibleSpace 的 expandedHeight 得预留计算出来。这里的头图的大小可以自适应，不用显式设置 expandedHeight。注：最新版本可以使用 SliverMainAxisGroup 实现相关需求（存疑？）代码注：请阅读全文

posted @ 2022-08-15 22:39 Lemo_wd 阅读(4749) 评论(0) 推荐(0)

flutter 常见组件的特殊用法 —— SliverAppBar

摘要： SliverAppBar 的滚动布局特殊属性说明 primary: true 不同于 AppBar 通常有 Scaffold 包裹，其最大高度由父类约束。SliverAppBar 完全由自身决定。当 primary 等于 true 时，其 topPadding 等于状态栏高度；若为 false，阅读全文

posted @ 2022-08-14 13:56 Lemo_wd 阅读(4655) 评论(0) 推荐(0)

flutter 常见组件的特殊用法 —— AppBar

摘要： AppBar 的高度与 PreferredSizeWidget 通常可以观察到 Scaffold.appBar 与 AppBar.bottom 属性，要求其值必须是 PreferredSizeWidget（典型的是 AppBar 与 TabBar 组件）。 abstract class Prefer 阅读全文

posted @ 2022-08-13 03:38 Lemo_wd 阅读(1408) 评论(0) 推荐(0)

flutter 效果实现 —— 无AppBar下列表滚动时状态栏透明度变化

摘要：效果此效果参考自 twitter 与 gmail 实现原理通过 Stack 组件，在最上层页面的状态栏位置用一个白色的容器占位，在列表滚动时，根据监听到的滚动位置动态调整其透明度。 PS：也可以借助 AppBar 实现，只要设置 Scaffold.extendBodyBehindAppBar 等阅读全文

posted @ 2022-08-13 02:28 Lemo_wd 阅读(444) 评论(0) 推荐(0)