张风捷特烈-CSDN博客

原创 Flutter七日总结

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

2018-12-23 15:11:00 952 1

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

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

2024-04-16 15:18:34 1019

原创 Flutter 组件集录 | MenuAnchor 与多级菜单

theme: cyanosis前言多级菜单在桌面端应用中非常常见，是很多应用程序中不可缺少的一环。它的价值在于：将大量的交互操作事件进行归类, 通过弹框的形式，以极小的空间占用，实现大量功能。那 Flutter 既然支持桌面端，那自然少不了对多级菜单的支持，菜单按钮的事件也往往伴随着快捷键的使用。本文就来介绍一下基于 MenuAnchor 组件，如何实现弹出多级菜...

2024-04-15 09:10:44 1046

原创 Flutter&Flame游戏实践#11 | 打砖块 - 功能背包

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

2024-04-12 09:42:37 780

原创 Flutter 像素编辑器#02 | 配置编辑

theme: cyanosis本系列，将通过 Flutter 实现一个全平台的像素编辑器应用。源码见开源项目【pix_editor】《Flutter 像素编辑器#01 | 像素网格》上一篇完成了 Flutter 像素编辑器的点击交互，绘制像素。本篇继续完善像素编辑器，划分布局区域，并运行修改项目和画笔的配置。如下所示，是 Flutter 像素编辑器的第二版：jvide...

2024-04-11 09:14:35 990

原创 Flutter 像素编辑器#01 | 像素网格

theme: cyanosis本系列，将通过 Flutter 实现一个全平台的像素编辑器应用。源码见开源项目【pix_editor】本篇将完成如下功能:[1]. 展示方形网格。[2]. 通过网格的坐标信息，为像素单元格着色。[3]. 通过手势交互，在网格中编辑像素点。大家可以在 [码上掘金] 上体验，由 Flutter 构建的 web 版：jcode1...

2024-04-10 09:32:15 990

原创 Flutter&Flame游戏实践#10 | 打砖块 - 金币与商店

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

2024-04-07 08:42:55 703

原创 Flutter & GLSL#9 | 函数曲线

theme: cyanosis张风捷特烈 Flutter & GLSL 系列文章：《Flutter & GLSL#1 | Shader 让绘制无限强大》《Flutter & GLSL#2 | 从坐标到颜色》《Flutter & GLSL#3 | 变量传参》《Flutter & GLSL#4 | 从条纹到马赛克》《Flutter &am...

2024-03-27 10:12:21 388

原创 Flutter 知识集锦 | extension 拓展类方法

theme: cyanosisDart 的拓展类方法已经支持很久了，之前忘了写篇文章介绍一下。最近写了几个拓展方法，借此机会，好好介绍一下 extension 关键字对类的拓展。1. 从密文的字符串开始说起比如现在有个需求: 将一个长度大于 4 的字符串，仅保留首尾两个字符，进行密文展示。比如 1981462002 -> 19******02 。很...

2024-03-20 12:13:51 378

原创 Flutter & GLSL#8 | 乘法与矩形

theme: cyanosis张风捷特烈 Flutter & GLSL 系列文章：《Flutter & GLSL#1 | Shader 让绘制无限强大》《Flutter & GLSL#2 | 从坐标到颜色》《Flutter & GLSL#3 | 变量传参》《Flutter & GLSL#4 | 从条纹到马赛克》《Flutter &am...

2024-03-18 08:58:37 219

原创 Flutter 组件集录 | SharedAppData 应用数据共享

theme: cyanosis上一篇《Flutter 组件集录 | InheritedModel 共享模型》介绍了 InheritedModel 通过定义 Aspect(方面) 来更精细地控制依赖更新的粒度。本文看一下基于 InheritedModel 实现的 SharedAppData 组件，如何实现应用级数据的共享。本组件案例已收录到 FlutterUnit：源码可详...

2024-03-11 09:09:26 343

原创 Flutter 组件集录 | InheritedModel 共享模型

theme: cyanosis上一篇《Flutter 组件集录 | InheritedWidget 共享数据》介绍了 InheritedWidget 对跨节点共享数据的价值。本篇看一下 Flutter 源码中基于 InheritedWidget 实现的 InheritedModel 组件。它通过定义 Aspect(方面) 来更精细地控制依赖更新的粒度。本组件案例已收录到...

2024-03-08 08:40:15 355

原创 Flutter 组件集录 | InheritedWidget 共享数据

theme: cyanosis1. 数据的跨节点共享的痛点在 Flutter 应用开发中，数据的跨节点共享是一个非常重要的事。下面通过一个例子说明一下：案例已收录在 FlutterUnit 中: 【InheritedWidget/node2_use.dart】A 组件状态类中有 color 和 counter 两个数据。(红框整体) B 是 A 的下层组件节点，...

