css - 如何在 React Native 中使文本在图像周围 float

标签 css react-native flexbox

我正在尝试实现一种非常常见的效果,即让文本环绕图像。在 Web 上,您可以为图像分配一个 float 属性,然后在它后面加上一个 p 标签。 Here is how I want my elements to flow .

这是一个RNPlay example我一直在努力。我认为我目前使用的方法有点老套,而且不能正常工作,因为文本没有与图像顶部对齐并向下流动。是否有适当且干净的方法来完成此操作?

最佳答案

您可以使用 Text 作为容器而不是典型的 View

<Text style={{flex: 1}}>
  <Image source={Images.IconExplore} style={{ width: 16, height: 16 }} />
  <Text> Your past has been in control for far too long. It's time to shift to a higher expression of what you are capable of so you can create the life you want to live.</Text>
</Text>

enter image description here

关于css - 如何在 React Native 中使文本在图像周围 float ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39514335/

相关文章:

react-native - 从数据源添加/删除 ListView 项时,对它们进行动画处理

android - 找不到 com.android.tools.build :gradle:2. 3.+ 的任何匹配项,因为没有可用的 com.android.tools.build:gradle 版本

jquery - 随机化 svg 笔划的颜色

html - 如何将图像显示为 div 的背景?

react-native - React Native Building版本未反射(reflect)调试所做的更改(Android)

javascript - 为什么切换 flex-direction 时顺序最低的元素会滚动到视口(viewport)中?

html - 如何在 css 的 flexbox 中保持 img 的纵横比?

html - Flex 网格在 Safari 上未正确呈现 - Flex 元素没有高度

html - 如何在wordpress页面中居中菜单

javascript - 点击展开div不起作用