如何為 iOS 14 創建 App Clips

已發表: 2020-12-21

隨著 iOS 14 的出現，我們有機會為我們的應用程序用戶創造全新的體驗。 我說的是 App Clips，它是完整應用版本的一小段摘錄。 作為 Miquido 的開發人員之一，我想分享我創建它們的經驗。

我們將討論三個主題——首先，項目的準備。 其次——如何創建 App Clip，最後，我會提到一些關於測試和分發的事情。

項目準備

在考慮將 App Clip 添加到我們的應用程序時，我們必須記住一個基本規則——我們需要使用我們代碼庫中的當前代碼。 App Clip 實際上是我們應用程序的一個片段。 它使用相同的模型和視圖，所以當我們考慮創建 App Clips 時，我們需要相應地設計我們的架構。

如果我們已經以模塊化方式準備了我們的應用程序架構，那麼向其中添加 App Clip 會容易得多。 否則，這是重構的好時機。 它將在未來使我們受益，因為添加更多目標將更容易和更快。

人機界面指南

在我們打開 Xcode 並深入了解實現 App Clip 的細節之前，我想提一下 Apple 的人機界面指南。 遵循這些是一個很好的做法，因為 Apple 提供了一些最佳的用戶體驗提示。

要記住的一些最重要的點：

  • 專注於基本特徵；
  • 設計一個線性的、易於使用的、專注的用戶界面；
  • 避免要求人們在從您的 App Clip 中受益之前創建一個帳戶

為 iOS 14 創建 App Clip

現在讓我們打開 Xcode 並加載您的項目。 通過選擇File> New> Target> App Clip創建一個新的 App Clip 目標。 您將能夠為界面使用 Swift UI 或 Storyboard，為 App Clip 生命週期使用 Swift UI 或 UIKit 應用程序委託。 選擇正確的項目和應用程序，然後單擊創建。

在我們在 Xcode 中配置我們的 URL 之前，我們需要在我們的 Web 服務器上創建相關的域文件。 為此，我們需要創建一個名為apple-app-site-association的文件，該文件具有 JSON 結構：

應用剪輯

應用程序的值應該是 App Clip 的應用程序標識符 - <Application Identifier Prefix>.<Bundle ID> 。

在我們配置我們的 apple-app-site-association 文件後，我們需要向我們的主機應用程序目標和 App Clip 的目標添加一個關聯域權利。 因此，iOS 將能夠處理指向應用程序的鏈接。 如果用戶沒有安裝完整版的應用程序，App Clip 將被啟動。 如果可以訪問完整版。 它將正常啟動。

任何運行 App Clip 的 URL 都應該在Associated Domains功能中列出，並帶有 appclips 前綴（例如，appclips: test.example）。 它們還應該列在主機應用程序的關聯域下。

關聯域功能

正如我在開頭提到的，App Clip 與我們的完整應用程序共享功能，這就是為什麼我們必須決定要在兩個目標之間共享哪些代碼部分。 在向 App Clip 添加功能時，可能會出現不需要完整版應用程序中的某些代碼的情況，或者我們只能根據需要添加代碼。 為了實現這一點，我們可以使用Active Compilation Conditions 。 我們可以決定將哪些部分的代碼編譯成完整版的應用程序，哪些只用於 App Clip 的需要。 您可以通過選擇Build Settings選項卡，然後選擇Swift Compilers – Custom Flags -> Active Compilation Conditions在 App Clip 目標中輕鬆管理它們。

主動編譯條件
主動編譯條件2

添加目標並為其分配適當的功能後，我們可以繼續進行測試。 您可以在模擬器或物理設備上運行 App Clip。 為此，您必須提供調用 URL 作為環境變量。 這樣，您可以檢查您的 App Clip 在不同 URL 調用和不同查詢參數下的行為。

要訪問環境變量，請從方案下拉列表中選擇 App Clip 目標，然後單擊Edit Scheme 。 選擇運行操作和參數選項卡。 在Environment Variables標題下，編輯_XCAppClipURL的值。 如果不存在，請將其添加為鍵並將其值設置為調用 URL。 確保選中該複選框。 Apple 建議為我們的 App Clip 體驗創建涵蓋大多數用例的通用 URL。 如果我們需要指定一個需要不同於默認的路線，請將其添加為不同的體驗，並帶有新的圖像、標題和其他參數。

啟動時傳遞的參數

測試應用剪輯卡

有一件重要的事情要記住——一旦你構建了 App Clip 目標，你就不會在你的設備上看到它的卡片。 要對其進行測試，您需要添加所謂的Local Experience ，即物理設備上的本地環境。 這在測試 QR 碼或 NFC 標籤調用時特別有用。 在撰寫本文時，Apple 尚未發布創建 App Clip Codes 所需的工具，這些工具本質上是 Apple 專有的 QR 碼。 根據我們的需要，我們可以輕鬆地將其替換為經典的二維碼。

在您的物理設備上安裝 App Clip 後，進入設置 -> 開發人員 -> 本地體驗中的本地環境，然後選擇註冊本地體驗。 系統將提示您：

  • 調用 App Clip 的 URL 前綴
  • 複製 App Clip 卡片的標題和副標題
  • 號召性用語
  • 標題圖片
  • 您的 App Clip 的包標識符

創建或掃描 NFC 標籤或 QR 碼以觸發具有特定 App Clip 的本地環境。

註冊本地體驗

準備 Clip App 進行測試和分發

現在您已經構建了 App Clip，是時候測試和分發它了——我們可以為此目的使用TestFlight 。 我們必須記住，與用戶不安裝 App Clips 以及 App Clips 不出現在主屏幕上的方式類似，測試人員不會安裝 App Clip 的 beta 版本。 相反，測試人員會啟動您為測試配置的 App Clip 體驗。

App Store Connect 中有一個 App Clip 部分，您必須在其中提供標題圖像、副標題和操作。 此元數據出現在 App Clip Card 中。 您只能在上傳編譯後的文件後編輯此部分。 進一步向下滾動頁面後，我們可以看到為應用審閱者添加 URL 以測試 App Clip 的功能。 如果您使用查詢參數，請確保至少包含兩個用於測試的 URL。

首映時間

在我們的 iOS 開發人員完成測試後，是時候發布我們的 App Clip 了。 這個任務非常簡單——如果我們計劃發布宿主應用程序，App Clip 將與它一起向所有用戶公開。 我們的第一個 App Clip 現已發布，可供用戶發現！

您想為您的業務使用應用程序剪輯嗎？ 聯繫我們的專家，看看我們能如何提供幫助！