WJ的博客

Flutter学习笔记之-实战项目基于对Flutter的学习，编写了一个简单的Demo项目，包括Flutter大多数技术功能点。项目功能点APP基础框架搭建主要页面状态保活pageView、自定义CustomScrollView、瀑布流布局路由、命名路由以及参数传递、转场动画下拉刷新、上拉加载更多本地图片、网络图片、读取json文件、json转模型webView使用，安卓上面webView https和http混合模式使用国际化，根据系统语言切换APP语言暗黑模式，切换主题状态

Flutter学习笔记之-原生项目集成Flutter模块原生项目集成Flutter模块适合用于以下场景：1、重写整个项目存在很大成本的时候2、只想某一个功能模块采用Flutter试水项目的时候原生项目集成Flutter模块步骤创建Flutter模块项目1、创建Flutter模块项目flutter create --template module mudule_demo2、编写Flutter模块的代码iOS原生项目集成Flutter采用CocoaPods来管理Flutter依赖。

Flutter学习笔记之-原生插件的编写类似在React Native项目中一样，当Flutter提供功能或者已存在的插件不能满足项目需要的时候就需要我们自己编写原生代码的插件以供Dart代码使用。原生插件和Dart之间通信原理根据官方图片的介绍：Flutter中通过FlutterMethodChannel与原生代码之间进行通信，而在Android中则使用MethodChannel。原生插件的编写首先先创建自己的Flutter项目编写测试项目代码，根据官方文档的说明采用获取手机电量来说明

Flutter学习笔记之-国际化记录在Flutter中实现国际化的方式,默认组件都是以英文来显示的文字。系统组件国际化实现步骤在pubspec.yaml中引入配置dependencies: flutter_localizations: sdk: flutter在入口MaterialApp中添加配置class MyApp extends StatelessWidget { @override Widget build(BuildContext context) {

Flutter学习笔记之-状态管理在Flutter中管理状态类似于原生开发中数据的管理。一般分为单个widget的管理以及多个widget中的数据共享管理等。根据官方文档的说明，在Flutter中使用provider来管理应用中的状态是比较推荐的做法。provider的使用步骤引入provider库在pubspec.yaml文件中引入providerdependencies: flutter: sdk: flutter provider: ^4.3.1provid

Flutter学习笔记之-获取设备信息和局部页面适配获取设备信息获取屏幕的宽高以及状态栏// 在根节点的build方法中就可以获取final physicalWidth = window.physicalSize.width;final physicalHeight = window.physicalSize.height;final dpr = window.devicePixelRatio;final screenWidth = physicalWidth / dpr;final s

Flutter学习笔记之-触摸事件官方文档中介绍了Flutter中采用Listener和GestureDetector来对触摸事件的监听处理。Listener的基本使用Listener可以对child中的widget的触摸事件进行监听，包括手指按下、移动、抬起等。class DemoWidget extends StatelessWidget { @override Widget build(BuildContext context) { return Listener(

Flutter学习笔记之-基础动画的基本使用基础动画的概念和API认识1、Animation动画的抽象类，能够实现对动画状态的监听和动画的监听(addStatusListener和addListener)。2、AnimationController动画的管理类3、CurvedAnimation管理动画的运动曲线4、Tween自定义AnimationController中lowerBound和lowerBound值动画案例实现基础动画实现一个基本的动画（从小变大，再从大变小），并实现对动画

Flutter学习笔记之-路由和导航在iOS原生开发中页面的跳转是通过UINavigationController来实现的，而Flutter中页面的跳转是通过Navigator和Route来实现的。页面的基本跳转案例案例包括页面跳转到下一个页面，返回上一个页面。// 第一个页面，通过点击按钮跳转class DemoWidget extends StatelessWidget { @override Widget build(BuildContext context) { r

Flutter学习笔记之-圆形头像实现方式开发中如何实现类似圆形图片Container+BoxDecoration来实现圆角图像class DemoWidget extends StatelessWidget { @override Widget build(BuildContext context) { return Center( child: Container( width: 100, height: 100,

Flutter学习笔记之-滚动Widget的基础使用ListView通过官方文档可知ListView的创建方式有很多，可以根据实际情况选择使用方式1、默认构造函数2、ListView.builder方法，可以显示大量数据的ListView3、ListView.separated可以添加分割线4、ListView.custom自定义的方式1、默认构造函数的方式class DemoWidget extends StatelessWidget { @override Widget bu

Flutter学习笔记之-基础Widget的简单使用文本Text WidgetText分为文本和富文本展示普通文本class DemoWidget extends StatelessWidget { @override Widget build(BuildContext context) { return Text( 'Hello, ssssadfasdfdsfdsfasdfdfdasdfadsfadfadfdfdfdfdfdfdfdfdfdfdfafdss! Ho

Flutter学习笔记之-常用布局容器Widget的简单使用StatelessWidgetStatelessWidget是无状态的Widget，里面没有变化的状态。class StatelessWidgetDemo extends StatelessWidget { @override Widget build(BuildContext context) { // 返回自己需要创建的组件 }}StatefulWidgetStatefulWidget有状态的Widge

Flutter学习笔记之-Dart语言快速入门基于有其他开发语言的基础，快速了解Dart语言中的一些语法和区别于其他语言的特殊点变量1、变量不限定为单一类型可以指定为dynamic或者Object类型Object obj = "name";dynamic obj = "name"obj = 4;// 变量的定义var param = "张三"2、无论什么类型的变量未初始化的默认值为null3、final和constfinal只能赋值一次，在首次访问时才被初始化const是编

Flutter 学习笔记之-开发环境的搭建镜像配置到环境变量在~./zshrc 或者 ~./bash_profile文件中配置如下镜像信息# flutterexport PUB_HOSTED_URL=https://pub.flutter-io.cnexport FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn下载Flutter SDK并配置到环境变量中1、下载SDKMac版本的Flutter SDK下载地址2、解压下载