张风捷特烈-CSDN博客

原创 Flutter七日总结

多看星空方知何谓渺小，多看细胞方知何谓浩大，我是巨人,也是沙粒，崇高并谦卑着----张风捷特烈写这个系列主要是出于以下目的：1.给自己一个挑战，并附加时间限制2.一直想要表达一下：遇到新技术时的态度，借此分析一下我对于一件新事物认知的过程 3.Flutter对于Android开发者，确实需要去稍微了解一下 4.作为一个地道的javaer+Androider,希望可以为想入坑Flu...

2018-12-23 15:11:00 1016

原创 Flutter 百题斩#15 | 列出 SDK 所有 StatelesWidget 组件

文章摘要：本文介绍了一个从Flutter SDK中提取所有StatelessWidget派生类的实现方案。通过Dart命令行脚本，首先定位flutter/lib/src目录下的dart文件，然后利用Flutter官方的analyzer库解析代码。核心实现包括：文件遍历、AST语法树访问器设计（通过继承RecursiveAstVisitor识别StatelessWidget子类）、分析上下文构建等关键步骤。该方案不仅考察了对Flutter SDK结构的理解，还涉及文件操作和Dart代码解析能力，可作为题库应用

2025-07-16 09:52:15 623

原创 Flutter 知识集锦 | 如何得到图片主色

Flutter实现图片主题色提取功能，通过ColorScheme.fromImageProvider方法从图片生成配色方案。文章介绍了如何封装ImageSelector组件实现图片切换，并动态更新UI主题色。案例展示了一个右侧图片列表、左侧色彩面板的交互界面，点击图片即可提取主色并应用主题。这种图片驱动配色的方式适用于主题换肤等场景，提升了UI设计的灵活性和视觉美感。文章还提供了完整代码实现和组件封装思路，为开发者构建智能配色系统提供了参考。

2025-07-14 09:23:10 731

原创 Flutter 百题斩#14 | 说说你对 ColorScheme 的了解

Flutter 的 ColorScheme 是 Material Design 3 的核心颜色系统，包含 46 种颜色角色，分为五大类：主色（品牌识别）、次色（辅助元素）、第三色（对比强调）、表面色（背景层次）和错误色（警告状态）。通过 ColorScheme.fromSeed 可基于种子色自动生成完整配色方案，确保应用视觉一致性和可访问性。这套系统取代了部分传统颜色，为组件提供统一的外观控制，并支持明暗主题适配。开发者可通过定义 ColorScheme 对象，快速建立规范化的应用主题体系。

2025-07-01 07:28:03 662

原创 Flutter 百题斩#12 | 说说 StatefulWidget 从诞生到状态类build 的流程

摘要：本文以Flutter中的StatefulWidget为核心，探讨其从组件创建到状态类build的完整流程。通过一个颜色切换的调试案例，详细分析了ColorAlphaView组件的实例化、State对象创建及build触发时机。关键流程包括：父组件构建时实例化子组件、StatefulElement创建状态对象、元素挂载触发首次build。文章梳理了StatefulWidget、State与StatefulElement的协作关系，并总结出从Element.performRebuild到State.bu

2025-06-27 09:43:44 24

原创 Flutter 百题斩#11 | 说说 StatelessWidget 从诞生到 build 的流程

到这里，从头到尾梳理一下，StatelessWidget 从诞生到 build 的完整流程。初次的构建流程发生在，父元素节点更新子节点时，会触发build方法得到组件，然后通过创建子元素节点，并触发子元素 mount 方法。在挂载期间触发首次的构建流程，最终触发对应组件的 build 回调。Element.performRebuild # 父元素节点更新子节点Element.build # 组件对象诞生Element.inflateWidget # 生成子元素节点。

2025-06-26 09:13:53 27

原创 Flutter 百题斩#10 | Dart 空安全六君子

本文介绍了Dart语言中与空安全相关的6个核心操作符：Type?用于声明可空类型，?.用于安全访问可能为null的成员，??提供默认值替换null，??=为null变量赋值，...?安全展开可能为null的集合，!则起到非空断言作用。这些符号共同构成了Dart的空安全机制，分别承担着类型声明、安全访问、默认值处理、空值赋值、集合展开和非空断言等功能，帮助开发者编写更加健壮的代码。文章通过示例代码和对比表格，详细解析了每个操作符的使用场景和注意事项，并附上一首打油诗帮助记忆。

2025-06-26 09:11:46 26

原创 Flutter 百题斩#9 | Dart 四种点符号

