如果为 mat-tab-group 设置了 [backgroundColor] 属性，则子控件的波纹效果将丢失 [英] Ripple Effect is lost for child controls if [backgroundColor] Property is set for a mat-tab-group

问题描述

如果为 mat-tab-group 设置了 [backgroundColor] 属性，子控件会失去波纹效果，是否有任何解决方法.?

Child Controls Loses Ripple Effect if [backgroundColor] property is set for mat-tab-group, is there any workaround.?

查看此 Stackblitz 示例以查看问题

推荐答案

涟漪效应正在起作用，但我们无法看到它，因为涟漪颜色是白色的.它采用白色，因为您已将 backgroundColor 设置为主要颜色，而您的主要颜色是蓝色，前景色为白色.波纹会自动采用这种前景色.

The ripple effect is working but we are not able to see it as the ripple color is white. It is taking white color because you have set backgroundColor to primary and your primary color is blue which has foreground white. The ripple automatically takes this foreground color.

有两种方法可以解决

1. 如果您的 backgroundColor 设置为深色，则通过为 matRippleColor 属性提供颜色，在您的情况下为主要颜色和警告颜色.

1. By providing color to matRippleColor attribute if your backgroundColor set to dark color, in your case its primary and warn.

   <div class="div-style mat-elevation-z4" matRipple matRippleColor="rgba(0,0,0,.1)>Ripple</div>

通过设置灯光backgroundColor.在你的情况下它的accent.

这篇关于如果为 mat-tab-group 设置了 [backgroundColor] 属性，则子控件的波纹效果将丢失的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！