react native svg

react-native-svg обеспечивает поддержку SVG для реагирования нативного на iOS, Android, MacOS, Windows и уровня совместимости для Интернета.

Проверьте пример приложения

• Функции
• Установка
• Поиск неисправностей
• ВОЗВРАЩЕНИЕ
• Использование
• Известные проблемы

Функции

1. Поддерживает большинство элементов и свойств SVG (Rect, Circle, Line, Polyline, Polygon, G ...).
2. Легко преобразовать код SVG в реагирование-родной-SVG.

Установка

С выставкой

✅ Приложение Expo Client поставляется с установленным собственным кодом!

Установите JavaScript с:

npx expo install react-native-svg

Смотрите Docs Expo для получения дополнительной информации или подпрыгните на использование.

С React-Cli

1. Установить библиотеку

   от NPM

   npm install react-native-svg

   от пряжи

   yarn add react-native-svg

2. Ссылка нативного кода

    cd ios && pod install

Поддерживаемые реагирующие версии

React-Native-Svg	реагируемый
3.2.0	0,29
4.2.0	0,32
4.3.0	0,33
4.4.0	0,38
4.5.0	0,40
5.1.8	0,44
5.2.0	0,45
5.3.0	0,46
5.4.1	0,47
5.5.1	> = 0,50
> = 6	> = 0,50
> = 7	> = 0,57,4
> = 8	> = 0,57,4
> = 9	> = 0,57,4
> = 12.3.0	> = 0,64,0
> = 15.0.0	> = 0,70,0
> = 15.8.0	> = 0,73,0

Поддержка ткани

Ткань реагирует новую систему рендеринга Native. Начиная с версии 13.0.0 этого проекта, ткань поддерживается только для реагирования 0,69,0+. Поддержка более ранних версий невозможна из -за нарушения изменений в конфигурации.

React-Native-Svg	реагируемый
> = 13.0.0	0,69,0+
> = 13.6.0	0,70,0+
> = 13.10.0	0,72,0+

Поиск неисправностей

Неожиданное поведение

Если у вас есть неожиданное поведение, пожалуйста, создайте чистый проект с последними версиями реагируемых и реагирующих по-нен-

react-native init CleanProject
cd CleanProject/
yarn add react-native-svg
cd ios && pod install && cd ..

Сделайте воспроизведение проблемы в App.js

react-native run-ios
react-native run-android

Добавление поддержки Windows

1. npx react-native-windows-init --overwrite
2. react-native run-windows

ВОЗВРАЩЕНИЕ

Убедитесь, что это все еще проблема с последней версией, указанной на предыдущем шаге. Если это так, откройте новую проблему, включите весь файл App.js , укажите, какие платформы вы протестировали, и результаты запуска этой команды:

react-native info

Если вы подозреваете, что нашли ошибку соответствия спецификации, то вы можете протестировать, используя свой компонент в проекте React-Native-Web, разбейте этот код и ящик, чтобы увидеть, как разные браузеры видят один и тот же контент: https://codesandbox.io. /s/pypn6mn3y7, если есть вечнозеленый браузер со значительной базой пользователей или другим пользовательским агентом SVG, лучше отображает некоторое содержание SVG или поддерживает больше SVG и связанных спецификаций, откройте проблему как можно скорее.

Использование

Чтобы проверить, как использовать библиотеку, см. Использование.md

Известные проблемы:

1. Невозможно применить точку фокусировки радиалаграда на Android.

React Native SVG поддерживается программным особняком

С момента 2012 года Mansion - это программное агентство с опытом создания веб -и мобильных приложений. Мы являемся основными нативными участниками и экспертами в решении всевозможных нативных проблем. Мы можем помочь вам построить вашу следующую мечту продукта - нанять нас.