将样式添加到React-native-paper按钮元素的图标中

发布于 2025-01-28 02:08:07 字数 663 浏览 4 评论 0原文

我在与图标的反应纸纸中使用按钮。我只需要在按钮的图标中添加阴影样式。我发现的唯一可用选项是在按钮中添加高程。但是它应用于整个按钮,而不是仅应用于按钮的图标。

按钮的代码:

<Button
  icon={icon}
  onPress={onPress}
  size={size}
  color={color}
  animated={animated}
  disabled={disabled}
  style={styles.btnStyles}
/>

添加阴影的按钮样式:

btnStyles: {
  elevation: 40,
  shadowColor: '#000',
  backgroundColor: 'rgba(0,0,0,0)',
},

结果:
在此处输入图像描述

(在这里,您可以看到阴影应用于按钮,而不是内部的图标。)

我如何求解上述问题并仅在图标中添加阴影?

提前致谢。

I use button in react-native-paper with icon. I need to add a shadow style only to the icon of the button. The only available option I found was to add an elevation to the button. But it is applied to the whole button instead of applying only to the icon of the button.

The code of button:

<Button
  icon={icon}
  onPress={onPress}
  size={size}
  color={color}
  animated={animated}
  disabled={disabled}
  style={styles.btnStyles}
/>

The Style of button to add shadow:

btnStyles: {
  elevation: 40,
  shadowColor: '#000',
  backgroundColor: 'rgba(0,0,0,0)',
},

The result:
enter image description here
(Here you can see that the shadow is applied to the button, not to the icon inside.)

How can I solve above issue and add a shadow only to the icon?

Thanks in advance.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文