Flutter开发技巧

本文已参与「新人创作礼」活动，一起开启掘金创作之路。

1.这个网站可以把获取的json信息转化成你想要的model类 javiercbk.github.io/json_to_dar…

2.如何在页面初始化之后只调用一次这个方法

/*         如果你想在initState的时候调用这个组件，那么就需要等父组件创建完成后再去创建小组件，
          官方提供了一个组件创建完成的回调通知方法*/
      WidgetsBinding.instance.addPostFrameCallback((_) {
        if(isInitData){
          initData(glueDischargeFM);
          isInitData = false;
        }
      });
      

3.动态生成Listview最好是用ListView.builder 不要用ListTile. ListTile点击事件获取ListTile的值 没有 ListView.builder方便.

4.屏幕自适应像素封装（根据不同手机适应大小） 先创建一个公共类 然后想要调大小的时候直接调用公共类里面的方法

import 'package:flutter/material.dart';

//自适应屏幕
class ScreenAadpt {
  //第一步 获取设备对象属性
  static MediaQueryData mediaQuery = MediaQueryData.fromWindow(window);
  static double screenwidth; //设备屏幕宽度width
  static double screenheight; //设备屏幕高度height
  static double topheight; //顶部空白高度
  static double bottomheight; //底部空白高度
  static double devicepixelratio = mediaQuery.devicePixelRatio; //分辨比
  static var screenratio; //屏幕宽比

  //初始化 UI设计稿：比如750、1920等  uinumber变量设计稿宽
  static initialize(int uinumber) {
    screenwidth = mediaQuery.size.width;
    screenheight = mediaQuery.size.height;
    int uiwidth = uinumber is int ? uinumber : 1920; //默认是1920 ui设计图
    screenratio = screenwidth / uiwidth; //屏幕宽比  设备宽度 : ui设计图宽度
  }

  //实现填写像素  number：设计稿的像素
  static px(number) {
    if (!(screenratio is double || screenratio is int)) {
      ScreenAadpt.initialize(1920);
    }
    return number * screenratio; //返回处理好的像素数值
  }

  //获取屏幕宽度
  static screenWidth() {
    screenwidth = mediaQuery.size.width;
    return screenwidth;
  }

  //获取设备屏幕高度
  static screenHeight() {
    screenheight = mediaQuery.size.height;
    return screenheight;
  }

  //获取设备顶部空白高度
  static topHeight() {
    topheight = mediaQuery.padding.top;
    return topheight;
  }

  //获取设备底部空白高度
  static bottomHeight() {
    bottomheight = mediaQuery.padding.bottom;
    return bottomheight;
  }
}

5.页面中组件太多不建议用expend，软键盘弹出最下面组件会随着浮动，建议在最外层Container里用SingleChildScrollView

6.隐藏弹起输入框使用通道传递TextInput.hide指令给底层

SystemChannels.textInput.invokeListMethod('TextInput.hide');