Flutter 跨平台多端适配与 Android/iOS 一键自动化打包发布

1. 引言

开发阶段的"狂飙"之后，将 App 交付给用户才是最终目的。Flutter 的代码虽然是一次编写，但由于 Android 和 iOS 各自生态的割裂，在设备适配、证书配置、打包发布等环节依然布满荆棘。本文将为你梳理 Flutter 跨平台布局适配的最佳策略，并手把手教你如何基于 CI/CD (如 fastlane、GitHub Actions) 搭建自动化打包发布流水线。

2. 跨端屏幕与布局适配策略

面对成百上千种不同的屏幕尺寸（手机、折叠屏、平板），我们不能硬编码固定的尺寸。

2.1 响应式布局 (Responsive Layout)

借助 LayoutBuilder 和 MediaQuery，应用能感知当前窗口大小。

scala 复制代码

import 'package:flutter/material.dart';

class ResponsiveLayout extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // 获取屏幕宽度
    final double screenWidth = MediaQuery.of(context).size.width;

    if (screenWidth > 600) {
      return _buildTabletLayout();
    } else {
      return _buildMobileLayout();
    }
  }

  Widget _buildTabletLayout() {
    return Row(
      children: [
        Expanded(flex: 1, child: SideMenu()),
        Expanded(flex: 2, child: MainContent()),
      ],
    );
  }

  Widget _buildMobileLayout() {
    return MainContent();
    // 配合 Drawer 作为菜单
  }
}

2.2 安全区域保护

千万不要忘记 SafeArea，它能自动为你避开 iOS 的刘海屏、灵动岛以及 Android 的底部导航条。

3. 手动打包构建指南

3.1 Android 打包 (APK / App Bundle)

Google Play 现在强制要求提交 .aab (Android App Bundle) 格式，而直接分发可以使用 .apk。

css 复制代码

# 生成 APK
flutter build apk --release --target-platform android-arm,android-arm64,android-x64 --split-per-abi

# 生成 App Bundle
flutter build appbundle --release

注意：在打包前，必须在 android/key.properties 中配置好 release 签名信息。

3.2 iOS 打包 (IPA)

arduino 复制代码

flutter build ipa --release

这将生成 .xcarchive，接着可以通过 Xcode 打开该归档进行签名和上传，或者直接生成 .ipa 包供分发。前提：必须在 Apple Developer 后台配置好 Bundle ID、Provisioning Profiles (描述文件) 和证书。

4. 自动化构建与发布（CI/CD & Fastlane）

反复手动打包极易出错且耗时。使用 fastlane 可以极大解放生产力。

4.1 Fastlane 核心工作流 (ASCII)

css 复制代码

[ Git Push to Main ] -> [ CI Trigger (e.g. GitHub Actions) ]
                             |
                   [ Fastlane execution ]
                             |
            +----------------+----------------+
            |                                 |
   [ Android build/sign ]            [ iOS build/sign ]
            |                                 |
 [ Upload to Google Play ]         [ Upload to TestFlight ]

4.2 Fastlane 简易配置示例

iOS 侧 (ios/fastlane/Fastfile)

ruby 复制代码

default_platform(:ios)

platform :ios do
  desc "Push a new beta build to TestFlight"
  lane :beta do
    # 自动管理证书与描述文件
    match(type: "appstore")
    
    # 编译 Flutter 产物 (可通过 fastlane 插件调用)
    sh("cd ../.. && flutter build ipa --release")
    
    # 上传到 TestFlight
    upload_to_testflight(
      ipa: "../build/ios/ipa/Runner.ipa"
    )
  end
end

Android 侧 (android/fastlane/Fastfile)

ruby 复制代码

default_platform(:android)

platform :android do
  desc "Submit a new Beta Build to Crashlytics/Play Store"
  lane :beta do
    # 调用 gradle 构建 app bundle
    gradle(task: "bundle", build_type: "Release")
    
    # 上传至 Google Play Internal 轨道
    upload_to_play_store(
      track: 'internal',
      aab: '../build/app/outputs/bundle/release/app-release.aab'
    )
  end
end

5. 总结

适配和发布是 App 走向生产环境的"最后一公里"。通过响应式设计（LayoutBuilder/MediaQuery）确保多端UI的体验一致性，通过自动化流水线（Fastlane/CI 工具）将繁琐的签名、构建、上传工作一键托管。掌握这些，你才能真正从一个 Flutter 开发者，蜕变为能独当一面的大前端架构师。