Реагирует ли использование фреймворка на пользовательский интерфейс, когда вам приходится сильно настраивать стили? - PullRequest
1 голос
/ 02 апреля 2019

Например, Material-UI дает вам вид материала дизайна.

Когда вы создаете веб-сайт, дизайн которого не имеет ничего общего с пользовательским интерфейсом материалов, разумно ли использовать материал-пользовательский интерфейс в качестве структуры пользовательского интерфейса?

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

Но член нашей команды, который отвечает за применение дизайна для реагирования компонентов, считает, что ui-framework часто вызывает больше проблем с получением дизайна, который он дал.

Есть ли способ использовать функциональные возможности сложных компонентов пользовательского интерфейса, но при этом имеет минимальное трение для настройки стиля?

Может быть, есть ли zeroing-out все стили пользовательского фреймворка вплоть до базовых (интересно, имеет ли это смысл)?

Ответы [ 2 ]

2 голосов
/ 02 апреля 2019

Да, это разумный вопрос.Обидно, что так много работы уходит на функциональность компонентов библиотеки, но тогда вы заперты в интерфейсе MaterialUI.

Если сайт не был спроектирован как сайт MaterialUI (т.е.дизайнер строго не следовал рекомендациям по разработке MaterialUI), тогда ваш член команды прав, использование библиотеки компонентов MaterialUI, вероятно, плохая идея.Лично я не слышал о какой-либо «обнуленной» библиотеке, и, как правило, эти библиотеки очень сложно настроить, кроме настройки темы.

Лучшим подходом для imo было бы использование высококачественных автономных компонентов React, которыене навязывают какой-либо конкретный стиль и легко настраиваются для достижения любых сложных частей приложения.Есть хороший выбор:

  • Сдвиг для выпадающих списков / заголовков / автозаполнения
  • React Burger Menu для боковых панелей
  • React Tiny Popover для всплывающих подсказок и всплывающих окон
  • React Modal для модальных сообщений
  • И т.д.
0 голосов
/ 02 апреля 2019

Большая часть кода компонента Material-UI связана с реализацией внешнего вида Material Design.Несмотря на то, что стиль очень настраиваемый, если вы не стремитесь к внешнему виду, который хотя бы в некоторой степени выровнен с Material Design, вы можете создать для себя много дополнительной работы, если вам нужно значительно отменить / переопределить стиль по умолчанию длябольшинство компонентов.

При этом компоненты Material-UI структурированы таким образом, что вы можете использовать некоторые строительные блоки более низкого уровня для создания собственных компонентов.Например, InputBase и ButtonBase являются строительными блоками, используемыми для создания различных типов входов и кнопок в Material-UI.

Вы можете посмотреть на https://mui -treasury.com / для некоторых примеров существенной настройки некоторых компонентов Material-UI.

Даже если вы не используете компоненты Material-UI ("@ material-ui / core"),вы все еще можете найти значительную пользу в использовании пакетов @ material-ui / styles и @ material-ui / system , чтобы помочь вам с собственным решением для стайлинга.И если вы решите создать свои собственные компоненты, вы можете использовать исходный код Material-UI как полезный ресурс о том, как работать с конкретными компонентами.

...