如何将图标放入svg圆圈？答案

【问题标题】：How to place icon into svg circle?如何将图标放入svg圆圈？
【发布时间】：2021-05-12 22:51:52
【问题描述】：

出于某种原因，我需要用 svg 创建一个按钮。

这是我现在的代码，我发现图标将位于不同的位置，而不是在圆圈内。

如何将图标放入圆圈中？

<Svg height="100%" width="100%">
  <TouchableOpacity>
    <Icon type="ionicon" name="camera" size={40} />
    <Circle r="6%" cx="50%" cy="90%" fill="white" />
  </TouchableOpacity>
</Svg>

【问题讨论】：

这能回答你的问题吗？ Icon into SVG Circle
@AbanoubAsaad 谢谢。我进行了修改，现在可以使用了。
很高兴听到这个消息！

标签： react-native svg

【解决方案1】：

我使用下面的代码。

<Svg height="100%" width="100%">
  <TouchableOpacity>
    <Circle r="6%" cx="50%" cy="90%" fill="white" />
    <Text
      dx="50%"
      dy="91%"
      textAnchor="middle"
      fontSize="36"
    >
      &#x1f4f7;
    </Text>
  </TouchableOpacity>
</Svg>

【讨论】：