2024-03-07 09:50:04 394

原创 Flutter&Flame 游戏开发 - 零 | 文章总集

theme: cyanosis 注：本文会随着教程博客的发布而持续更新。系列文章发布于掘金社区，可能会更新、修正，一切以掘金文章版本为准。 Flutter&Flame 游戏开发系列前言:该系列是 [张风捷特烈] 的 Flame 游戏开发教程。Flutter 作为全平台的原生级渲染框架。官方对休闲游戏的宣传越来越多，以 Flame 游戏引擎...

2024-03-04 09:12:38 367

原创 Flutter & GLSL - 柒 | 减法与线

theme: cyanosisFlutter & GLSL 系列文章：《Flutter & GLSL - 壹 | Shader 让绘制无限强大》《Flutter & GLSL - 贰 | 从坐标到颜色》《Flutter & GLSL - 叁 | 变量传参》《Flutter & GLSL - 肆 | 从条纹到马赛克》《Flutter &a...

2024-02-25 12:31:56 291

原创 Coze 扣子 | AI 养育计划 - "Flutter 大师"

theme: cyanosis扣子(coze.cn)是一款用来开发新一代 AI Chat Bot 的应用编辑平台。其中可以构建自己的知识库以及作为资源，这样的话，让 AI Bot 拥有我所有文章的 "智慧"，岂不是一位 Flutter 大师嘛。毕竟连我自己可能都记不清，很久以前文章里的知识细节，让用户和这种 "知识怪物" 交流，肯定能有意料之外的能力。另外有一点很重要，让读者读...

2024-02-24 09:50:26 273

原创 Flutter & GLSL - 陆 | 平滑过渡 smoothstep

theme: cyanosisFlutter & GLSL 系列文章：《Flutter & GLSL - 壹 | Shader 让绘制无限强大》《Flutter & GLSL - 贰 | 从坐标到颜色》《Flutter & GLSL - 叁 | 变量传参》《Flutter & GLSL - 肆 | 从条纹到马赛克》《Flutter &a...

2024-02-23 17:18:17 213

原创 FlutterUnit 3.0 全面升级 - 国际化、导航2.0、项目结构

theme: cyanosisFlutterUnit 是张风捷特烈的一个开源的 Flutter 全平台项目，支持 Android、iOS、Windows、MacOS、Linux、Web 六大主流平台。项目通过交互应用的形式，整理收录 Flutter 内置组件、实用有趣的知识集锦、辅助工具等要点，辅助 Flutter 开发者更快捷、优化地体验 Flutter 开发。春节期间，优化了一下...

2024-02-22 11:44:51 305

原创 Flutter & GLSL - 伍 | 图形区域控制

theme: cyanosisFlutter & GLSL 系列文章：《Flutter & GLSL - 壹 | Shader 让绘制无限强大》《Flutter & GLSL - 贰 | 从坐标到颜色》《Flutter & GLSL - 叁 | 变量传参》《Flutter & GLSL - 肆 | 从条纹到马赛克》《Flutter &a...

2024-02-21 09:01:14 744

原创 Flutter & GLSL - 肆 | 从条纹到马赛克

theme: cyanosisFlutter & GLSL 系列文章：《Flutter & GLSL - 壹 | Shader 让绘制无限强大》《Flutter & GLSL - 贰 | 从坐标到颜色》《Flutter & GLSL - 叁 | 变量传参》《Flutter & GLSL - 肆 | 从条纹到马赛克》案例代码开源地址 ...

2024-02-19 08:51:09 435

原创 Flutter & GLSL - 叁 | 变量传参

theme: cyanosisFlutter & GLSL 系列文章：《Flutter & GLSL - 壹 | Shader 让绘制无限强大》《Flutter & GLSL - 贰 | 从坐标到颜色》《Flutter & GLSL - 叁 | 变量传参》1. 从尺寸入参开始说起上一篇介绍了，在着色器中坐标和颜色的关系，将坐标归 ...

2024-02-14 13:25:23 308

原创 Flutter & GLSL - 贰 | 从坐标到颜色

theme: cyanosis上一篇《 Flutter 绘制集录 | Shader 让绘制无限强大 - 壹》介绍了 Flutter 本身支持 GLSL 语言进行 Shader 着色器的编写。这给 Flutter 的绘制能力增加了无限的可能。GLSL 着色器代码是一个比较独立的知识体系，接下来的几篇文章将会基于实际使用向大家进行介绍。1. 坐标与颜色我们都知道屏幕上的...