本文介绍了Dart语言中四种与点符号相关的操作符： .（成员访问符）：用于访问对象的属性和方法 ..（级联操作符）：允许对同一对象进行链式操作，避免重复书写对象名 ...（展开操作符）：将集合元素插入到另一个集合中 ...?（空安全展开符）：处理可能为null的集合展开文章通过具体代码示例说明了每个操作符的用法，最后用表格对比总结，并以打油诗形式帮助记忆。这些语法糖可以提升Dart代码的简洁性和可读性，是Flutter开发中的实用技巧。

2025-06-25 09:37:25 16

原创 Flutter 百题斩#8 | 说说 State 抽象类持有的成员变量

《每日一题》探讨Flutter中State类的核心成员：_widget、_element和_debugLifecycleState。_widget存储当前StatefulWidget配置，在initState前初始化，didUpdateWidget时更新；_element作为BuildContext绑定构建上下文，随元素实例化建立连接；_debugLifecycleState则仅调试模式下记录生命周期状态。State类通过简洁的成员引用，实现了状态管理与UI构建的分离，展现Flutter状态管理的核心机制。

2025-06-25 09:35:15 171

原创 Flutter 百题斩#13 | build 回调的 BuildContext 是什么

摘要：本文探讨了Flutter中BuildContext的本质与作用。作为构建视图的核心接口，BuildContext实际由Element实现，运行时表现为StatelessElement或StatefulElement。不同Widget（如StatelessWidget、StatefulWidget）通过createElement生成对应Element，解耦界面描述与执行逻辑。build方法中的BuildContext即组件对应的Element，支持主题获取、导航等操作。理解其机制对编写健壮组件至关重要

2025-06-24 12:24:00 145

原创 Flutter 百题斩#7 | 说说 State 状态类对象创建的时机

本文探讨了Flutter中State状态类对象的创建时机，通过《每日一题》系列中的ChangeableCounter案例展开分析。核心结论是：State对象在StatefulWidget的createState回调中被创建，该回调由Flutter框架层的StatefulElement在构建时触发。文章还介绍了通过断点调试追踪调用栈的方法，揭示了状态对象与元素的绑定关系。理解State的创建过程是掌握Flutter构建机制的重要一步，后续将继续探索Widget、Element和State的交互细节。

2025-06-20 12:34:29 17

原创 Flutter 百题斩#6 | StatelessWidget VS StatefulWidget

本文是一道关于Flutter中StatelessWidget和StatefulWidget的多选题解析。题目考察了两种Widget的构建逻辑、框架层Element关系、组件封装复用原理以及setState触发机制。正确答案为B和C，其中B项指出两者创建的Element都属于ComponentElement，C项强调组合复用的设计思想。A项错误在于StatefulWidget的构建由State类完成，D项错误在于setState并非每次都会触发UI重建。文章通过源码分析揭示了Flutter的底层机制，帮助开发

2025-06-19 05:48:32 28

原创 FlutterUnit & TolyUI | 布局游乐场

对于新手朋友，对有些较复杂的布局组件很难把握其特性。为此 FlutterUnit 设立了布局宝库模块，来帮助开发者更容易理解 Flutter 中的布局特性以及核心的布局组件。其中的 Playground 指的是可交互操作的组件展示面板，如下的 Flex Playground 将淋漓尽致地展示 Flex 组件布局特性。对于枚举类型的参数，通过 TolySelect 组件处理选择事件。操作的图标按钮使用 TolyAction 组件。布局宝库的侧栏导航，使用 TolyRailMenuTree 组件。

2025-06-19 05:40:13 1028 1

原创 Flutter 百题斩#5 | Widget 对象创建的时机

《每日一题》解析：Flutter Widget对象的创建时机本题考察Flutter中Widget对象创建时机的理解。正确答案为B：Widget对象在每次build构建过程中都会被重新创建。Flutter的Widget是描述UI的轻量级不可变对象，其特点是：每次build()都会重建Widget树不参与实际绘制（RenderObject负责）生命周期短暂，常被GC回收由开发者手动创建，非引擎自动生成其他选项错误原因： A项混淆构建与绘制阶段 C项误认为Widget长期存在 D项否认开发者创建权 F

2025-06-19 05:29:30 20

原创 Flutter 百题斩#4 | 说说组件 build 函数的作用

本文探讨了Flutter中build()函数的核心作用及其应用场景。作为组件UI构建的核心方法，build()负责返回Widget树以描述界面结构。文章通过StatelessWidget和StatefulWidget的实例对比，展示了build()如何实现UI封装与复用，并分析了函数可访问的三类数据：组件属性、BuildContext上下文以及StatefulWidget的状态变量。在StatefulWidget中，build()通过setState触发重建实现动态更新。合理控制build()调用频率对性能

