您应该在2018年了解的11个React Native库(组件集)

年初,我们发布了关于ReactAngularVue的流行组件集的几种材料。 今天,我们提请您注意React Native上同一系列文章的翻译。 鉴于React的持续流行,以及移动应用程序和PWA变得越来越流行的事实, React Native吸引了开发者社区越来越多的关注也就不足为奇了。



React Native框架与React非常相似,因为它的应用程序鼓励程序员使用隔离的组件创建用户界面。 这些用于接口开发的组件的套件为开发人员提供了现成的模块,使用这些模块有助于加快工作速度,从而节省时间。 在这里,我们讨论了由其创建者很好地支持的11组组件。 希望它们对任何需要在React Native上开发接口的人都派上用场。

1. NativeBase


NativeBase是用于React Native的跨平台用户界面组件集。


本机库

该项目在GitHub上获得了大约1万颗星,并且有大约1000个分支,这一事实表明了NativeBase的高度流行。 NativeBase将数十个跨平台组件供程序员使用。 使用NativeBase时,您无需任何额外的努力就可以使用任何本机的第三方库,并且在此项目周围,有一个广泛的生态系统,其中包含许多有用的东西-从创建基本项目的工具到开发用于配置外部资源的主题的工具 NativeBase组件视图。

2.反应本机元素


跨平台的组件React Native Elements组在GitHub上收集了约1.2万颗星星。 此JavaScript完整集中的组件是高度可定制的。


反应本机元素

该套件的作者 ,React Native Elements中最重要的是组件的结构,而不是其设计。 这意味着配置一个组件并为工作做好准备,只需要很少的模板代码。 同时,使用这些组件的人有机会完全控制其外观。 这样的组件方法可以吸引从初学者到有经验的Web程序员的广泛关注。 这是一个基于React Native Elements构建演示应用程序,您可以通过该应用程序查看该工具包的组件。

3. Shoutem UI工具包


Shoutem界面开发工具套件包括三个部分,该工具套件在GitHub上已收集了3500个星星。 这些是用户界面组件主题和组件动画


舒特姆

Shoutem为开发人员提供了一组专为iOS和Android设计的跨平台组件。 所有组件的创建都考虑到了它们共同使用的可能性。 它们的外观可以定制 。 每个组件还具有与其他组件的样式一致的标准样式。 这样就可以创建复杂的组件,而无需手动配置复杂的样式系统。

4. UI小猫


UI Kitten组件套件(在GitHub上拥有约3,000个星标的所有者)可用于高度可定制且适合重用的开发人员React Native组件。


ui小猫

UI Kitten基于将样式定义移动到特定位置的想法,这有助于重用组件并使其更易于自定义其外观。 正如他们所说,应用于组件的主题非常容易更改,可以将不同的变量集传递给它们。 这是一个演示项目,通过试验,您可以更好地了解UK Kitten。

5. React Native Material UI


React Native Material UI项目在GitHub上拥有约2000个星星,该项目为Web开发人员提供了一套用户界面组件,这些组件实现了Google的Material Design想法并可进行自定义。 在使用React Native Material UI时,值得考虑的是,该库使用了一个名为uiTheme JS对象,以确保通过上下文传递最大程度的自定义。


React Native Material UI

默认情况下, uiTheme对象基于uiTheme主题,可以在此处找到。 这里是库组件的列表及其使用示例。

6.反应本机材料套件


尽管React Native Material Kit于 2017年12月在NPM上发布,但值得关注的这套组件在GitHub上约有4000星。


反应本机材料套件

React Native Material Kit为开发人员提供了一系列简单,方便的用户界面组件和主题,这些组件实现了Google的Google Material Design概念。 为什么这组组件值得关注? 重点在于它的简单性,以及其中没有多余的东西会造成信息性的“噪音”。 但是,应注意,由于未特别积极地支持该库,因此应谨慎使用。

7. Nachos用户界面


Nachos UI库在GitHub上有1500个明星,它为开发人员提供了30多个自定义组件集,这些组件除了在移动环境中作为React Native应用程序的一部分使用之外,还适合使用react-本机网络


玉米片ui

Nachos UI支持更漂亮的,纱线的和开玩笑的测试。 这个很好的,编写良好的库为所有感兴趣的人提供了有趣的设计和全球主题管理器。

8. React Native UI库


React Native UI Library项目的工作是在Wix上完成的。 它是用于开发用户界面的超现代工具集,以及用于React Native的组件库。 React Native UI库无需额外的编程工作即可支持react-native-animatablereact-native-blur



React Native UI库

该库包含一组样式的预设(包括颜色,版式,阴影,边框半径等),这些预设被转换为修饰符。

这是使用React Native UI库的示例。

9. React Native Paper


React Native Paper的跨平台组件库在GitHub上拥有约1500个星标,遵循了Google的Material Design构想。


反应本机纸

这套组件支持全局主题 。 如有必要,为了摆脱该集合中未使用的模块,您可以对babel使用适当的插件。 这是使用React Native Paper的示例。

10.反应本机矢量图标


React Native Vector Icons项目已经在GitHub上聚集了大约1万颗星,它是React Native应用程序的大量自定义图标的集合 ,适用于各种平台。


反应本机矢量图标

来自React Native Vector Icons的图标用于数千个应用程序中。 它们可能对您有用。

11.茶具


Teaset库在GitHub上收集了约1300个星星,其中包含20多个用纯JS(ES6)编写的组件。


茶具

该项目不能拥有丰富的文档,但是其组件的简单性(专注于满足React Native应用程序的基本需求)及其漂亮的外观表明,Teaset至少值得一看。

总结


在本材料的开头,我们谈到了一个事实,即由于React的盛行和移动应用程序的普及,React Native吸引了开发者社区越来越多的关注。 因此,毫不奇怪的是,实现用于创建基于React Native的应用程序的组件或辅助工具集的像样开发的数量不能局限于我们上面检查的那些。 如果您正在为自己的React Native应用程序寻找类似的东西,那么这里还有一些值得关注的项目:


亲爱的读者们! 如果您正在基于React Native开发移动应用程序,请告诉我们您为此使用了哪些组件和辅助工具集。

Source: https://habr.com/ru/post/zh-CN420613/


All Articles