2024-02-06 16:26:11 251

原创 Flutter 绘制集录 | Shader 让绘制无限强大 - 壹

theme: cyanosis在之前研究 opengl 时，知道 Shader 的强大，我们可以通过着色器完成很多特效。之前在 Android 中写过《 [ - OpenGLES3.0 - ] 第三集主线 - shader着色器与图片特效》一文，其中详细介绍了 OpenGLEs 的着色器。而 Flutter 本身是支持 glsl 着色器的，也就是说，你可以在全平台使用着...

2024-01-26 09:23:56 1000

原创 Flutter 组件集录 | 下拉菜单 DropdownMenu 组件

theme: cyanosis1. 前言Flutter 框架中新增了 DropdownMenu 下拉按钮，可以让我们更方便地实现下拉选择的交互。本文案例源码可以详见【FlutterUnit 的 DropdownMenu】2. DropdownMenu 基础使用首先通过一个最简单的案例体验一下 DropdownMenu 的使用，如下所示：- 点击使会下拉展示菜...

2024-01-18 15:20:52 1645

原创 toly 命令行工具 | Flutter 图标字体代码生成器

theme: cyanosis上一篇《Flutter 知识集锦 | Dart 开发命令行工具》介绍了，如何通过 Dart 开发一个命令行脚本工具。本篇将结合一个具体的场景，介绍一下它的使用。toly 命令行工具目前已经开源并上传到 pub : github 地址: https://github.com/toly1994328/toly\ pub 地址: https://pu...

2024-01-15 09:07:04 910

原创 Flutter 知识集锦 | Dart 开发命令行工具

theme: cyanosis在开始本篇之前，请确保命令行中可以支持 dart 命令，如果没有请下载 Dart SDK 或者 Flutter SDK。我们的目的是通过 dart 语言编写可支持程序，并在命令行中访问：1. 创建一个 Dart 项目Dart 之于 Flutter 相当于 Java 之于 Android。 Dart 作为一个编程语言其作用当然不仅限于...

2024-01-12 13:45:24 760

原创 Flutter 小册 | 导航路由已上架

theme: cyanosis继正则小册完成后，历时半年打磨，Flutter 实战系列小册再加一名成员：《Flutter 路由导航: 源码探索与实战》 https://juejin.cn/book/72551129903100068361. 目前 Flutter 小册一览[免费]《Flutter 入门教程》 Flutter 框架层基础: 售价 3.5...

2024-01-12 08:53:53 806

原创算法演绎 | 巧妙的 Completer 完成器

theme: cyanosis0. 缘起最近几个月接触了些算法题，然后想个有趣的点子: 是否可以用 Flutter 做一个交互应用，可视化地展示算法执行过程中的变量的信息。比如拿一个最简单的累加算法来说，启动算法之后，每次点击下一步，界面上会展示出该步对应的变量信息。就可以可视化地呈现出一个算法运算过程中变量的变化情况。dartint sum(int count) ...

2023-12-29 09:17:34 917

原创 Flutter 知识集锦 | Dart 枚举已支持属性成员

theme: cyanosis在 Flutter3.0 之后，Dart 版本到 2.17 。虽然知道 Dart 枚举已支持属性成员，但一直没有用过。最近刚好有个使用的小场景，就来介绍一下。将以如下的 PopupMenuButton 的按钮数据来介绍：本文视频版: jvideo也可以在 bilibili 观看： https://www.bilibili.com/vid...

2023-11-28 09:46:53 649

原创 Flutter 组件集录 | Badge 标记组件

theme: cyanosis一、Badge 组件的基本使用Badge 是一种 Material 风格的组件，可以在 child 组件的上层添加标记物。底层构建逻辑依赖 Stack 组件进行叠放，以及 Positioned 组件进行定位。该组件已收录入 FlutterUnit ，可以查看 Badge 的示例源码。| Badge | Badge || --- | --- || ...

2023-11-25 12:28:54 741

原创 Flutter 组件集录 | InheritedNotifier 内置状态管理组件

theme: cyanosis1. 前言在上一篇《Flutter 知识集锦 | 监听与通知 ChangeNotifier》中，我们介绍了 ChangeNotifier 对象通知监听者的能力。并通过一个简单的模拟下载进度案例，介绍了它的使用方式：| 案例演示 | 监听-通知关系 || --- | --- || | |上一节通过全局变量来维护 ProgressValue...

2023-10-30 18:47:56 264

原创 FlutterUnit 周边 | 收录排序算法可视化

