React Native如何像QR码标记一样只在正方形的角落制作边框答案

【问题标题】：React Native how to make border to the corner of the square only like QR code markerReact Native如何像QR码标记一样只在正方形的角落制作边框
【发布时间】：2020-07-09 10:38:06
【问题描述】：

我正在尝试制作如下图所示的二维码标记。

所以我想知道如何制作这 4 个角而不是完整的边框标记。

我目前使用的是react-native-qrcode-scanner。

默认标记是这样的：

这是我的代码：

<QRCodeScanner
        // containerStyle={{ height: '100%' }}
        // cameraStyle={{ height: '100%' }}
        onRead={handleScan}
        showMarker
        markerStyle={{ borderColor: colors.primary, borderRadius: 20 }}
        cameraProps={{
          captureAudio: false,
          flashMode: RNCamera.Constants.FlashMode.auto,
        }}

但我想把它改成我给的第一张图片。

如果有人可以提供帮助，我们将不胜感激。谢谢

【问题讨论】：

您好，很抱歉打扰您。我也有你这样的问题。你解决这个问题。如果可以的话，能否分享一下代码。我阅读了文档，但我没有 React Native 的经验。我希望你分享代码。如果你同意我的假设。你能把代码发给我吗？我的电子邮件 gllistenstar00@gmail.com。谢谢

标签： react-native border qr-code react-native-stylesheet

【解决方案1】：

如果它是一条直线，那么通过设置边界半径会很容易。但由于它有点不同，你可以通过使用这个库来实现这一点：

RN-svg ，在这里你可以提供xml模式，它会相应地呈现，你只需要定位在标记旁边就可以了。

希望有所帮助。如有疑问，请随意

【讨论】：

能否提供一个工作代码...将不胜感激