如何使用 react-native 制作模糊效果? [英] how to make the blur effect with react-native?

查看：73 发布时间：2021/12/6 22:11:55 image image-processing react-native blur

本文介绍了如何使用 react-native 制作模糊效果?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

如何使用 react-native 制作模糊效果?像背景图像"

how to make the blur effect with react-native ? like 'background-image'

我想切换'blur'和'none'的效果，'none'表示没有模糊效果

and i want to switch the effect 'blur' and 'none'，'none' means no blur effect

现在，您无需任何库即可使用道具:blurRadius.

Now you can do this without any library using the prop: blurRadius.

例如

<Image
    style={styles.img}
    resizeMode='cover'
    source={imgSrc} 
    blurRadius={1}
/>

说明:数字 (1) 表示您要应用于图像的模糊量，数字越大，图像越模糊.

Explanation: the number(1) means the amount of blur you want to apply on the image, the higher the number, the blurrier the image.

~~不幸的是，这还不适用于 Android (RN 0.40.0).不过，对于只需要 iOS 解决方案的人来说，它可能很有用.~~

~~Unfortunately, this doesn't work on Android yet (RN 0.40.0). Nevertheless, it could be useful to who's looking for only an iOS solution.~~

它现在似乎可以在 Android 上运行了.

It seems to be working on Android now.

这篇关于如何使用 react-native 制作模糊效果?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文