我正在使用下面的风格,我试图画虚线边框的风格,但它总是来固体。请建议。
<View style={{paddingLeft:10, height:300, marginBottom:10, borderWidth:1, borderStyle: 'dashed', borderColor:'red', borderTopColor:'white'}}>
//谢谢
7gs2gvoe1#
您需要添加borderRadius: 1才能使其工作。
borderRadius: 1
laik7k3q2#
试着跟着它走应该行
borderStyle: 'dotted', borderRadius: 1,
iibxawm43#
根据github问题注解(https://github.com/facebook/react-native/issues/24224):
<View style={[{ height: 1, overflow: 'hidden' }]}> <View style={[{ height: 2, borderWidth: 1, borderColor: '#ddd', borderStyle: 'dashed' }]}></View> </View>
7uzetpgm4#
试试这个对我来说很好用;-)
<View style={{ height: '100%', borderRadius : 1, width: '100%', borderStyle: 'dashed', borderWidth: 1, borderColor: 'rgba(161,155,183,1)'}} />
t40tm48m5#
以下操作将非常有效:
<View style={{ paddingLeft:10, height:300, marginBottom:10, borderStyle: 'dashed', borderRadius: 1, borderWidth: 1, borderColor: 'red', borderTopColor:'white' }} />
3mpgtkmj6#
值得补充的是,需要使用borderRadius将borderRadius应用于全局的所有边,而不是将其应用于单个边,因为这似乎打破了Android上的样式化边界。在我的例子中,我使用的是Tailwind实用程序样式rounded-2xl:
borderRadius
rounded-2xl
"rounded-2xl": { "borderTopLeftRadius": 16, "borderTopRightRadius": 16, "borderBottomRightRadius": 16, "borderBottomLeftRadius": 16 }
把这个换成borderRadius: 16对我来说解决了这个问题。
borderRadius: 16
3wabscal7#
尝试将其添加到代码中
<View style={{borderWidth:1, borderStyle="dashed", width:100, height:100}}></Text>
2nbm6dog8#
删除边框顶部颜色
<View style={{paddingLeft:10, height:300, marginBottom:10, borderWidth:1, borderStyle: 'dashed', borderColor:'red'}}>
8条答案
按热度按时间7gs2gvoe1#
您需要添加
borderRadius: 1
才能使其工作。laik7k3q2#
试着跟着它走应该行
iibxawm43#
根据github问题注解(https://github.com/facebook/react-native/issues/24224):
7uzetpgm4#
试试这个对我来说很好用;-)
t40tm48m5#
以下操作将非常有效:
3mpgtkmj6#
值得补充的是,需要使用
borderRadius
将borderRadius应用于全局的所有边,而不是将其应用于单个边,因为这似乎打破了Android上的样式化边界。在我的例子中,我使用的是Tailwind实用程序样式
rounded-2xl
:把这个换成
borderRadius: 16
对我来说解决了这个问题。3wabscal7#
尝试将其添加到代码中
2nbm6dog8#
删除边框顶部颜色