2025-06-19 05:23:23 14

原创 Flutter 百题斩#3 | 说说 Widget 的派生体系

Flutter Widget派生体系解析：从UI构建到底层渲染的层次化设计 Flutter框架的Widget派生体系通过层次化设计构建了完整的UI开发范式。该体系主要包含四类核心组件：组合型Widget（Stateless/StatefulWidget）负责UI描述与状态管理，约占框架组件的80%；RenderObjectWidget作为底层"施工者"，直接控制布局渲染；ProxyWidget实现数据共享与功能注入；RootWidget作为应用根组件。文章通过类继承图展示了Widget的

2025-06-19 05:20:59 19

原创 Flutter 百题斩#2 | 如何理解 Widget 的不可变性

Flutter中Widget不可变性的深度解析 Widget的不可变性是Flutter架构的核心特性之一。它体现在Widget一旦创建后，其所有属性都不可修改（通过final关键字强制实现）。这种设计使Widget成为纯粹的UI描述单元，符合声明式编程范式。当需要界面变化时，Flutter不会修改现有Widget，而是重建新的Widget树，通过比较新旧Widget差异来高效更新UI。这种机制带来了诸多优势：确保状态与UI分离、简化构建逻辑、提升性能，并为热重载功能奠定基础。理解Widget的不可变性是掌握

2025-06-19 05:14:05 17

原创 Flutter 百题斩#1 | 说说你对声明式 UI 的理解

《匠心星问》是一款集题目浏览、发布、解答、做题于一体的题库应用，采用Flutter框架开发。本文探讨声明式UI的核心概念，将其与传统命令式UI对比，分析其优势（如状态驱动、高效维护）和挑战（如状态管理复杂度）。通过Flutter示例说明声明式UI的工作原理，并指出其在前端开发中的广泛应用。文章强调理解声明式UI对掌握Flutter框架的重要性，为开发者提供学习方向和解题思路。

2025-06-18 12:16:21 146

原创鸿蒙纪·梦始卷#01 - 环境搭建与初始项目

是计划打造的一套 HarmonyOS 开发系列教程合集。致力于创作优质的鸿蒙原生学习资源，帮助开发者进入纯血鸿蒙的开发之中。本系列的所有代码将开源在githubgitee本文是《鸿蒙纪·梦始卷》的第一章，将介绍鸿蒙应用开发环境的搭建，以及运行并简单介绍初始项目的代码。这样就相当于站在了鸿蒙开发的门槛之前。

2024-10-21 09:16:37 859

原创 Flutter&Flame游戏实践#17 | 二维无限标尺

theme: cyanosis 本文为稀土掘金技术社区首发签约文章，30天内禁止转载，30天后未获授权禁止转载，侵权必究！Flutter\&Flame 游戏开发系列前言:该系列是 [张风捷特烈] 的 Flame 游戏开发教程。Flutter 作为全平台的原生级渲染框架，兼具全端跨平台和高性能的特点。目前官方对休闲游戏的宣传越来越多，以 Flame 游...

2024-07-29 06:50:57 574

原创编程与数学 | 一维空间的中心缩放

theme: cyanosis0. 问题描述:最近在研究一个功能，期间演化出一些比较有趣的小知识。我把它们整理成独立的问题，来分享给大家。首先来解释一下，什么叫一维区域空间的中心缩放：比如，现在有一个刻度尺，视口区域是 [4,12] ，现在求：若以 8 为缩放中心，将尺子放大两倍。求前视口的刻度区域。缩放中心，就是在缩放变换过程中的不动点。我们可以把尺...

2024-07-26 08:01:22 388

原创 Flutter&Flame游戏实践#16 | 生命游戏 - 编辑与交互

theme: cyanosis 本文为稀土掘金技术社区首发签约文章，30天内禁止转载，30天后未获授权禁止转载，侵权必究！Flutter\&Flame 游戏开发系列前言:该系列是 [张风捷特烈] 的 Flame 游戏开发教程。Flutter 作为全平台的原生级渲染框架，兼具全端跨平台和高性能的特点。目前官方对休闲游戏的宣传越来越多，以 Flame 游...

2024-07-22 07:02:37 580 1

原创 Flutter 组件集录 | 后悔药 UndoHistory

theme: cyanosis在现实世界中，没有后悔药可以吃。但在对于计算机世界来说，撤销、恢复是非常常见的功能。小屁孩在键盘上啪啪一顿输出，把你正在写的重要文档搅得面目全非，Ctrl + Z 轻松救场。编程开发的过程中，我们在不断输入和试错，这颗后悔药是我们敢于前行的底气，大不了重新来过。1. 简单认识 UndoHistoryUndoHistory 是一个 Statefu...

