vs2015 设置框架_2015年使用的5大材料设计框架

vs2015 设置框架

Google's Material Design has taken the internet UI world by storm. Since it's arrival on Google's Inbox and then progressive across Google’s network sites, many web applications like ******** have begun deploying the framework. Material Design has introduced us to a simple yet meaningful philosophy of modern UI design.

Google的Material Design席卷了互联网UI世界。 自从它到达Google的收件箱 ,然后在Google的各个网站上逐步发展以来,许多网络应用程序(例如********)已经开始部署该框架。 Material Design向我们介绍了现代UI设计的一种简单而有意义的哲学。

vs2015 设置框架_2015年使用的5大材料设计框架

Material Design is one of the most comprehensive and polished design philosophies that we have seen in recent years and I suspect many of us will want to implement it in the coming year. So, let’s look at what I think are five of the best material design-based frameworks to use in your project.

材料设计是近年来我们看到的最全面,最完善的设计哲学之一,我怀疑我们许多人都希望在来年实现它。 因此,让我们看看我认为在项目中使用的五个基于最佳材料设计的框架是什么。

角材料 (Angular Material)

Angular Material seems to be the big brother of all the material design frameworks that are available today because of Angular’s popularity and the fact that it’s supported internally at Google.

由于Angular的流行以及Google内部支持的事实,Angular Material似乎是当今可用的所有材料设计框架中的老大哥。

vs2015 设置框架_2015年使用的5大材料设计框架

The documentation, demos and the API reference is well written and comprehensive and portrays all the features that were specified by Google in it’s material design philosophy.

文档,演示和API参考均写得很好,内容全面,并描绘了Google在其材料设计理念中指定的所有功能。

实现 (Materialize)

Materialize is a responsive front-end design framework based on Material Design that you can use in your application just like Bootstrap. This is undoubtedly one of the most impressive Material Design frameworks. It provides both CSS and SCSS files along with JavaScript, material design icons and Roboto font.

Materialize是一个基于Material Design的响应式前端设计框架,您可以像Bootstrap一样在应用程序中使用它。 无疑,这是最令人印象深刻的材料设计框架之一。 它提供CSS和SCSS文件以及JavaScript,材质设计图标和Roboto字体。

You can use this framework just like Bootstrap by importing the CSS and you are good to go.

您可以像导入Bootstrap一样使用此框架,只需导入CSS,就可以了。

vs2015 设置框架_2015年使用的5大材料设计框架

The project is open-source and the source code of the project is available on Github.

该项目是开源的,该项目的源代码可在Github上获得

材质界面 (Material UI)

Material UI is a CSS Framework that makes use of React components to implement the material design philosophy. Although this framework is quite robust, you might want to skip it if you are not 100% comfortable working with Facebook’s React. Some newbies to React find it’s JSX (Javascript and XML) syntax quite unconventional.

Material UI是一个CSS框架,它利用React组件来实现材料设计理念。 尽管此框架非常健壮,但如果您不是100%满意使用Facebook的React,则可能要跳过它。 React的一些新手发现它的JSX(Javascript和XML)语法非常不常规。

The repository of this framework has good documentation on how to set up this framework and install React using npm (Node Package Manager). You can access the repository of Material UI here.

该框架的存储库提供了有关如何设置该框架以及如何使用npm(节点包管理器)安装React的良好文档。 您可以在此处访问Material UI存储库

vs2015 设置框架_2015年使用的5大材料设计框架

MUI CSS框架 (MUI CSS Framework)

MUI CSS Framework is a lightweight framework for sites and provides an easy ‘bootstrap-like’ solution for your front-end requirements. Since it is designed from ground-up, it is slightly faster than some of it’s competitors and it’s recommended to use in small projects, where the main focus is not the precise implementation of material design.

MUI CSS框架是用于站点的轻量级框架,可为您的前端需求提供简单的“类似于引导程序”的解决方案。 由于它是从头开始设计的,因此它比某些竞争对手要快一些,因此建议在小型项目中使用,这些项目的主要重点不是材料设计的精确实现。

vs2015 设置框架_2015年使用的5大材料设计框架

Interested in contributing code to the project? You can find it's repository here.

有兴趣为该项目贡献代码吗? 您可以在此处找到它的存储库。

聚合物 (Polymer)

Google’s Polymer Project which advocates the use of web-components for web development, has also released their own take on Material Design.

提倡使用Web组件进行Web开发的Google的Polymer Project也发布了自己对Material Design的看法。

vs2015 设置框架_2015年使用的5大材料设计框架

The Polymer core elements set includes several elements for application layout, including creating toolbars, app bars, tabs, and side nav consistent with the material design guidelines.

聚合物核心元素集包括几个用于应用程序布局的元素,包括创建与材料设计指南一致的工具栏,应用程序栏,选项卡和侧面导航。

判决 (The Verdict)

So, perhaps you are considering implementing a Material Design UI in your next project? If so, I would advise that you start with the Materialize as this framework works just like Bootstrap with the elements accessible through CSS classes.

因此,也许您正在考虑在下一个项目中实现Material Design UI? 如果是这样,我建议您从Materialize入手,因为此框架的工作原理与Bootstrap一样,其元素可通过CSS类访问。

Maybe you've used Angular and have enjoyed working with Angular's Animation function? If so, then your best bet may be Angular Material, since it is very full-featured and backed by Google’s very considerable resources.

也许您已经使用过Angular并喜欢使用Angular的Animation函数? 如果是这样,那么最好的选择可能是Angular Material ,因为它功能齐全,并得到Google大量资源的支持。

Material Design appears to have a very promising future in the UI design world. It is very well-researched and polished and we’re seeing more and more websites have begun integrating Material Design based frameworks each month.

在UI设计世界中,Material Design似乎有着非常有希望的未来。 经过非常仔细的研究和完善,我们看到越来越多的网站每月开始集成基于Material Design的框架。

So, are we looking at a long term design direction or is this a more fickle fashion trend? Personally I think there's every chance we may face a Material-Design-saturated future, just as we have a Bootstrap-saturated Internet right now.

那么,我们是在寻找长期的设计方向还是这是一个更加善变的时尚趋势? 我个人认为,就像我们现在拥有Bootstrap饱和的Internet一样,我们很有可能面临Material-Design饱和的未来。

What are your thoughts on the above mentioned frameworks? What material design frameworks have you used?

您对上述框架有何看法? 您使用了哪些材料设计框架?

翻译自: https://www.sitepoint.com/top-5-material-design-frameworks-use-2015/

vs2015 设置框架