文章同步發表在我的個人 Blog
第一支摺疊 iPhone 出來了，目前 App 要改多少？
今天拿神隊友走一次，分成五步：看官方的影片和工作坊、了解官方的設計原意、拿自己的 App 對照檢查、守住自己對使用者體驗的原則、不盲目照著 AI 的建議做。
先講結果：官方準備了 6 支影片、2 場線上 Group Lab，Human Interface Guidelines（Apple 的設計指南，以下簡稱 HIG）也新增了 iPhone Duo 的章節。對照這些資料檢查神隊友的程式碼，找到 4 個要改的地方；Codex 提了 8 條調整建議，逐條檢查後，直接採用的只有 3 條。
這次沒有安裝新版 Xcode，所以只做到評估，還沒有在 iPhone Duo 的模擬環境上實際跑過。
6 支都是 Tech Talks，每支 7 到 18 分鐘：
| 影片 | 長度 | 講什麼 | 神隊友要不要看 |
|---|---|---|---|
| Design for iPhone Duo | 10:45 | 設計原則，控制項在不同姿勢下怎麼移動 | 要，先看這支 |
| Prepare your app for iPhone Duo | 10:10 | 全螢幕、size class、不對稱的 safe area、Split View | 要 |
| Raise the bar with iPhone Duo | 15:43 | 導覽列、工具列、tab bar 移到側邊，項目太多時怎麼收進 overflow | 要，神隊友的按鈕都在這裡 |
| Strike a pose with adaptive layouts on iPhone Duo | 18:01 | 開合時版面怎麼調整、arrangement view、避開轉軸和相機 | 要 |
| Leverage multiple displays and scenes on iPhone Duo | 7:17 | 多視窗、同時用兩個螢幕、讀取轉軸角度 | 之後再看 |
| Build a great camera experience for iPhone Duo | 9:27 | 內外兩顆前鏡頭怎麼切換 | 不用，神隊友沒有用相機 |
另外還有兩場各一小時的 iPhone Duo Group Lab，是 Apple 工程師和設計師線上回答問題的錄影。Apple 也在倫敦和日本辦實體工作坊，要帶自己的專案、用 iPhone Duo 實機測試。
照神隊友的狀況，先看前四支就夠了。
iPhone Duo 有兩個螢幕：闔起來用外螢幕，打開用內螢幕，中間有轉軸，可以像書一樣半開、平放、立起來。HIG 開頭就先講清楚，這還是 iPhone：
Although iPhone Duo is a new form factor, keep in mind that you’re still designing for iPhone, and Designing for iOS patterns and best practices still apply.
面對這麼多種姿勢，官方的建議不是每一種都設計一個版面，而是讓 App 跟著可用空間伸縮：
Don’t reinvent your app when it resizes; allow the existing layout to expand based on the available space instead.
具體來說有三件事跟一般 iPhone 不一樣：
ReservedRegion 自己查位置。要在 iPhone Duo 上用滿整個螢幕，需要 Xcode 27：
When you build with Xcode 26 and earlier, your app doesn’t extend under the status bar and camera.
各種姿勢則要用 Xcode 27 新的 Device Hub 模擬。我現在用的是 Xcode 26.6，這篇先不安裝。
就算家裡沒有 iPhone Duo，準備工作也不會白做。官方文件提到：
If your app already works on iPad and Mac or you’ve prepared your app to resize in iPhone Mirroring, you’re well on your way to supporting iPhone Duo.
也就是說，App 如果已經能在 iPad、Mac 或 iPhone 鏡像輸出的視窗裡跟著大小調整，iPhone Duo 的準備就做了一大半。
Claude Code 照官方文件的檢查項目，逐一對照神隊友的程式碼：
| 地方 | 現在的做法 | 官方怎麼說 |
|---|---|---|
| 卡片詳情的「更多」選單 | 自訂的 … 選單，放在左上角 |
… 只能給系統的 overflow 選單用，自訂選單的動作要併進系統選單 |
| 首頁、行事曆的新增按鈕 | 隱藏導覽列，右下角自己疊一顆浮動的「＋」 | 自訂的浮動按鈕不會跟著移到側邊的工具列 |
| 狀態列的淡出效果 | 固定加在畫面頂端 | 控制列可能在左側或右側，內容的空間是不對稱的，要用 safe area 處理 |
| 支援的方向 | 只支援直向 | 每一種姿勢都要旋轉測試，版面依 size class 決定，不看裝置方向 |
第一條，HIG 寫得很直接：
Use the system overflow menu. If your app has its own overflow menu, move those actions into the system menu so people find everything in one place. Reserve the ellipsis symbol for overflow, and give other menus a distinct symbol.
這個 … 按鈕，就是 Day 16 刪除確認對話框彈出來的地方。iOS 26 讓對話框從來源按鈕長出來，Day 16 才把對話框掛到這顆按鈕上；如果把它的動作併進系統的 overflow 選單，對話框從哪裡出現就要重新確認。
第四條，神隊友目前只支援直向，設定寫在 project.yml：
UISupportedInterfaceOrientations:
- UIInterfaceOrientationPortrait # portrait only
神隊友有一條從第一天就寫進規則的核心：對方丟過來、還沒按「知道了」的事，要一直留在首頁頂端。
內螢幕變寬之後，很自然會想把「待你知道」和時間軸左右並排，或像 Mail 那樣，左邊列表、右邊直接顯示卡片內容。HIG 也支持在大螢幕多顯示一層資訊：
Maintain your app’s information hierarchy, but show an additional level of hierarchy on the larger inner display if it makes sense for your content.
但不管怎麼排，有兩件事不能跟著版面改變：
HIG 對摺疊時的建議也一樣：
Avoid extreme layout changes as people fold the device. Move only what’s necessary to keep elements visible and easy to tap.
請 Codex 唯讀看神隊友的程式碼和官方文件，提出支援 iPhone Duo 的建議，一共 8 條。拿官方文件和神隊友自己的設計規範逐條檢查：
| # | Codex 建議 | 判斷 |
|---|---|---|
| 1 | 每個分頁改用 NavigationSplitView，內螢幕上列表和詳情並排 |
方向對，但要改整個導覽架構，先不做 |
| 2 | 「待你知道」卡片寬度改成依實際欄寬計算 | 採用 |
| 3 | 右下的浮動「＋」改成系統工具列的項目 | 跟神隊友的設計規範衝突，要我決定 |
| 4 | 自訂的 … 選單改用系統的 ToolbarOverflowMenu |
採用，但要補上刪除確認來源的影響 |
| 5 | 行事曆的週標頭依可用高度決定要不要固定 | 方向對，要實測才知道 |
| 6 | 表單的 sheet 在開合時保留草稿、不重新搶焦點 | 部分採用 |
| 7 | 狀態列的淡出效果不要固定在頂端 | 採用 |
| 8 | 支援橫向，用 Device Hub 測試各種姿勢 | 方向對，要裝 Xcode 27 實測 |
Codex 提到的 API 都查得到出處，它自己也在開頭註明「未執行模擬器驗證」「新 API 的可用版本仍需以實際 SDK 確認」。問題出在兩個地方：
另外，8 條裡面沒有一條在 iPhone Duo 的環境跑過。沒有實測之前，都只算建議。
| 項目 | 結果 |
|---|---|
| 官方資源 | 6 支影片、2 場 Group Lab、HIG 新章節、技術文件都整理完成 |
| 神隊友要改的地方 | 4 個 |
| Codex 的建議 | 8 條：採用 3 條（#2、#4、#7）、要實測 2 條、部分採用 1 條、先不做 1 條、要我決定 1 條 |
| 實測 | 還沒做，需要 Xcode 27 |
還沒做的部分：
Day 18 裝到兩支 iPhone：開啟開發者模式、跟 Mac 配對、用腳本裝機，開始正式使用。
影片
官方文件
iThome鐵人賽
看影片追技術