FSA全栈行动 FSA全栈行动
首页
  • 移动端文章

    • Android
    • iOS
    • Flutter
  • 学习笔记

    • 《Kotlin快速入门进阶》笔记
    • 《Flutter从入门到实战》笔记
    • 《Flutter复习》笔记
  • 内功心法

    • 《深入浅出设计模式Java版》笔记
前端
后端
  • 产品
  • 代理
  • 提效
  • 逆向
  • 分类
  • 标签
  • 归档
  • LinXunFeng
  • GitLqr

公众号:FSA全栈行动

记录学习过程中的知识
首页
  • 移动端文章

    • Android
    • iOS
    • Flutter
  • 学习笔记

    • 《Kotlin快速入门进阶》笔记
    • 《Flutter从入门到实战》笔记
    • 《Flutter复习》笔记
  • 内功心法

    • 《深入浅出设计模式Java版》笔记
前端
后端
  • 产品
  • 代理
  • 提效
  • 逆向
  • 分类
  • 标签
  • 归档
  • LinXunFeng
  • GitLqr
  • AndroidUI

  • Android第三方SDK

  • Android混淆

  • Android仓库

  • Android新闻

  • Android系统开发

  • Android源码

  • Android注解AOP

  • Android脚本

  • AndroidTv开发

  • AndroidNDK

  • Android音视频

  • Android热修复

  • Android性能优化

  • Android云游戏

  • Android插件化

  • iOSUI

  • iOS工具

  • iOS底层原理与应用

  • iOS组件化

  • iOS音视频

  • iOS疑难杂症

  • iOS之Swift

  • iOS之RxSwift

  • iOS开源项目

  • iOS逆向

  • Flutter开发

    • Dart - 抽象类的实例化
    • Flutter - 打印好用的Debug日志
    • Flutter - 混合开发
    • Flutter - 解决混合开发iOS脚本打包遇到的问题
    • Flutter - 低版本在iOS14上遇到的问题与解决方案
    • Flutter - 解决原生弹窗的触摸事件被Flutter响应的问题
    • Flutter - 实现列表上下拉切换header
    • Flutter - 获取ListView当前正在显示的Widget信息
    • Flutter - 列表滚动定位超强辅助库,墙裂推荐!🔥
    • Flutter - 快速实现聊天会话列表的效果,完美💯
    • Flutter - 聊天输入框更新文本时的必备优化点🔖
    • Flutter - 我给官方提PR,解决run命令卡住问题 😃
    • Flutter - 探索run命令到底做了什么 🤔
    • Flutter - 引擎调试(iOS篇)🛠
    • Flutter - 引擎调试bug到提交PR实战 🐞
    • Flutter - 船新升级😱支持观察第三方构建的滚动视图💪
    • Flutter - 瀑布流交替播放视频 🎞
    • Flutter - IM保持消息位置大升级(支持ChatGPT生成式消息) 🤖
    • Flutter - 滚动视图中的表单防遮挡 🗒
    • Flutter - 秒杀1/2曝光统计 📊
    • 一天内加入 Flutter 和 FlutterCandies 两大组织是什么体验 🧐
    • Flutter - 如何快速搓一个微信通讯录列表(azlist) 📓
    • Flutter - 混编项目集成Shorebird热更新🐦(安卓篇)
    • Flutter - 混编项目集成Shorebird热更新🐦(iOS篇)
    • Flutter - 解决返回原生页面时dispose方法未被触发的问题 🐞
    • Flutter - 升级3.19之后页面多次rebuild?🤨
    • Flutter - 热更新 Shorebird 1.0 正式版来了 🐦
    • Flutter - 使用Pigeon实现视频缓存插件 🐌
    • Flutter - 轻松搞定屏幕旋转功能 😎
    • Flutter - 解决Connection closed before full header was received
    • Flutter - 实现聊天键盘与功能面板的丝滑切换 🍻
    • Flutter - 支持观察NestedScrollView,兼容性更强 😈
    • Flutter - 聊天键盘与面板丝滑切换的强势升级 🍻
    • Flutter - 升级到3.24后页面还会多次rebuild吗?🧐
    • Flutter - 轻松实现PageView卡片偏移效果
    • Flutter - 轻松搞定炫酷视差(Parallax)效果
    • Flutter - 危!3.24版本苹果审核被拒!
    • Flutter - 子部件任意位置观察滚动数据
    • Flutter - iOS编译加速
    • Flutter - Xcode16 还原编译速度
    • Flutter - GetX Helper 助你规范应用 tag
    • Flutter - GetX Helper 如何应用于旧页面
    • Flutter - 聊天面板库动画生硬?这次让你丝滑个够
    • Flutter - 使用本地 DevTools 验证 SVG 加载优化
    • Flutter - 详情页 TabBar 与模块联动?秒了!
    • Flutter - 详情页初始锚点与优化
    • Flutter - Melos Pub workspaces 实践
    • Flutter webview 崩溃率上升怎么办?我的分析与解决方案
    • Flutter 多仓库本地 Monorepo 方案与体验优化
    • Flutter 拖拉对比组件,换装图片前后对比必备
    • Flutter 3.44 插件内置 Kotlin (KGP) 双向兼容适配指南
    • Flutter 无障碍开发实战:玩转 Semantics 解决视障用户使用痛点
    • 玩转 WebSocket:从原理到 Flutter 实战
    • 别在 Flutter 的 main() 里乱锁屏幕方向,小心 iPad 分屏功能被你搞没了
    • Flutter 3.44 性能飞跃:深度解析 Android Platform View 的 HCPP 新特性
    • 给 Flutter 插件加上 Swift Package Manager 支持
    • 彻底搞懂 Dart Stream:从底层原理到 Flutter 实战与面试题集
    • 别被“Flutter 传感器延迟 150ms”带偏了:这可能只是你的实现方式错了
    • StatefulWidget 里的隐形炸弹:为什么不要在 State 类中使用 context.mounted
    • 深入理解 Flutter 架构:从 Widget 到 GPU 像素的全链路解析
    • 深度拆解 Dart 事件循环:从面试题看清 Microtask 与 Event Queue 的执行顺序
    • Flutter FocusNode 实战指南:玩转键盘焦点与用户输入体验
    • iOS 27 强制要求 UISceneDelegate:UIKit 和 Flutter 开发者该如何应对?
    • Flutter 实战:为你的 App 增加桌面快捷方式 (Quick Actions)
    • 玩转 Flutter 项目依赖:从 pubspec.yaml 到实战包管理
    • Flutter 居然能直接跑在 Apple Watch 上了?玩转 flutter-watchos
      • 一、背景:不再需要“两层皮”的方案
      • 二、上手:flutter-watchos 实战流程
        • 1、基本命令
        • 2、开发模式
      • 三、深度细节:原生能力与避坑指南
        • 1、平台识别的坑
        • 2、原生能力集成
        • 3、手表端特有的交互
      • 四、最后:总结与限制
    • 玩转 Dart typedef:不仅是函数别名那么简单
    • Impeller 时代:Shader Jank 消失了,但渲染性能的战场也变了
  • 移动端
  • Flutter开发
