reactjs - 如何在 React Native 中实现 Font Awesome 堆栈图标功能

标签 reactjs react-native font-awesome react-native-vector-icons

使用 React Native 实现堆叠/重叠图标。

我正在尝试在 react native 中实现这样的目标:
https://fontawesome.com/how-to-use/on-the-web/styling/stacking-icons

如何实现这一目标?

最佳答案

你可以通过这样做来实现这一点。使用宽度和高度可以帮助您将 View 保持在适当的位置并将所有内容对齐到中心,使其看起来像堆叠的图标一样漂亮。 enter image description here

<View style={{
        position:"relative",
        justifyContent:'center',
        alignItems:"center",
        width:40,
        height:40
      }}>
         <Icon name="circle" size={34} color={"black"} />
         <Icon name="flag" size={20} color={"white"} style={{position: 'absolute', zIndex: 99}} />  
      </View>

https://snack.expo.io/HkxWerHBr

关于reactjs - 如何在 React Native 中实现 Font Awesome 堆栈图标功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57701466/

相关文章:

reactjs - 如何在React应用程序中全局捕获错误

reactjs - react 路由器,history.push 之后的代码运行?

css - 如何在自己的 CSS 中使用很棒的字体?

vue.js - 如何在 Element UI 中使用 Font Awesome 5 图标

javascript - Uncaught Error : Parse Error: Line 13: Unexpected identifier

reactjs - React-Spring useTransition 随机排列我的列表项

javascript - LogBox 忽略在 native react 中不起作用的警告?

javascript - 如何在 React Native 中进行搜索?

javascript - 不能在 react-native 中使用 uuid4

css - Font Awesome 和网站从旧版本到最新版本的转换