
042Flutter
Flutter入门到进阶系列教程,
从基础的了解到最后项目,
希望能给你带来最节省效率的学习,
根据以往的博客经验更加注重贴图与代码部分的完整性。
并配备了免费的B站博客同步的教学视频
https://www.bilibili.com/video/BV1s5411J7vm/
致敬最爱学习的你
安果移不动
精通Android,Swift,Flutter,Python,Php,按键精灵,易语言。曾为华为录制精品课程,拥有资质:按键精灵顶级证书;
产品秀:https://www.anguomob.com
B站:https://space.bilibili.com/482453235
展开
-
Flutter 对齐没对齐。总感觉自己对不齐
点击这里 手机会出现辅助对齐图,可以根据辅助的样子看看对齐没得原创 2021-12-15 18:56:22 · 1755 阅读 · 0 评论 -
Flutter 查看当前页面甚至到每一个细节的weight
Some Times 我们想知道运行程序的页面是那个页面这有利于我们定位控件首先运行程序比如我们想定位IT技术556在代码里面的那个位置点击这里然后点击It技术556他会在侧边栏定位后。然后再在代码中定位。非常的智能感谢同事郁xx提供的教程如果不需要定位需要再次点击关闭...原创 2021-12-15 18:09:22 · 2318 阅读 · 0 评论 -
Flutter TextField 输入框失去焦点的时候抖动。
设置行高25/4即可 style: TextStyle( height: 25 / 18, )原创 2021-12-03 18:39:31 · 653 阅读 · 0 评论 -
Flutter TextField 多行文本下的居中对齐
两行的TextField 会让你的ui发狂 maxLines: 2,因为Flutter直接要了两行的控件的高度。非常的不人性化。需要TextStyle( filled: true,) maxLines: 2, minLines: 1,感谢同事兰某某的指点原创 2021-11-19 21:03:36 · 1649 阅读 · 0 评论 -
Flutter TextField设置行间距
ui期望行间距 使用蓝湖 web 看到的是24px 字体大小是15px那么行间距的设置公式来了给TextFiled设置上TextStype 并在样式里面添加height 使用24/15即可 style: TextStyle( fontSize: 15, height: "详细地址" == widget.title ? 25 / 15 : 1),感谢同事郁某某...原创 2021-11-19 20:06:58 · 2492 阅读 · 0 评论 -
Flutter 替换空字符串
直接使用.replaceAll(new RegExp(r"\s+\b|\b\s"), "")即可如果使用.replaceAll(" ", "")反而不生效原创 2021-11-19 13:53:14 · 3677 阅读 · 0 评论 -
Android禁止滑动特效
import 'dart:io';import 'package:flutter/material.dart';/** * 安卓禁止ListView滑动特效 */class NoSlideBehavior extends ScrollBehavior { @override Widget buildViewportChrome( BuildContext context, Widget child, AxisDirection axisDirection) { i.原创 2021-11-18 18:32:08 · 324 阅读 · 0 评论 -
Flutter 监听TextField焦点
Flutter 监听TextField焦点 FocusNode _focusNode = FocusNode(); bool isFocus = false; @override void initState() { super.initState(); _focusNode.addListener(() { setState(() { isFocus = _focusNode.hasFocus; }); }); ..原创 2021-11-11 17:07:38 · 2221 阅读 · 0 评论 -
Flutter Switch开关
Switch( value: mIsDefault, activeColor: Colors.white, activeTrackColor: Color(0xff025EFF), inactiveTrackColor: Color(0xffF2F2F2), onChanged: (value) { setState(() { ..原创 2021-11-10 21:08:54 · 1248 阅读 · 0 评论 -
Flutter 多语言 插件 intl
我们使用as支持的一款插件intlhttps://pub.dev/packages/intl安装插件flutter Intl安装后重启新增依赖dev_dependencies 下面添加如下代码 flutter_localizations: sdk: flutter点击获取下使用刚才安装的工具,点击Tools Flutter Intl 初始化工程给他多语言的能力Lib下会新增很英语的多语言文件并且 清单文件最下面...原创 2021-10-01 20:56:54 · 739 阅读 · 0 评论 -
Flutter 回退版本
Flutter2.5是一个大版本所以。。不会用的小伙伴可以临时撤回来Flutter | Flutter SDK releases点进去上面地址下载自己常用的版本然后替换本地的即可原创 2021-09-27 12:02:02 · 751 阅读 · 0 评论 -
Flutter 2.5 的新特性
您好,欢迎来到 Flutter 2.5!这是一个大版本,在 Flutter 版本历史上排名第二:关闭了 4600 个问题,从 252 个贡献者和 216 个审阅者合并了 3932 个 PR。如果我们回顾过去一年,我们会看到 1337 位贡献者创建了 21,072 个巨大的 PR,其中 15,172 个被合并。虽然“Flutter 中的新功能”博客文章侧重于新功能,但我们在 Flutter 方面的第一项工作始终是确保您拥有所需的最高质量级别的功能。事实上,此版本继续了许多重要的性能和工具改进,以跟踪您..原创 2021-09-24 17:58:58 · 397 阅读 · 0 评论 -
Error: Could not find the correct Provider<GlobalBloc> above this BlocBuilder<GlobalBloc, GlobalStat
报错代码 runApp(child: FlutterUnit());修改为 runApp(BlocWrapper(child: FlutterUnit()));原创 2021-09-22 04:17:08 · 1079 阅读 · 0 评论 -
EasyLoading 设置透明背景
static void showLoading( {String status = '', EasyLoadingMaskType maskType = EasyLoadingMaskType.clear}) { if (status.isEmpty) { EasyLoading.instance..backgroundColor = Colors.transparent; } Future.value(EasyLoading.show(st...原创 2021-09-03 15:11:43 · 1298 阅读 · 1 评论 -
Flutter Provider的使用
需求:点击Dialog的ok按键更新外部的视图首先创建Strore用于单独控制的变量import 'package:flutter/material.dart';class GiftStore with ChangeNotifier { bool _isShowGift=true; bool get isShowGfit => _isShowGift; void update(bool _) { _isShowGift = _ ?? false; noti原创 2021-09-02 11:14:34 · 275 阅读 · 0 评论 -
Flutter bottomSheet设置高度
showModalBottomSheet( shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16.0)), context: context, isScrollControlled: true, builder: (BuildContext context) { return Container( height: 480, ..原创 2021-09-01 16:33:00 · 1492 阅读 · 0 评论 -
Flutter 渐变
child: Container( decoration: BoxDecoration( gradient: LinearGradient( begin: Alignment.topLeft, end: Alignment.bottomRight, colors: [Color(0xffff3737), Color(0xffff450d)], ..原创 2021-09-01 15:14:17 · 308 阅读 · 0 评论 -
InAppWebView 拦截网络请求 打开微信支付或者支付宝支付
flutter_inappwebview: ^5.3.2 url_launcher: ^6.0.9 child: InAppWebView( onWebViewCreated: (InAppWebViewController webViewController) { _controller = webViewController; }, // ...原创 2021-08-25 10:04:05 · 2178 阅读 · 2 评论 -
Flutter ListView冲突 Column EasyRefresh
其实冲突的来源主要是Column 包裹了一层ListView解决方案也是非常的时尚两句代码 return ListView.builder( itemExtent: 80.0, shrinkWrap: true, physics: NeverScrollableScrollPhysics(), itemCount: _listData.length, itemBuilder: (BuildContext ...原创 2021-08-24 18:54:58 · 972 阅读 · 0 评论 -
Flutter 贪吃蛇小游戏(要用上下左右控制的。。。没键盘的不行哦)245行
贪吃蛇小游戏。import 'dart:async';import 'dart:math';import 'package:flutter/material.dart';import 'package:flutter/services.dart';void main() { runApp(MyApp());}class MyApp extends StatelessWidget { // This widget is the root of your applica...原创 2021-08-20 17:26:49 · 482 阅读 · 0 评论 -
Flutter 监听键盘
可以使用RawKeyboardListener 包裹一层 body: RawKeyboardListener( focusNode: FocusNode(), autofocus: true, onKey: (event) { if (event.runtimeType == RawKeyDownEvent) { Direction newDirection = Directi.原创 2021-08-20 16:08:42 · 1733 阅读 · 0 评论 -
Flutter Spacer() 不能使用 SingleChildScrollView 解决方案
使用后将会报错报错的代码片段 body: SingleChildScrollView( child: Column( children: [ Spacer(),错误日志输出Performing hot reload...Syncing files to device MI 8...======== Exception caught by rendering library ==========原创 2021-08-13 19:09:30 · 2239 阅读 · 0 评论 -
Flutter 实现百分比布局 OutlinedButton 与MaterialButton设置圆角
child: Padding( padding: const EdgeInsets.all(20.0), child: Row( children: [ Expanded( flex: 2, child: OutlinedButton( onPressed: () {}, .原创 2021-08-13 19:01:23 · 961 阅读 · 0 评论 -
Flutter Column嵌套 Row Text 超出屏幕
解决方案也很简单。 使用Expanded就可以了Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ Container( // margin: EdgeInsets.only(top: 4), width: 10, height: 10原创 2021-08-13 17:14:51 · 3197 阅读 · 0 评论 -
Flutter 绘制小圆点
Row( children: [ Container( width: 10, height: 10, decoration: BoxDecoration( color: Colors.black87, borderRadius: Bord...原创 2021-08-13 16:28:14 · 3268 阅读 · 0 评论 -
Flutter LayoutBuilder 控制控件大小比直接计算款高要方便很多
实现这样的内容怎么实现 就是白色区域的一半聪明的小伙子拿起来了。Container 和MediaQuery 宽高 -刘海屏 然后。。有的还有底部的巴拉巴拉进行一顿除以2的运算。body: Container( child: Text("注销账号" * 500), width: MediaQuery.of(context).size.width / 2, height: (MediaQuery.of(context).size.heig..原创 2021-08-13 15:14:08 · 407 阅读 · 0 评论 -
Flutter 更新版本号升不上去 Android 打包依然没变
1)flutter clean2)在Android Studio中重新执行build。原创 2021-08-12 01:20:41 · 779 阅读 · 0 评论 -
Flutter showDialog 如何刷新 setStatus
答案是抽出来。。。 Future<void> _showRecommend() async { final flag = await showDialog( context: context, builder: (BuildContext context) { return FilterPage(color:widget.color); }); }FilterPage 这个页面可以使用StatefulW.原创 2021-08-11 19:37:23 · 791 阅读 · 1 评论 -
Flutter TabBar 自定义点击事件
class _BasePageState extends State<BasePage> with SingleTickerProviderStateMixin { var _tabList = ['甲方', '乙方', '预付', '后付', '筛选']; late TabController _tabController;首先要使用 withSingleTickerProviderStateMixin因为和这个tabcontroller的初始化有关系 ..原创 2021-08-11 14:47:03 · 1670 阅读 · 0 评论 -
Flutter 做一个类似超级玛丽 (想不起来名字 挺好玩反正)Flutter写个小游戏,欢迎一起撸代码 【185行 代码逆天改命】
效果展示代码数量截图实际源码import 'dart:async';import 'package:flutter/material.dart';void main() { runApp(MyApp());}class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildCont...原创 2021-08-08 18:59:22 · 3427 阅读 · 0 评论 -
flutter text 下划线
child: Text( "意见反馈", style: TextStyle( color: Color(0xff3E6CDB), decoration: TextDecoration.underline, ), ..原创 2021-08-06 17:50:31 · 1372 阅读 · 0 评论 -
Flutter 拨打电话
https://pub.dev/packages/url_launcherimport 'package:url_launcher/url_launcher.dart';new Center( child: new FlatButton( onPressed: () => launch("tel:21213123123"), child: new Text("Call me")), ),.原创 2021-08-06 15:51:36 · 1181 阅读 · 0 评论 -
The overflowing RenderFlex has an orientation of Axis.horizontal. The edge of the RenderFlex that is
错误日志:Performing hot reload...Syncing files to device MI 8...Reloaded 9 of 1380 libraries in 963ms.======== Exception caught by rendering library =====================================================The following assertion was thrown during layout:原创 2021-08-06 10:12:11 · 1041 阅读 · 0 评论 -
Flutter 如何新增圆角与边框
Container( decoration: BoxDecoration( color: MyColors.color_main, border: Border.all(width: 1, color: Colors.white), //圆角 ...原创 2021-08-05 17:58:55 · 342 阅读 · 0 评论 -
Missing browser features DartPad requires localStorage to be enabled. For more information, Chrome
Chrome 无法使用 是因为Chrome默认屏蔽了Cookie可以通过点击这里即可使用chrome直接在官网调试Flutter原创 2021-08-04 23:15:46 · 282 阅读 · 0 评论 -
Flutter setStatus为什么有时候需要使用 mounted
正常我们使用组件 var response = await requestApi(...); setState((){ this.data = response.data; })然后这个requestApi 还没走完 那么点击返回的话 控件就没了比如切换页面报错:setState() called after dispose()我们可以包一层来解决这个问题var response = await requestApi(...); .原创 2021-08-04 20:15:38 · 871 阅读 · 0 评论 -
Flutter 炫酷 车轮动效weight ListWheelScrollView
@override Widget build(BuildContext context) { return Container( child: ListWheelScrollView( //高度 itemExtent: 150, //ListWheelScrollView的渲染效果类似车轮,设置diameterRatio调整其直径属性: diameterRatio: 1, //perspective...原创 2021-08-03 00:40:29 · 749 阅读 · 0 评论 -
Flutter Dart 创建List空数组
late List<AdListAdList> mAdList; @override void initState() { mAdList = []; super.initState(); }创建一个新的空数组mAdList = [];原创 2021-08-02 19:17:31 · 2189 阅读 · 0 评论 -
Flutter 慎用的forEach循环
enum ServerEnv { ONLINE, PRE, QA, DEV, QA2 } static ServerEnv getEnvByCode(int code) { ServerEnv.values.forEach((env) { if (env != null && env.index == code) { return env; } }); return ServerEnv.QA; }上面写的 ...原创 2021-08-02 16:36:07 · 2782 阅读 · 1 评论 -
Dio 泛型网络请求封装。带基类。带完整日志输出
import 'dart:convert' as convert;import 'dart:convert';import 'dart:developer';import 'dart:io';import 'package:anguo/utils/app_info_utlis.dart';import 'package:anguo/utils/my_flutter_toast.dart';import 'package:anguo/utils/net_work_tools.dart';im.原创 2021-08-01 23:42:23 · 1045 阅读 · 3 评论