在材料之上构建自定义UI组件库

时间:2019-06-29 23:47:59

标签: angular angular-material

我正在寻找一个有角度的应用程序。我希望最终产品看起来非常特定,而不是目前的材料外观。但是,我想快速行动以迭代我的产品。我不想花费大量时间重新实现角度/材质中已经可用的逻辑。

我正在考虑将要使用的每个材料组件包装到自定义组件中。例如,我将创建一个包装材料工具提示的ui-tooltip组件。然后,在ui-tooltip.style中,我将使用!important标签来强制设置自己的样式。

这是我应该怎么做吗?是否可以在保持功能性的同时从根本上改变材料的设计?是否有项目可以让我指出谁曾经做过?

1 个答案:

答案 0 :(得分:1)

如果您认为Material只需进行一些调整就可以完成您想要的操作,那就太好了。如果要更改功能,则扩展组件是实现此目的的好方法。例如,我在一个团队中创建了自己的Toast样式的组件,该组件可以放置在我们想要的任何位置,而不仅仅是在屏幕边缘。我也是一个将multi-select componentchip list

结合在一起的团队

但是,如果您想主要使用相同的功能而只改变外观,我建议创建一个custom material theme。该文档主要关注颜色,但是使用mixins将使您能够深入到Angular Material组件中,以更改诸如大小,填充和边距之类的内容。