theme: cyanosis1. FlutterUnit 更新：排序算法可视化排序算法可视化是用视图层表现出算法执行过程中排序的过程，感谢编程的平行世界在《十几种排序算法的可视化效果，快来看看！????》》一文中提供的算法支持。我进行了一些代码和交互上的优化，将其集成到了 FlutterUnit 中，大家可以在 release v2.9.3 下载全平台应用查看体验 ~掘...

2023-10-25 08:35:18 632 1

原创源码阅读小技巧 | AndroidStudio 类型篇

highlight: androidstudiotheme: cyanosis1. 前言鉴于很多朋友在阅读小册，对研究源码时 AndroidStudio 如何调出相关面板有所疑惑，这里就专门写篇文章来介绍一下 AndroidStudio 阅读源码的小技巧。阅读源码的小技巧不单单是看底层源码，应用层的源码也依然适用，比如你接手了一个项目，也需要去阅读源码。由于不同平台或者个人的快...

2023-10-17 10:34:47 269

原创 Flutter 知识集锦 | 监听与通知 ChangeNotifier

theme: cyanosis1. 数据的提供者与消费者今天想要和大家好好聊聊 ChangeNotifier 这个东西，从名字上来看它由 change(改变) 和 Notifier(通知器) 构成。打个比方：有三个铁粉跟我说: "你发新文章的时候跟我说一声"。之后我发布文章后，分享给了他们三个人。很明显，这是一个发布-订阅模式，其中：发布者是博主，...

2023-10-13 11:57:08 728

原创 Flutter 新手小册 | 邀你免费学习

theme: cyanosis一、本册的缘起这本小册并不在我的原定计划之中，而是掘金希望推出一批针对新手的免费入门教程。笔者受掘金之邀，为大家带来一份纯粹面向新手的 Flutter 入门教程。当然本人也非常愿意从最初的起点，带领更多人认识 Flutter、使用 Flutter 、深入 Flutter 、热爱 Flutter。课程地址: https://juejin.cn/...

2023-09-13 08:07:18 92

原创 Flutter 3.13 组件更新 | 欢迎 Slivers 体系 5 位新成员

theme: cyanosis1. 介绍一下 5 个新的 Sliver 组件在 Flutter 3.13 更新中，增加了 5 位新的 Sliver 相关组件，用于滑动视口中，完成特定功能。这篇文章将介绍一下它们的作用和使用场景。| 组件名 | 中文名 | 介绍| --- | --- | --- || SliverMainAxisGroup |主轴分组滑片 | 可以容纳多个 Sl...

2023-08-18 09:31:50 648

原创师于源码 | Flutter 区域视口双向滑动

theme: cyanosis1. 缘起注: 本文有 Blibli 视频版，食用效果更加：https://www.bilibili.com/video/BV11p4y137Cy/在桌面端中，有时候需要在宽度区域过窄时，同时支持水平和竖直双向滑动。比如 AndroidStudio 的文件树和编辑器区域，当宽度较窄时，水平方向通过拖拽底部滚动条来滚动视口。在之前一直想...

2023-08-08 08:43:06 150

原创 Flutter 调试工具篇 | 壹 - 使用 Flutter Inspector 分析界面

theme: cyanosis1. 前言很多朋友可能在布局过程中、或者组件使用过程中，会遇到诸如颜色、尺寸、约束、定位等问题，可能会让你抓耳挠腮。俗话说，磨刀不误砍柴工，会使用工具是非常重要的，其实 Flutter 提供了强大的调试工具，可以辅助我们去查看界面布局中的一切细节。基于这些细节，可以很轻松地去解决布局相关的疑难杂症。也能让我们对界面的布局有更深刻的认知，这就是： F...

2023-07-28 08:37:12 1772

原创 FlutterUnit 周边 | 深入分析 iOS 手势回退问题

theme: cyanosis1. 问题的出现由于之前一直在 Android 机子上测试，没在 iOS 上跑过。最近 FlutterUnit 发布了 iOS 版本，收到了最多的反馈就是：返回滑动失效。起初我以为只是 WillPopScope 的锅，但我发现，很多普通的界面在跳转后，iOS 也无法返回滑动。然后觉得很蹊跷，事出反常必有妖，且来一探究竟。|Android 界面 | ...

2023-07-10 08:26:57 1063

原创 FlutterUnit 已上架 iOS，暗色模式全面支持

theme: cyanosis一、FlutterUnit 的全平台支持FlutterUnit 是我的一个开源项目，基于 Flutter 构建的一个全平台应用程序。现在很荣幸地宣布: FlutterUnit 已经上架 iOS 的 App Store ，自此主流的几大平台均已提供体验。项目地址: https://github.com/toly1994328/FlutterUn...

2023-06-25 09:25:52 1177

空空如也

空空如也