javascript - 如何使用 React Native 将图像分割成小部分并在单击时显示它们？

Question

This is what I'm aiming to achieve我正在 React Native 中制作一个小测验游戏，您可以通过单击图像的不同部分来猜测图像。最初，图像位于多个小“ block ”后​​面，单击它们它们就会消失。如何以最优雅的方式实现这个功能呢？我正在考虑制作多个小 View ，每个 View 具有相同的大小，然后单击它们就会消失。这是一个好方法吗？这是我想要实现的目标的图像: Guess image app

Answer 1

在我看来，你的方法是唯一的。如果您尝试分割图像，则必须处理一些问题:

1. 您可能需要使用一些工具将图像分割成更小的图像。由于该工具的功能、图像的数量、图像的大小以及您在应用中包含和管理图像的方式，这实际上是不必要的，除非您想炫耀您的技能。
2. 对于 1 个图像，如果您想让该级别变得更难，例如:创建更多 block 来隐藏它，您必须再次分割该图像。即使您有库可以做到这一点，您的性能也会受到严重影响。

这些是您使用 blocks 时的一些 Prop :

1. 不需要分割图像(当然)，所以告别那些降低性能的库。
2. 您可以用这些 blocks 做很多事情，例如:通过添加更多 block 、创建 block 的动画(如滚动或定相等)来增加难度。
3. 如果您不想将绝对位置设置为 <Image/>组件，RN已内置<ImageBackground/>组件来满足您的要求。