React Native中容器边界内的浮动标签

xzlaal3s 于 2023-02-16 发布在 React

关注(0)|答案(1)|浏览(130)

我尝试在容器的边框内添加一个标签（标题）。虽然有很多输入字段的实现都有这个功能，但我还没有找到任何一个普通容器的。下面是我所指的内容的截图：

我考虑过给文本添加背景，但由于容器的背景与其背后的背景不同，这将不会起作用，因为颜色会冲突。有人知道如何在React Native中实现这一点吗？

1条答案

我还没有在react-native中实现这一点，所以我不能说这是否适合你，但我已经在一个Web应用程序中完成了这一点，然后在标签上使用linear-gradient背景，并添加了一些padding-left和padding-right：

label {
  background-image: linear-gradient(transparent 50%, #666 50%);
  padding-left: 3px;
  padding-right: 3px;
}

十六进制值将是输入的背景色。