GitLqr
2026-08-09
目录

Flutter 居然能直接跑在 Apple Watch 上了?玩转 flutter-watchos

欢迎关注微信公众号:[FSA全栈行动 👋]

# 一、背景:不再需要“两层皮”的方案

以前想在 Apple Watch 上用 Flutter 开发,基本没啥靠谱的方案。

主流的做法通常是:用 Flutter 把 iPhone 端写好,然后为了适配手表,还得专门用 SwiftUI 把手表端的界面重新写一遍,最后再通过 Method Channel 或者别的桥接手段让两者同步。这种“两层皮”的做法非常折磨人,你不仅要维护两套 UI,还得维护两套业务逻辑和平台决策,代码的复杂度直接翻倍。

虽然 Android 端的 Wear OS 对 Flutter 比较友好,但 Apple Watch 这一块一直是个缺口。好在现在有个叫 flutter-watchos 的第三方工具链,它直接把 watchOS 变成了 Flutter 的一个目标平台。

这玩意儿其实不是在搞 WebView 套壳,也不是什么远程渲染,而是实打实的 Flutter Engine 直接跑在 watchOS 设备上。也就是说,你写的 Dart 代码和 Flutter Widget 是直接在手表本地渲染的。

# 二、上手:flutter-watchos 实战流程

这个工具链的使用体验其实跟标准的 Flutter 开发非常接近,上手门槛并不高。

# 1、基本命令

它的入口非常熟悉,创建和运行的逻辑几乎没变:

# 创建一个支持 watchos 平台的项目
flutter-watchos create my_watch_app --platforms=watchos
cd my_watch_app

# 运行项目
flutter-watchos run

# 2、开发模式

我在测试时发现,它的开发流程跟平时玩 Flutter 差不多:

  • 模拟器调试:在 watchOS Simulator 上,你可以享受完整的开发闭环,包括 Hot Reload(热重载)、DevTools 以及极快的迭代速度。

  • 真机调试:在配套的物理手表上,由于 watchOS 不允许在硬件上进行 JIT 编译,所以代码会被编译成 AOT 模式安装到设备上。虽然真机没法像模拟器那样玩热重载,但 DevTools 依然可以连接上去,查看实时的帧率和性能表现。

