限制與疑難排解

Figma 和轉譯限制

支援的 Figma 圖層類型

Relay 僅支援下列圖層類型：

  • 文字節點
  • 圖片節點 (PNG、JPEG 等)
  • 畫面節點 (自動版面配置和非自動版面配置)
  • 元件和變化版本、元件執行個體
  • 向量節點

不支援的 Figma 圖層與功能

  • 原型設計功能
  • 遮蓋群組
  • Slice 圖層

不支援的 Figma 屬性

有幾個不支援的屬性，包括：

  • 內陰影、圖層模糊處理及背景模糊處理
  • 圖層旋轉 (支援向量旋轉)
  • 圖層或筆劃混和模式 (支援填滿混和模式)
  • 文字內容：
    • 段落間距
    • 段落縮排
    • 數字樣式
    • 字母形式
    • 文體集
    • 刪除線和底線
    • 行高 (套用至整個文字元素時仍適用)
  • 向量屬性：
    • Android VectorDrawable 格式不支援的功能：
      • 內嵌點陣圖圖片
        • 矩形除外，支援做為圖片 向量
      • 虛線筆劃
      • 模糊處理
      • 陰影
      • 圖形鎖
      • 口罩
      • 群組不透明度
      • 放射漸層焦點
    • SVG 格式不支援的功能：
      • 角度漸層
      • 菱形漸層
    • 向量物件之間的布林作業 (聯集 / 相減 / 交集) / 排除)
      • 解決方法是組合並壓平合併成單一向量

部分支援的 Figma 圖層與屬性

  • 文字項目只有文字項目時，文字截斷 (省略符號) 最為可靠 一行
  • 填滿顏色：
    • 圖片只能採用一種圖片填滿， 其他類型 (例如漸層)
    • 如為漸層，僅支援線性。日後推出的版本 支援其餘漸層類型 (放射狀、菱形、 和角度)。
    • 在 Figma 外掛程式中，無法指定參數可 可接受多個供應廣告如要將填滿顏色參數化 參數目前支援單色
  • 投射陰影：
    • 投射陰影目前不適用於下列圖層：
      • 非矩形向量
      • 旋轉矩形向量
    • 每個圖層不支援多個投射陰影。
    • 「一般」以外的投射陰影混和模式僅適用於 搭載 Android 10 以上版本 (除非另有忽略)。
    • 圖層的投射陰影僅適用於 Android 9 以上版本，但 文字，但 Compose 支援所有 Android 版本都提供。
    • 在 Compose 中，陰影將一律在透明圖層後方顯示。
  • 自動版面配置中的絕對定位：
    • 絕對定位物件必須位於所有範圍的後方或前方 顯示頁框中自動版面配置元素的元素任何絕對位置 在自動版面配置元素之間疊加的物件，會推送至 找到這些物件的前方
    • 以絕對定位物件建立巢狀結構的自動版面配置頁框 也可能使其他自動版面配置頁框產生不正確的版面配置 巢狀頁框的定界框會受到 這個影格

如果傳遞至只有一種樣式的文字參數，則會捨棄多種樣式

如果父項元件嘗試將包含多個樣式的文字傳遞至巢狀結構中 只有一種樣式的元件文字參數會遺失 產生的 Compose 程式碼只有文字參數的原始樣式是 保存。

必須進行降級，以免發生類型不符的情況，進而 編寫程式碼如果元件中的文字有多種樣式， 產生的可組合項將包含 AnnotatedText 參數如果 元件只有一個樣式，產生的可組合函式將採用純樣式 String 參數。在上述情境中，我們需要轉換父項 將元件的 RTF 格式從 AnnotatedText 到 String，捨棄多個 樣式，因此可以傳遞至巢狀元件執行個體。

子類屬性與父項元件相同的巢狀元件無法編譯

如果兩個元件中的 [設計變化版本]{:.external} 具有相同屬性 名稱、將另一個巢狀結構與另一個巢狀結構，在產生的程式碼中 兩個變體的名稱相同，並且會有編譯錯誤：

Conflicting import, imported name '(variant property)' is ambiguous

如要解決此問題，請變更其中一個元件的變化版本屬性名稱。

字型支援

我們目前僅支援 Google Fonts 的字型。

