Векторные иконки для Android и IOS

Question

Векторные иконки для Android и IOS

В https://www.npmjs.com/package/react-native-ionicons мы даем два способа загрузки иконок для iOS и Android. Я попробовал оба подхода с v9.0.0 @expo/vector-icons.

Я импортирую Ionicons с этим утверждением:

import { Ionicons } from '@expo/vector-icons';

Удалить IOS / MD от имени

<Ionicons name="close-circle" size={25} style={{color: 'white'}} />

Я получаю приведенную ниже ошибку, которая также происходит для других имен значков:

Предупреждение: Сбой типа реквизита: неверное имя реквизита значения close-circle передано в Icon, ожидается одно из...

Если я передам свойства ios / android, значок просто не появится, и я не получу предупреждение, например:

<Ionicons ios="ios-close-circle" android="md-close-circle" size={25} style={{color: 'white'}} />

Мое текущее исправление основано на том, как я могу создать кроссплатформенный значок в реагировать родной, Я использую:

<Ionicons name={${Platform.OS === "ios" ? "ios" : "md"}-close-circle} size={25} style={{color: 'white'}} />

Есть ли более простой способ?

Спасибо!

0

javascript react-native expo react-native-vector-icons vector-icons

Источник

user6633000 15 июн '19 в 22:18

2 ответа

Другие вопросы по тегам javascript react-native expo react-native-vector-icons vector-icons

user7256411 16 июн '19 в 07:59 2019-06-16 07:59 · Answer 1 · 2019-06-16 07:59

Так, предупреждение говорит о том, что имя, которое вы указали, не совпадает с иконками Ionicons. Два способа ее решения будут

Передача правильного имени компоненту. Чтобы найти все имена, посетите здесь
импортировать Ionicons из '@expo/vector-icons/Ionicons' .

Надеюсь, если вам поможет!

user6633000 18 июн '19 в 04:59 2019-06-18 04:59 · Answer 2 · 2019-06-18 04:59

Похоже, это был недосмотр с моей стороны. README для @expo/vector-icons гласит:

Эта библиотека представляет собой слой совместимости вокруг @oblador/ Reaction-native-vector-icons для работы с системой активов Expo.

Я не знаю, что заставило меня проверить документацию для https://www.npmjs.com/package/react-native-ionicons но ясно, что параметры, которые могут быть применены к нему, не предназначены для работы с @oblador/ реагировать -native-vector-icons и, таким образом, @expo/vector-icons...

Для всех, кто интересуется кроссплатформенными иконками с expo / vector-icons, вы можете обратиться к вопросу и решению, приведенным в разделе Как я могу создать кроссплатформенную иконку в реагировать нативно?