这里有个建议:在把应用推向用户之前,一定要在真机上测性能。毕竟模拟器跑起来很流畅,但在手表这种功耗和散热极其敏感的设备上,性能表现跟模拟器完全是两码事。

# 三、深度细节:原生能力与避坑指南

虽然能跑起来是第一步,但要真正写出“像那么回事”的手表应用,还得处理好几个核心细节。

# 1、平台识别的坑

这是最容易踩坑的地方。flutter-watchos 在构建时会给 watchOS 一个独立的运行时身份,这让它能像原生应用一样运行。

你会发现,在手表上运行时,Platform.operatingSystem 会返回 watchos,Platform.isWatchOS 会返回 true。但要注意,此时 Platform.isIOS 竟然也是 true,且 defaultTargetPlatform 依然是 TargetPlatform.iOS。这其实是为了让 Cupertino 组件能直接套用 iOS 的风格,不需要改动 Flutter Framework。

避坑指南: 如果你在 lib/ 目录下写了一段通用的代码,里面直接用了 Platform.isWatchOS,那么你的应用在编译 iOS 或 Android 端时会直接报错,因为标准的 Dart SDK 里根本没有这个属性。

如果你想写跨平台逻辑,请务必使用 flutter_watchos 包提供的 FlutterWatchosPlatform.isWatch 方法。它能完美处理这种差异,在非手表设备上安全地返回 false。

# 2、原生能力集成

一个实用的插件系统是 Flutter 能否落地的关键。flutter-watchos 采用的是 Federated Plugin 模型,这让它能很好地扩展。

目前官方和社区已经适配了不少常用的包。下面我整理了一下目前的适配情况:

能力分类 已支持的包 / 解决方案 说明
基础存储 shared_preferences, flutter_secure_storage 无缝衔接,写法不变
传感器/设备 sensors_plus, geolocator, device_info_plus, battery_plus 获取物理设备数据
网络请求 http, dio, NetworkImage 内部处理了 watchOS 的 Socket 限制
交互与多媒体 url_launcher, video_player, audioplayers 支持标准的交互流程
适配包 flutter_watchos 相关实现包 需在 pubspec.yaml 中显式添加

特别提醒: 如果一个插件包含了 Native iOS 代码,你可能需要手动为它写一个 watchOS 的实现层。

# 3、手表端特有的交互

在手表上,有两个东西是你必须关注的:

  • Digital Crown (数码表冠):它不仅能控制 Flutter 的 Scrollview 滚动,还可以通过 flutter_watchos 包获取原始的旋转数值,用来做一些类似拨盘、旋钮的自定义交互。

  • 文本输入:当你点击 TextField 时,它会自动唤起系统级的 watchOS 键盘。这种设计非常聪明,开发人员不需要处理复杂的键盘逻辑。

# 四、最后:总结与限制

flutter-watchos 目前还处于测试阶段(Closed Beta),虽然它展示了非常强悍的潜力,但我们还是要清醒地认识到它的边界。

目前还没解决的限制:

  • 环境要求:必须在 macOS + Xcode 环境下开发。

  • 编译限制:真机只能运行 AOT 编译后的版本,没法热重载。

  • 权限/发布:需要通过 App Store 的审核流程,且部分功能(如 Push Notifications)需要通过特殊的 AppDelegate 适配。

  • 设计压力:手表屏幕小、性能预算紧,所有的 Shader 效果(如波纹、翻页)都得慎重使用,一定要盯着性能指标看。

如果你想尝试,可以先从一个小功能入手,看看 Flutter 在手腕上的表现如何。总的来说,这套工具链让 Flutter 开发者终于不用在 SwiftUI 和 Dart 之间来回横跳了,这确实是个很棒的进步。

相关资源:

  • flutterwatch.dev (opens new window)

  • GitHub 仓库 (opens new window)

#Apple Watch#watchOS#flutter-watchos#Digital Crown
上次更新: 2026/08/14, 01:29:12
玩转 Flutter 项目依赖:从 pubspec.yaml 到实战包管理
玩转 Dart typedef:不仅是函数别名那么简单

← 玩转 Flutter 项目依赖:从 pubspec.yaml 到实战包管理 玩转 Dart typedef:不仅是函数别名那么简单→

最近更新
01
Java 26 终于原生支持 HTTP 3 了:告别 Netty,直接用 QUIC
08-13
02
拒绝 AI 乱写代码:手把手教你玩转 Claude Code 的工程化技能集
08-12
03
Impeller 时代:Shader Jank 消失了,但渲染性能的战场也变了
08-11
更多文章>
Theme by Vdoing | Copyright © 2020-2026 FSA全栈行动
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式
×