Android Studio 疑難排解

我收到在 Windows 中轉換 SVG 資源的錯誤

FAILURE: Build failed with an exception.
*   What went wrong:
Execution failed for task ':app:generateDebugRelayCode'.
> A failure occurred while executing com.google.relay.gradle.GenerateCode$GenerateCodeWorkAction
      > Converting SVG files: Exception Converting SVG resources for my_packaged_component
        The syntax of the command is incorrect

您的 Android Studio 專案名稱可能過長。在 Windows 上， Android Studio 專案的長度不得超過 70 個字元。我們正努力 請提高日後推出的版本長度

更新無法匯入 Android Studio

外掛程式只會下拉 Figma 檔案的最新已命名版本。 請再次檢查您的 Figma 檔案是否使用新的已命名版本 變更。

建構時收到 SVG 與 Java 執行階段的錯誤

Converting SVG Files: Exception running shell command 'cd /path-to/relay/bin; path/to/relay/bin/vd-tool -c -in path/to/hello_card -out /var/folders/...'.
The operation couldn't be completed. Unable to locate a Java Runtime.
Please visit http://www.java.com for information on installing Java.

安裝 Java 執行階段，然後重新建構。

建構時收到字型錯誤

您可能會看到以下相似的錯誤：

FAILURE: Build failed with an exception.
*   What went wrong:
Execution failed for task ':app:generateDebugRelayCode'.
> Multiple task action failures occurred:
   > A failure occurred while executing com.google.relay.gradle.GenerateCode$GenerateCodeWorkAction
      > /Users/me/AndroidStudioProjects/MyProject/app/build/generated/res/relay/debug/font/relay_inter_bold.ttf
   > A failure occurred while executing com.google.relay.gradle.GenerateCode$GenerateCodeWorkAction
      > /Users/me/AndroidStudioProjects/MyProject/app/build/generated/res/relay/debug/font/relay_inter_bold.ttf

這是因為競爭狀況所致：多個元件嘗試複製 設為同一個目錄我們正在設法解決此問題。同時， 只要重新建構即可

在 Android Studio 中，無法復原已刪除的 UI 套件資料夾

刪除 Android 中 ui-packages 資料夾中的「UI Package」資料夾 然後復原刪除動作，資料夾中所有 可能無法正確還原。

解決方法：重新匯入所需的 Figma 檔案版本 檔案 >新增 >匯入 UI 套件... 您也可以點選 匯入「UI 套件」資料夾，確保檔案能夠正確還原。

在 ui-package 外更新資源不會強制執行新版本

更新 ui-packages 目錄外的依附元件 (例如 主題對應檔案或參照元件檔案) 並不會強制要求程式碼 重新產生專案

解決方法：如要強制更新產生的程式碼，請清除專案 (請前往 建構 >清除專案)，或刪除系統產生的程式碼資料夾 需要更新的 UI 套件然後重新建構。

Android 專案瀏覽器中缺少產生的程式碼或 ui-packages 個資料夾

在某些情況下，Relay for Android Studio 外掛程式產生的資料夾沒有提供 會顯示在 Android 專案瀏覽器中。

解決方法：如要重新載入專案資料夾，請在頂層資料夾上按一下滑鼠右鍵， 選取 [從磁碟重新載入]。

未更新子項元件的應用程式主題

使用新的應用程式主題重新匯入父項元件時，其子項 元件 (列於 DEPS.txt 中) 並不會採用新主題。

解決方法：從父項元件的預覽主題複製 config.json，並取代您可以在每個階段 各自的 config.json。重新建構後，子項元件中的主題 修正產生的程式碼

UI 套件名稱必須以字母開頭

如果 UI 套件名稱不是以字母為開頭，則 Relay 將產生 Compose 未編譯的程式碼，並顯示錯誤訊息 The resource name must start with a letter。

解決方法：在 Figma 中重新命名 UI 套件名稱，讓名稱以字母為開頭。

Compose 中的字型邊框間距與 Figma 不符

Figma 和 Compose 會在定界框內以不同方式排列文字。Compose 新增 邊框間距增加。

解決方法：您必須將 Figma 中的文字位置向上移動幾個像素。 這樣就能在 Compose 中正確對齊我們正在設法提供永久的修正方案。