2024-07-16 08:08:38 1282

原创「豆包Marscode体验官」 | 云端 IDE 启动 & Rust 体验

theme: cyanosis我正在参加「豆包MarsCode初体验」征文活动MarsCode 可以看作一个运行在服务端的远程 VSCode开发环境。对于我这种想要学习体验某些语言，但不想在电脑里装环境的人来说非常友好。本文就来介绍一下在 MarsCode里，我的体验 rust 开发体验。一、MarsCode 是什么它的本质是: 提供代码助手和云端 IDE 服务的 ...

2024-07-14 11:05:18 2425 1

原创 Flutter 匠心千刃 | SHA256 加密

theme: cyanosis0. 本文目标本文介绍一下如何在 Flutter 中进行 SHA256加密。并结合TolyUI 在匠心千刃中搭建 sha256加密的交互界面，本文目标如下所示：可以在输入框中输入字符串，会自动计算输入内容的sha256值：也可以选择文件，计算该文件的sha256值：1. SHA256能干什么每个人的指纹是独...

2024-07-12 07:24:03 1137

原创 Flutter&Flame游戏实践#15 | 生命游戏 - 演绎启动

theme: cyanosis 本文为稀土掘金技术社区首发签约文章，30天内禁止转载，30天后未获授权禁止转载，侵权必究！Flutter\&Flame 游戏开发系列前言:该系列是 [张风捷特烈] 的 Flame 游戏开发教程。Flutter 作为全平台的原生级渲染框架，兼具全端跨平台和高性能的特点。目前官方对休闲游戏的宣传越来越多，以 Flame 游...

2024-07-08 08:09:13 1144

原创 FlutterUnit & TolyUI | 布局游乐场

theme: cyanosisFlutterUnit 基于 TolyUI 大大简化了界面构建的代码复杂程度，因此之前想要实现的一些小功能，就可以轻松支持。布局游乐场是通过交互的方式来直观体验组件的布局特性，从而更易学和掌握。目前 FlutterUnit 已在知识集录模块新增了布局宝库，大家可以更新代码查看 ~1. 什么是布局游乐场对于新手朋友，对有些较复杂的布局组件...

2024-07-01 07:13:30 1262 2

原创 Flutter 像素编辑器#05 | 缩放与平移

theme: cyanosis本系列，将通过 Flutter 实现一个全平台的像素编辑器应用。源码见开源项目【pix_editor】。在前三篇中，我们已经完成了一个简易的图像编辑器，并且简单引入了图层的概念，支持切换图层显示不同的像素画面。《Flutter 像素编辑器#01 | 像素网格》《Flutter 像素编辑器#02 | 配置编辑》《Flutter 像素编辑器#03 | ...

2024-06-24 07:15:56 690

原创 Dart 知识集锦 | Base64 编解码

theme: cyanosis1. Dart 中的 Base64 编解码在编程的世界中，数据的种类可谓是缤纷多彩。但是他们有本质的共性: 都是二进制的数据。在数据传输过程中，字节数组有时并不是很方便，比如网络传输。 Base64 包括小写字母a-z、大写字母A-Z、数字0-9、符号"+"、"/"一共64个字符的字符集。它可以将字节数组进行编码进行传输。Dart 语言的 conve...

2024-06-14 08:11:19 1339

原创 Flutter TolyUI 框架#07 | 案例解析与管理

theme: cyanosis 本文为稀土掘金技术社区首发签约文章，30天内禁止转载，30天后未获授权禁止转载，侵权必究！《Flutter TolyUI 框架》系列前言:TolyUI 是张风捷特烈打造的 Fluter 全平台应用开发 UI 框架。具备全平台、组件化、源码开放、响应式四大特点。可以帮助开发者迅速构建具有响应式全平台应用软件：开源地址： ht...

2024-06-11 09:33:59 995

原创 Flutter 全平台 | 从 shared_preferences 聊聊六端插件

theme: cyanosis用过 Flutter 的小伙伴应该对 shared_preferences 并不陌生，它支持六大平台，用于存储键值对，并以 xml 文件的形式将数据进行持久化。这种功能的实现会依赖各个平台的能力，而且功能点并不复杂。所以它是一个非常好的六端插件研究对象。1. 项目结构进入 shared_preferences 插件源码中，可以看到它并非是一...

2024-06-05 07:36:45 928 2

原创 Flutter 像素编辑器#04 | 导入导出图像

