Figma i ograniczenia tłumaczenia
Obsługiwane typy warstw Figma
Relay obsługuje tylko te typy warstw:
- Węzły tekstowe
- Węzły obrazu (PNG, JPEG itp.)
- Węzły ramek (układ automatyczny i bez układu automatycznego)
- Komponenty i wersje, instancje komponentów
- Węzły wektorowe
Nieobsługiwane warstwy i funkcje Figma
- Funkcje prototypowania
- grupy maskowania,
- Warstwy wycinka
Nieobsługiwane właściwości Figma
Jest kilka nieobsługiwanych właściwości, w tym:
- Cień wewnętrzny, rozmycie warstwy i rozmycie tła
- Obrót warstw (obsługa rotacji wektorów jest obsługiwana)
- Tryby mieszania warstw lub mieszania kreski (obsługiwany jest tryb mieszania wypełnienia)
- Właściwości tekstu:
- Odstępy w akapicie
- Wcięcie akapitu
- Styl liczb
- Litery
- Stylizowane plany zdjęciowe
- Przekreślenie i podkreślenie
- Wysokość wiersza (działa nadal po zastosowaniu do całego elementu tekstowego)
- Właściwości wektorowe:
- Funkcje nieobsługiwane w formacie
VectorDrawable
na Androidzie:- osadzone obrazy bitmapowe,
- Z wyjątkiem prostokątów, które są obsługiwane jako obrazy, a nie wektory
- Kreski przerywane
- Rozmycie
- Cień
- Wzór
- Maska
- Przezroczystość grupy
- Punkt centralny gradientu promieniowego
- osadzone obrazy bitmapowe,
- Funkcje nieobsługiwane w formacie SVG:
- Gradienty kątowe
- Romb
- Operacje logiczne na obiektach wektorowych (łączenie / odejmowanie / przecinanie / wykluczanie)
- Obejściem jest połączenie i spłaszczenie w jeden wektor
- Funkcje nieobsługiwane w formacie
Częściowo obsługiwane warstwy i właściwości Figma
- Obcinanie tekstu (wielokropek) działa najpewniej, gdy element tekstowy składa się tylko z jednego wiersza
- Kolor wypełnienia:
- Obrazy mogą mieć tylko jedno wypełnienie ale mogą też mieć dodatkowe wypełnienia innego typu (np.gradientowe).
- W przypadku gradientów obsługiwana jest tylko linia liniowa. W kolejnych wersjach wprowadzimy dodatkową obsługę pozostałych typów gradientu (promieniowego, diamentowego i kątowego).
- We wtyczce Figma nie ma sposobu na określenie, czy parametr może akceptować wielokrotne wypełnienia. Jeśli chcesz określić kolor wypełnienia, obsługujemy obecnie tylko kolory stałe
- Z cieniami:
- Obecnie cienie nie działają na tych warstwach:
- Wektory nieprostokątne
- Obrócony prostokątny wektor
- Nie można stosować wielu cieni na warstwę.
- Tryby mieszania z cieniem inne niż „Normalny” są dostępne tylko na Androidzie 10 i nowszych (w przeciwnym razie są ignorowane).
- Funkcja cieniowania na warstwach jest dostępna na urządzeniach z Androidem w wersji 9 i nowszych. Nie dotyczy to tekstu, który jest dostępny we wszystkich wersjach Androida obsługujących tworzenie wiadomości.
- W trybie tworzenia cienie zawsze będą widoczne za przezroczystymi warstwami.
- Obecnie cienie nie działają na tych warstwach:
- Pozycjonowanie bezwzględne w układzie automatycznym:
- Obiekty umieszczone w określonej pozycji muszą znajdować się za lub przed wszystkimi elementami, które automatycznie układają się w klatce. Wszystkie obiekty znajdujące się bezwzględnie nałożone na elementy o automatycznym układzie są przesunięte na pierwszy plan.
- Zagnieżdżanie klatek z układem automatycznym z absolutnie umieszczonymi obiektami w innych ramkach z automatycznym układem może spowodować nieprawidłowy układ, ponieważ na ramkę ograniczającą zagnieżdżonej ramki mają wpływ elementy umieszczone w tej ramce.
Wiele stylów jest usuwanych po przekazaniu do parametru tekstowego z jednym stylem
Jeśli komponent nadrzędny próbuje przekazać tekst z wieloma stylami do zagnieżdżonego parametru tekstowego komponentu z tylko jednym stylem, te style zostaną utracone w wygenerowanym kodzie tworzenia. Zachowany jest tylko pierwotny styl parametru tekstowego.
To ograniczenie jest konieczne, aby uniknąć niezgodności typów uniemożliwiające kompilowanie wygenerowanego kodu. Jeśli tekst w komponencie ma wiele stylów, wygenerowany element kompozycyjny będzie miał parametr AnnotatedText
. Jeśli tekst w komponencie ma tylko jeden styl, wygenerowany element kompozycyjny będzie miał zwykły parametr String
. W powyższym scenariuszu musimy przekonwertować tekst sformatowany komponentu nadrzędnego z AnnotatedText
na String
i pominąć wiele stylów, aby można go było przekazać do wystąpienia komponentu zagnieżdżonego.
Nie można skompilować zagnieżdżonych komponentów o tych samych właściwościach wariantu co komponent nadrzędny
Jeśli 2 komponenty mają [wariant projektu]{:.external} z tą samą nazwą właściwości, a jeden z nich zagnieżdża drugi, w wygenerowanym kodzie wyliczenia utworzone dla 2 wersji będą miały tę samą nazwę i wystąpi błąd kompilacji:
Conflicting import, imported name '(variant property)' is ambiguous
Aby obejść ten problem, zmień nazwę właściwości wariantu jednego z komponentów.
Obsługa czcionek
Obecnie obsługujemy tylko czcionki z Google Fonts.
Rozwiązywanie problemów z Android Studio
Pojawił się błąd dotyczący konwertowania zasobów SVG w systemie Windows
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
Nazwa projektu Android Studio może być za długa. W systemie Windows pełna ścieżka projektu Android Studio nie może mieć więcej niż 70 znaków. Pracujemy nad tym, by wydłużyć ten czas w kolejnej wersji.
Aktualizacje nie są importowane do Android Studio
Wtyczka pobierze tylko najnowszą wersję pliku Figma. Dokładnie sprawdź, czy została utworzona nowa wersja pliku Figma ze zmianami.
Podczas kompilacji pojawia się błąd dotyczący środowiska wykonawczego SVG i 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.
Zainstaluj środowisko wykonawcze Java i skompiluj jeszcze raz.
Podczas tworzenia pojawia się błąd dotyczący czcionek
Może pojawić się błąd podobny do tego:
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
Jest to spowodowane warunkiem rasy: wiele komponentów próbuje skopiować tę samą czcionkę do tego samego katalogu. Pracujemy nad rozwiązaniem tego problemu. W międzyczasie po prostu spróbuj ponownie.
W Android Studio cofnięcie usuniętego folderu pakietu UI może się nie udać
Jeśli usuniesz folder pakietu UI z folderu ui-packages
w Android Studio, a następnie cofniesz usunięcie, każdy plik w tym folderze, który nie został otwarty przed usunięciem, może nie zostać prawidłowo przywrócony.
Obejście: zaimportuj ponownie potrzebny plik Figma, wybierając kolejno Plik > Nowy > Importuj pakiety interfejsu. Podczas importowania możesz też kliknąć każdy plik w folderze pakietu UI, by mieć pewność, że zostanie poprawnie przywrócony.
Aktualizowanie zasobów poza pakietami UI nie wymusza nowej kompilacji
Aktualizacja zależności znajdującej się poza katalogiem ui-packages
(np. pliku mapowania motywu lub pliku komponentu referencyjnego) nie wymusza ponownego wygenerowania kodu podczas kompilacji projektu.
Obejście: aby wymusić aktualizację wygenerowanego kodu, wyczyść projekt (otwórz Kompilowanie > Oczyść projekt) lub usuń wygenerowany folder kodu powiązany z pakietem UI, który wymaga aktualizacji. Potem skompiluj jeszcze raz.
W przeglądarce projektów na Androidzie brakuje wygenerowanego kodu lub ui-packages
folderów
W niektórych przypadkach foldery wygenerowane przez wtyczkę Relay for Android Studio nie wyświetlają się w przeglądarce projektu na Androidzie.
Obejście: aby ponownie załadować foldery projektu, kliknij prawym przyciskiem myszy folder najwyższego poziomu i wybierz „Załaduj ponownie z dysku”.
Motywy aplikacji w komponentach podrzędnych nie są aktualizowane
Jeśli komponent nadrzędny zostanie ponownie zaimportowany z nowym motywem aplikacji, jego komponenty podrzędne (wymienione w DEPS.txt
) nie pobiorą nowego motywu.
Obejście: skopiuj motyw podglądu z komponentu nadrzędnego (config.json
) i zastąp nim motywy podglądu komponentów podrzędnych w każdym elemencie config.json
. Po odbudowaniu motywy w wygenerowanym kodzie komponentów podrzędnych zostaną naprawione.
Nazwa pakietu w UI musi zaczynać się od litery
Jeśli nazwa pakietu UI nie zaczyna się od litery, usługa Relay wygeneruje kod tworzenia, który się nie skompiluje, i wyświetli komunikat o błędzie The resource name
must start with a letter
.
Obejście: w aplikacji Figma zmień nazwę pakietu UI Package, aby zaczynała się od litery.
Dopełnienie czcionki w sekcji Utwórz nie pasuje do Figmy
Aplikacje Figma i Compose inaczej rozmieszczają tekst w obrębie ramki ograniczającej. Tworzenie powoduje dodanie dodatkowego dopełnienia wzdłuż górnej krawędzi ramki ograniczającej.
Obejście: musisz przesunąć lokalizację tekstu na Figmie o kilka pikseli w górę, aby wyrównać go w widoku Compose. Pracujemy nad trwałym rozwiązaniem problemu.
Polecane dla Ciebie
- Uwaga: tekst linku jest wyświetlany, gdy JavaScript jest wyłączony
- Informacje o pakiecie UI i wygenerowanym kodzie
- Wiele stylów w tekście
- Mapowanie komponentów na istniejący kod