flutter开发

最新推荐文章于 2022-06-20 20:39:15 发布

互联网小熊猫

最新推荐文章于 2022-06-20 20:39:15 发布

阅读量1.5k

点赞数 2

分类专栏： Android日常工作文章标签： flutter

本文链接：https://blog.csdn.net/weixin_42600398/article/details/93384057

版权

Android日常工作专栏收录该内容

266 篇文章 23 订阅

订阅专栏

1.listView报The following assertion was thrown during performResize()解决方案

在listVie.build的时候加入如下参数：

ListView.builder(
                scrollDirection: Axis.vertical,
                shrinkWrap: true,)

2.Flutter布局：

所有的都是weight。

3.flutter中的手势传递

手势是从最内层中的weight开始向外溢出的，一直到根。

4.flutter中解决事件冲突

通过手势竞争场来解决的，手势竞争场的规则：
（1）在任何时候，识别者都可以宣布并离开手势竞争场。如果手势竞争场只剩下一个识别器，那么该识别器就是赢家。
（2）在任何时候，识别者都可以宣布胜利，并且所有剩下的识别器都会失败。
4.MaterialApp 使用注意事项
（1）.home属性是进入程序后显示的第一个页面，传入的是一个widget，但实际上这个widget需要包裹一个scaffold以显示该程序使用material design风格。

5.flutter中设置背景颜色的方式：

（1）将组建放入到container中

