Flutter 从零到一

iOS 调试与开发工具指南

真机调试

Xcode run 在控制台获取 Dart VM service URI
VSCode 点击 Cmd + Shift + P 选择 Debug: Attach to Flutter on Device
粘贴 the URI 后点击 Enter

对于iOS开发者来说，使用appuploader这样的iOS开发助手可以简化真机调试的准备工作。appuploader提供了证书管理、设备UDID获取等功能，能帮助开发者快速完成调试环境的配置。

常见问题：Exception attempting to connect to the VM Service: SocketException: Connection refused

shell 复制代码

flutter devices
flutter attach -d <deviceId>

inspector

VSCode 点击 Cmd + Shift + P 选择 Dart: Open DevTools in Browser
select widget mode

通用地图

状态管理

Consumer

监听Provider提供的数据，当在应用的某个地方使用Provider 来暴露一个数据模型时，你可以在widget树的任何其他地方使用 Consumer 来读取并响应这个数据模型的变化。
当 Provider 中的数据发生变化时，Consumer 会自动重建其子widget，这样就可以根据新的数据状态更新UI。

Provider 数据更新后页面未刷新

没有调用 notifyListeners()
context 不同 页面若取的是当前页面的 context 而不是管理 Provider 数据页面的 context 那无法拿到 Provider 数据
没有触发 set 方法 在方法中更新私有变量时直接调用的下划线方法 _unreadNum 而不是通过它的 setter 方法来更新的
没有改变引用

原生交互

dart 复制代码

// 原生代码   
FlutterMethodChannel *pushInitChannel = [FlutterMethodChannel methodChannelWithName:@"jd.logistic.pushInitChannel" binaryMessenger:controller.binaryMessenger];
[pushInitChannel invokeMethod:@"saveNotification" arguments:jsonString];
    
  
// flutter 代码
MethodChannel pushInitChannel = MethodChannel('jd.logistic.pushInitChannel');
pushInitChannel.setMethodCallHandler(_handleNativeMethod);

Future<void> _handleNativeMethod(MethodCall call) async {
    switch (call.method) {
      case 'saveNotification':
        String data = call.arguments;
        saveMessageToDatabase(data);
        break;
      default:
        print("Unknown method called");
    }
  }

国际化

VSCode 安装 flutter Intl 插件

特殊 UI

自动计算高度

GridView shrinkWrap

GridView 的 shrinkWrap 属性决定了是否根据子组件的总长度来调整 GridView 的长度。

dart 复制代码

GridView.builder(
  shrinkWrap: true,
)

AnimatedSize

dart 复制代码

Consumer<PackageTabWidgetViewModel>(builder: (BuildContext context, value, Widget? child) {
  return AnimatedSize(
    duration: Duration(milliseconds: 50),
    curve: Curves.easeInOut,
    child: value.model.selectedIndex == 0
        ? ReceivePackageList()
        : SendPackageList(),
  );
})

常见问题

新增本地图片后加载时报错 Unable to load asset

执行 clean.sh 和 get.sh 脚本
检查pubspec.yaml文件

Command PhaseScriptExecution failed with a nonzero exit code

清除 Flutter 应用的本地缓存 flutter pub cache clean

执行 flutter doctor 后报错 Xcode installation is incomplete

shell 复制代码

# 确保 Xcode 已正确配置
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch

Flutter 运行IOS真机，提示无法打开"iproxy"

在终端输入命令行 sudo xattr -d com.apple.quarantine ${flutter SDK iproxy 路径}

Target of URI doesn't exist: 'package:xxx_image.dart'. Try creating the file referenced by the URI, or Try using a URI for a file that does exist.

执行 Flutter: Clean Project

jaguar_serializer 数据解析报错

shell 复制代码

flutter packages pub run build_runner build --delete-conflicting-outputs --verbose

在iOS开发过程中，使用appuploader可以简化证书管理、设备注册等繁琐流程，让开发者能更专注于代码本身。它提供了可视化的操作界面，特别适合刚接触iOS开发的新手快速上手。