Можно ли использовать библиотеку UI материалов с React Native?

Question

Я уже давно использую реагирование и знаю, что Material UI https://material-ui.com/ - это библиотека пользовательского интерфейса, созданная для реагирования. Мой вопрос - возможно ли использовать эту библиотеку (которая построена для реагирования) с реактивной?

В некоторых исследованиях, которые я обнаружил, у реактивного натива есть другая библиотека пользовательского интерфейса, называемая реактивная нативная бумага, но мне было интересно, совместим ли Material-UI с реагирующим нативом?

Answer 1

material-ui - реализация системы проектирования материалов, основанная на реакции. Он предназначен для веб-разработки, и вы получите вывод HTML / CSS (который является строительным блоком каждой веб-страницы).

Reaction-native - это инфраструктура, которая позволяет вы создаете собственные мобильные приложения, используя возможности и синтаксис React. Родной язык программирования мобильных приложений зависит от мобильной операционной системы, которую вы сейчас используете. Платформа React Native дает вам возможность программировать в стиле React, и на выходе будет скомпилированная версия (os-speci c) с использованием родного языка ОС.

К сожалению, эти два не совсем работать вместе, и вы не можете просто взять React lib и использовать его в своем реактивном коде.

Answer 2

Материал UI создан для ReactJS (веб-приложения), поэтому он не работает вместе с React Native . Тем не менее, вот список нескольких библиотек, с которых вы можете начать:

1. реагировать-родной-материал-нижняя навигация

Это Material UI * Библиотека 1016 * позволяет нам добавить очень крутой материал нижней навигации со всеми его привилегиями в чистом javascript. У него нет нативных зависимостей, он прост в использовании и настройке, плюс он выглядит потрясающе.

npm install react-native-material-bottom-navigation

---

2. реагировать-нативный материал-выпадающий список

Ищете выпадающие компоненты, которые отлично выглядят и выглядят как нативные? Эта выпадающая библиотека материалов делает именно это. Раскрывающийся пользовательский интерфейс материалов с согласованным поведением на iOS и Android, который также поддерживает ландшафтный режим .

npm install --save react-native-material-dropdown

---

3. реакция-нативная привязка-карусель

Я использовал несколько компонентов-свиперов в реагировать нативно. Каждый из них работает нормально, но этот выводит вещи на совершенно новый уровень.

npm install --save react-native-snap-carousel

---

4. response-native-material-textfield

Приходит от того же автора выпадающего пакета (перечисленного выше).

npm install --save react-native-material-textfield

---

5. реагировать-родной-материал-меню

Если вам нужна поддержка меню переполнения в React Native, эта библиотека отлично подойдет. Вы можете использовать это на панели инструментов в качестве меню переполнения (дополнительное меню).

npm install --save react-native-material-menu

---

7. response-native-modal-datetime-picker

Модальный DateTimePicker обеспечивает поддержку этой функции в iOs & Android с использованием собственной реализации.

npm i react-native-modal-datetime-picker @react-native-community/datetimepicker

---

7. реагировать-родной-закусочная

Отлично, если вы ищете варианты тостов / закусочных, которые можно легко отобразить в конце, например, вызова API.

npm install react-native-snackbar --save

---

8. реагировать-родной-страна- picker-modal

Этот модуль выбора позволяет пользователю выбирать страны из списка. Имеет поддержку поиска, отложенной загрузки. Темный режим включен.

npm i react-native-country-picker-modal

9. Reaction-native-color

Компоненты цвета для React Native. JavaScript -только, для iOS и Android.

npm i --save react-native-color

---

10. реакция-нативная кладка

Отлично, если вы ' ищем grid списки, которые поддерживают динамические c width & height.

npm install --save react-native-masonry

---