Container(color: Colors.white, child：Widget）

6.widget的生命周期

widget和android中的activity是一样的，所有移动端的界面的展示组件都有他的生命周期，那么flutter也不例外，在flutter中生命周期如下：
在这里插入图片描述

7.在flutter中万物皆组件所有的东西都是组件构成的。

8.TextField中初始化文字并且光标在文字最后面的实现方式：

new TextField(
            controller: TextEditingController.fromValue(
              TextEditingValue(
                text: inputText,
                //设置光标在最后面。
                selection: TextSelection.fromPosition(
                  TextPosition(
                    affinity: TextAffinity.downstream,
                    offset: inputText.length,
                  ),
                ),
              ),
            ),
          ）

9.flutter中packages get的时候一直卡在Running “flutter packages get” in XXX的解决办法。

（1）、原因是因为在国内使用flutter的默认镜像会导致一直卡着。
（2）、解决办法是通过设置国内的镜像。
（3）、具体步骤：

vi ~/.bash_profile 
// 添加下面的代码：
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
// 保存后执行：
source  ~/.bash_profile

10.工厂构造函数

工厂构造函数是一种构造函数,与普通构造函数不同,工厂函数不会自动生成实例,而是通过代码来决定返回的实例对象.
例如：

class Manager {
  // 工厂模式
  factory Manager() =>_getInstance()
  static Manager get instance => _getInstance();
  static Manager _instance;
  Manager._internal() {
    // 初始化
  }
  static Manager _getInstance() {
    if (_instance == null) {
      _instance = new Manager._internal();
    }
    return _instance;
  }
}

11.dart中通过下划线开头来实现私有变量，要不默认全是公有的。

12.dart语言和js语言执行异步是一样的原理。

在这里插入图片描述
当有异步操作的时候就会将异步的操作放入引擎中开一个线程来执行这次的任务，最后执行完后会返回到栈中。

13.在dart中只有执行到await的时候才会被挂起。否则就算是定义的async也不是执行异步的。

14.flutter中Container居中

Container(
        child: new Text('text'),
        alignment: Alignment.center,
)

15.container设置边框

 Container(
        decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(5),
        border: Border.all(color:Colors.black26,width: 1 )
 ),

16.Flutter中的按钮

（1）、RaisedButton ：凸起的按钮，是Android中的Material Design风格的Button ，继承自MaterialButton
（2）、FlatButton ：扁平化的按钮，继承自MaterialButton
（3）、OutlineButton ：带边框的按钮，继承自MaterialButton
（3）、IconButton ：图标按钮,继承自StatelessWidget

17.Navigator移除所有的路由，显示当前的路由。

pushNamedAndRemoveUntil 将命名路由推送到Navigator，删除先前的路由，直到该函数的参数predicate返回true为止。

18.flutter Button的种类

1、RawMaterialButton：不适用当前Theme或者ButtonTheme的控件，如果自定义，官方推荐使用这个
2、MaterialButton：google材料设计按钮，有主题的button，官网不推荐使用此控件，推荐使用它的子类，
3、RaisedButton ：凸起的按钮，其实就是 Material Design 风格的 Button，有阴影，圆角的button
4、FlatButton ：扁平化的按钮，没有阴影没有圆角没有边框，背景透明
5、OutlineButton：线框按钮，没有阴影，有圆角边框的
6、IconButton ：只有一个Icon图标的按钮
7、ButtonBar：按钮组，可以将多个文本，图标放在一块
8、FloatingActionButton : 浮动按钮
9、PopupMenuButton 菜单，相当于 android 中的 PopupMenu 和 ios 中的 UIMenuController
10、DropdownButton 下拉列表，相当于 android 中的 Spinner
11、InkWell ：无水波纹效果按钮

19.text 去掉下划线

只需要在style下面的TextStyle增加属性decoration:TextDecoration.none

20.SizedBox可以设置其他组件的高度

SizedBox(
      height: 10,
      child: LinearProgressIndicator(
        backgroundColor: Colors.black12,
        value: percentage,
        valueColor: new AlwaysStoppedAnimation<Color>(Colors.green),
      ),
    )

21.设置圆角

（1）、ClipRRect设置圆角

ClipRRect(
    borderRadius: BorderRadius.all(Radius.circular(4)),
    child: SizedBox(
      height: 10,
      child: LinearProgressIndicator(
        backgroundColor: Colors.black12,
        value: percentage,
        valueColor: new AlwaysStoppedAnimation<Color>(Colors.green),
      ),
    ),
  ),

（2）、container设置圆角

decoration: new BoxDecoration(
 //背景
 color: Colors.white,
 //设置四周圆角 角度
 borderRadius: BorderRadius.all(Radius.circular(4.0)),
 //设置四周边框
 border: new Border.all(width: 1, color: Colors.red),
),

22.进度条

（1）、条形进度条

new LinearProgressIndicator(
    backgroundColor: Colors.blue,
    value: 0.1,
    valueColor: new AlwaysStoppedAnimation<Color>(Colors.red),
),

（2）、圆形进度条

new CircularProgressIndicator(
    strokeWidth: 4.0,
    backgroundColor: Colors.blue,
    value: 0.2,
    valueColor: new AlwaysStoppedAnimation<Color>(Colors.red),
),

23.dio实现下载功能

response =await dio.download(url,savePath,onReceiveProgress: (int count, int total){
        print("$count $total");
        });

24.边框按钮

   OutlineButton(
            borderSide:new BorderSide(color: Theme.of(context).primaryColor),
            child: new Text('注册',style: new TextStyle(color: Theme.of(context).primaryColor),),
            onPressed: (){},
   )

25.展示Dialog

Future<T> showDialog<T>({
  @required BuildContext context,
  // 点击 dialog 外部是否可消失
  bool barrierDismissible = true,
  // 构建 Dialog 视图
  WidgetBuilder builder,
})

24.dio中取消请求

void cancelRequests(CancelToken token) {
    token.cancel("cancelled");
}

25.引用第三方插件的方式

（1）、使用gityinyong

 install_plugin:
      git: https://github.com/hui-z/flutter_install_plugin.git

（2）、本地引用

  barcode_scan:
    path: plugins/barcode_scan-1.0.0

（3）、直接引用第三方库

barcode_scan: ^0.0.8

26.弹框

Flutter提供了showDialog函数显示一个对话框。
（1）、showDialog：展示Material 控件
（2）、showCupertinoDialog：ios样式对话框
（3）、showGeneralDialog：自定义弹出的窗口，默认状态下弹出的窗口点击空白处不消失。

showDialog(
     context: context,
     barrierDismissible: false,
     builder: (BuildContext context) =>
         UpdateView(updateMessage, downloadUrl),
);

barrierDismissible为false是点击空白区域不消失弹框。

27.四种运行模式

（1）、Debug模式
Debug模式可以在真机和模拟器上同时运行：会打开所有的断言，包括debugging信息、debugger aids（比如observatory）和服务扩展。优化了快速develop/run循环，但是没有优化执行速度、二进制大小和部署。命令flutter run就是以这种模式运行的，通过sky/tools/gn --android或者sky/tools/gn --ios来build。有时候也被叫做“checked模式”或者“slow模式”。
（2）、Release模式
Release模式只能在真机上运行，不能在模拟器上运行：会关闭所有断言和debugging信息，关闭所有debugger工具。优化了快速启动、快速执行和减小包体积。禁用所有的debugging aids和服务扩展。这个模式是为了部署给最终的用户使用。命令flutter run --release就是以这种模式运行的，通过sky/tools/gn --android --runtime-mode=release或者sky/tools/gn --ios --runtime-mode=release来build。
（3）、Profile模式
Profile模式只能在真机上运行，不能在模拟器上运行：基本和Release模式一致，除了启用了服务扩展和tracing，以及一些为了最低限度支持tracing运行的东西（比如可以连接observatory到进程）。命令flutter run --profile就是以这种模式运行的，通过sky/tools/gn --android --runtime-mode=profile或者sky/tools/gn --ios --runtime-mode=profile```来build。因为模拟器不能代表真实场景，所以不能在模拟器上运行。
（4）、Test模式
headless test模式只能在桌面上运行：基本和Debug模式一致，除了是headless的而且你能在桌面运行。命令flutter test就是以这种模式运行的，通过sky/tools/gn来build。

28、隐藏一个组件

Visibility(
    visible: 是否显示,
    child: Widget(),
)

29.flutter clean

删除build/和.dart_tool/目录,清除缓存信息,避免之前不同版本代码的影响

30. Container 充满屏幕

Container(
            width: double.infinity,
            height: double.infinity,
            child: Image.network("http://jspang.com/static/myimg/WechatIMG12.jpeg"),
            color: Colors.lightBlue,
            color: Color.fromARGB(255, 255, 0, 0),
          ),

31.json数据和实体类直接的转换

（1）、当我们初次创建User.dart的时候，需要加入 part ‘User.g.dart’; 虽然系统会提示报错，但是不必紧张，这个我们一会生成Author.g.dart文件所必须的条件，我们暂时不要管它报不报错
（2）、在需要转换的实体dart类前加入@JsonSerializable()注解，表示需要json序列话处理。

（3）、运行 flutter packages pub run build_runner build

32.dart 在map中添加数据

 Look up the value of [key], or add a new value if it isn't there.

 Returns the value associated to [key], if there is one.
 Otherwise calls [ifAbsent] to get a new value, associates [key] to
 that value, and then returns the new value.

 Map<String, int> scores = {'Bob': 36};
 for (var key in ['Bob', 'Rohan', 'Sophena']) {
 scores.putIfAbsent(key, () => key.length);
 }
 scores['Bob']; // 36
 scores['Rohan']; // 5
 scores['Sophena']; // 7

31.自定义组件

CustomPainer类似于canvas一样的组件，可以通过这个组件实现各种自定义。

32.跨平台技术融合解决差异化

可以将RN flutter 小程序等融合在一起解决了差异化的问题。

33.native和flutter切换

通过URLSchema进行native和flutter之间切换。

34.组件的优化

StatefullWidget 是消耗非常大的资源的，尽量少使用

35.时间戳

（1）、获取
datetime.millisecondsSinceEpoch
（2）、转换
DateTime.fromMillisecondsSinceEpoch(millisecondsSinceEpoch);

36、flutter报如下错误

Could not get resource ‘https://storage.googleapis.com/download.flutter.io/cn/rongcloud/sdk/im_lib/4.0.0/im_lib-4.0.0.pom’.
方案：
https://blog.csdn.net/wo122282967/article/details/105589103/

互联网小熊猫

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
flutter开发

listView报The following assertion was thrown during performResize()解决方案在listVie.build的时候加入如下参数： ListView.builder( scrollDirection: Axis.vertical, shrinkWrap: true,）...
复制链接

扫一扫