theme: cyanosis1. 本文目的本系列，将通过 Flutter 实现一个全平台的像素编辑器应用。源码见开源项目【pix_editor】。在前三篇中，我们已经完成了一个简易的图像编辑器，并且简单引入了图层的概念，支持切换图层显示不同的像素画面。《Flutter 像素编辑器#01 | 像素网格》《Flutter 像素编辑器#02 | 配置编辑》《Flutter 像素...

2024-05-28 07:52:30 657

原创 Flutter TolyUI 框架#06 | 下拉菜单设计

theme: cyanosis 本文为稀土掘金技术社区首发签约文章，30天内禁止转载，30天后未获授权禁止转载，侵权必究！《Flutter TolyUI 框架》系列前言:TolyUI 是张风捷特烈打造的 Fluter 全平台应用开发 UI 框架。具备全平台、组件化、源码开放、响应式四大特点。可以帮助开发者迅速构建具有响应式全平台应用软件：开源地址： ht...

2024-05-24 09:29:48 505

原创 Dart 点将台 | 你真的明白参数传递吗？

theme: cyanosis参数传递，是编程开发中最最最常见的一种行为。我们将一个对象传入到函数中作为输入，参与函数逻辑运算，得到输出值。可能很多人被值传递、引用传递、指针传递这些弯弯绕绕的跟困住了。其实面向对象的高级语言中，没有所谓的指针，对象本身是值，也是一块内存区域的地址引用。在高级语言中，参数传递的是对象，也只能是对象，别无其他。level1: 为什么...

2024-05-23 12:49:03 444

原创 Flutter TolyUI 框架#05 | 树形菜单设计

theme: cyanosis 本文为稀土掘金技术社区首发签约文章，30天内禁止转载，30天后未获授权禁止转载，侵权必究！《Flutter TolyUI 框架》系列前言:TolyUI 是张风捷特烈打造的 Fluter 全平台应用开发 UI 框架。具备全平台、组件化、源码开放、响应式四大特点。可以帮助开发者迅速构建具有响应式全平台应用软件：开源地址： ht...

2024-05-22 08:43:58 650

原创 Flutter TolyUI 框架#04 | 侧栏菜单设计

theme: cyanosis 本文为稀土掘金技术社区首发签约文章，30天内禁止转载，30天后未获授权禁止转载，侵权必究！《Flutter TolyUI 框架》系列前言:TolyUI 是张风捷特烈打造的 Fluter 全平台应用开发 UI 框架。具备全平台、组件化、源码开放、响应式四大特点。可以帮助开发者迅速构建具有响应式全平台应用软件：开源地址： ht...

2024-05-15 09:13:55 553

原创 Flutter TolyUI 框架#03 | 全局消息通知

theme: cyanosis 本文为稀土掘金技术社区首发签约文章，30天内禁止转载，30天后未获授权禁止转载，侵权必究！《Flutter TolyUI 框架》系列前言:TolyUI 是张风捷特烈打造的 Fluter 全平台应用开发 UI 框架。具备全平台、组件化、源码开放、响应式四大特点。可以帮助开发者迅速构建具有响应式全平台应用软件：开源地址： ht...

2024-05-13 09:12:12 665

原创 Flutter 小册 | 状态管理已上架

theme: cyanosis继路由导航完成后，随着状态管理探索完毕，应用程序构建中的最后一块拼图已经到手。Flutter 实战系列小册再加一名成员：《Flutter 状态管理: 源码探索与实战》 https://s.juejin.cn/ds/iYwHaVxJ/1. 目前 Flutter 小册一览[免费]《Flutter 入门教程》 Flutter...

2024-04-26 08:33:42 358

原创 Coze 扣子 | 用插件打造 "匠心千刃" 工具

theme: cyanosis在《Coze 扣子 | AI 养育计划 - "Flutter 大师"》一文中，介绍了 Coze 中创建 AI Bot 的过程，并且基于知识库和数据库作为 AI Bot 的大脑，提供知识储备打造 Flutter 大师。AI Bot 的聊天产出内容相对随机，如何能让 AI Bot 准确地通过自然语言，来精确处理任务呢？本文就介绍一下，基于 ...

2024-04-24 09:49:20 1757 1

原创 Flutter 像素编辑器#03 | 像素图层

theme: cyanosis本系列，将通过 Flutter 实现一个全平台的像素编辑器应用。源码见开源项目【pix_editor】《Flutter 像素编辑器#01 | 像素网格》《Flutter 像素编辑器#02 | 配置编辑》《Flutter 像素编辑器#03 | 像素图层》上一篇我们实现了编辑配置，可以设置网格数、背景色、画笔颜色。本篇将引入图层的概念，支持新建...

2024-04-16 15:18:34 1233

空空如也

空空如也